@odla-ai/chapter 0.55.0 → 0.56.0

package/dist/{chunk-VEOGTSVX.js → chunk-IQZWCG42.js}

@@ -294,7 +294,7 @@ function CheckoutSeatChoice(props) {
     try {
       await props.onChange(selected ? { recipientName: name, recipientEmail: email } : null);
     } catch (error2) {
-      setError(error2 instanceof Error ? error2.message : "Could not update your total. Try again.");
+      setError(error2 instanceof Error ? error2.message : "Could not save your selection. Try again.");
     } finally {
       setSaving(false);
     }
@@ -311,7 +311,7 @@ function CheckoutSeatChoice(props) {
       ] }),
       selected ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
         /* @__PURE__ */ jsxs3("label", { children: [
-          "Recipient name",
+          "Full name",
           /* @__PURE__ */ jsx3(
             "input",
             {
@@ -327,7 +327,7 @@ function CheckoutSeatChoice(props) {
           )
         ] }),
         /* @__PURE__ */ jsxs3("label", { children: [
-          "Recipient email",
+          "Email",
           /* @__PURE__ */ jsx3(
             "input",
             {
@@ -342,9 +342,9 @@ function CheckoutSeatChoice(props) {
             }
           )
         ] }),
-        /* @__PURE__ */ jsx3("p", { children: "This seat belongs to one named person and cannot be reassigned. They must accept and complete their own application and any required interview. It renews and ends with your membership. Contact the chapter if you need a refund." })
+        /* @__PURE__ */ jsx3("p", { children: "For one named person, who completes their own application and any required interview. Non-transferable; renews and ends with your membership." })
       ] }) : /* @__PURE__ */ jsx3("p", { children: "You can add someone from your member page after paying." }),
-      dirty ? /* @__PURE__ */ jsx3("button", { type: "submit", disabled: saving, children: saving ? "Updating total\u2026" : "Update total" }) : null
+      dirty ? /* @__PURE__ */ jsx3("button", { type: "submit", disabled: saving, children: saving ? "Saving\u2026" : amount === 0 ? "Save member details" : "Update total" }) : null
     ] }),
     error ? /* @__PURE__ */ jsx3("p", { role: "alert", children: error }) : null
   ] }) });
@@ -357,7 +357,7 @@ function MembershipPaymentStep(props) {
   const copy = props.copy ?? inherited.join.payment;
   const [quote, setQuote] = useState4(null);
   const [locked, setLocked] = useState4(false), [editing, setEditing] = useState4(Boolean(props.initialNamedSeat));
-  const [seatTerms, setSeatTerms] = useState4(false), [prefillConsumed, setPrefillConsumed] = useState4(false);
+  const [prefillConsumed, setPrefillConsumed] = useState4(false);
   const [error, setError] = useState4(false);
   const [revision, setRevision] = useState4(0);
   useEffect(() => {
@@ -372,7 +372,6 @@ function MembershipPaymentStep(props) {
       if (live) {
         setQuote(value);
         setLocked(Boolean(value.checkoutStarted));
-        setSeatTerms(Boolean(value.checkoutStarted));
         setEditing(Boolean(props.initialNamedSeat && !prefillConsumed && !value.namedSeat && !value.checkoutStarted && value.seatOffer));
       }
     }).catch(() => {
@@ -419,13 +418,12 @@ function MembershipPaymentStep(props) {
     });
     if (!response.ok) {
       if (response.status === 409) refresh();
-      throw new Error(response.status === 400 ? "Enter a different recipient's name and valid email." : "Could not update your total. Reload payment terms and try again.");
+      throw new Error(response.status === 400 ? "Enter a different recipient's name and valid email." : "Could not save your selection. Reload payment terms and try again.");
     }
     const value = await response.json();
     if (value.applicationId !== props.applicationId || !/^[a-f0-9]{64}$/.test(value.digest)) throw new Error(copy.setupFailed);
     setQuote(value);
     setEditing(false);
-    setSeatTerms(false);
     setPrefillConsumed(true);
   };
   return /* @__PURE__ */ jsxs4(Fragment3, { children: [
@@ -509,29 +507,18 @@ function MembershipPaymentStep(props) {
       ] }) : null,
       quote.trustCopy ? /* @__PURE__ */ jsx4("p", { className: "pay-trust", children: quote.trustCopy }) : null
     ] }),
-    quote.namedSeat && !editing ? /* @__PURE__ */ jsxs4("label", { className: "journey-consent", children: [
-      /* @__PURE__ */ jsx4(
-        "input",
-        {
-          type: "checkbox",
-          checked: seatTerms,
-          disabled: locked,
-          onChange: (event) => setSeatTerms(event.currentTarget.checked)
-        }
-      ),
-      "I agree to the additional-member terms and renewal with my membership."
-    ] }) : null,
-    !editing && (!quote.namedSeat || seatTerms) ? /* @__PURE__ */ jsx4(
+    !editing ? /* @__PURE__ */ jsx4(
       PaymentStep,
       {
         ...props,
         refundPolicyText: quote.refundPolicyText,
         merchantDisclosureText: quote.merchantDisclosureText,
+        copy: { ...copy, consent: quote.namedSeat ? "I agree to the refund policy, renewal terms, and additional-member terms above." : "I agree to the refund policy and renewal terms above." },
         renderPriceLines: void 0,
         startCheckout
       },
       quote.digest
-    ) : editing ? /* @__PURE__ */ jsx4("p", { role: "status", children: "Update the total to continue to payment." }) : null
+    ) : /* @__PURE__ */ jsx4("p", { role: "status", children: "Save your member selection to continue to payment." })
   ] });
 }
 
@@ -1179,7 +1166,7 @@ function MembersArea(props) {
 }
 
 // src/ui/join.tsx
-import { useEffect as useEffect10, useRef as useRef3, useState as useState17 } from "preact/hooks";
+import { useEffect as useEffect11, useRef as useRef3, useState as useState18 } from "preact/hooks";
 
 // src/ui/join-booking.tsx
 import { useEffect as useEffect7, useState as useState11 } from "preact/hooks";
@@ -1318,7 +1305,7 @@ function useTierSelection(tiers, initialTierId) {
     return tiers.length === 1 ? tiers[0].id : null;
   });
   return {
-    tiers,
+    tiers: [...tiers].sort((a, b) => Number(b.id === selectedTierId) - Number(a.id === selectedTierId)),
     selected: tiers.find((tier) => tier.id === selectedTierId) ?? null,
     selectedTierId,
     selectTier: (tierId) => {
@@ -1622,10 +1609,93 @@ function useJoinPending(state, loadResume, setState) {
   }, [state, loadResume]);
 }
 
-// src/ui/join.tsx
+// src/ui/payment-receipt.tsx
+import { useEffect as useEffect10, useState as useState17 } from "preact/hooks";
 import { Fragment as Fragment10, jsx as jsx22, jsxs as jsxs22 } from "preact/jsx-runtime";
+function PaymentReceiptCard({ applicationId }) {
+  const [receipt, setReceipt] = useState17(null);
+  const [error, setError] = useState17("");
+  const [revision, setRevision] = useState17(0);
+  const [emailState, setEmailState] = useState17("idle");
+  const [previewEmail, setPreviewEmail] = useState17(false);
+  const endpoint = `/api/payments/receipt?application=${encodeURIComponent(applicationId)}`;
+  useEffect10(() => {
+    let live = true, timer;
+    setReceipt(null);
+    setError("");
+    setEmailState("idle");
+    const read = async () => {
+      try {
+        const response = await fetch(endpoint, { cache: "no-store" });
+        if (!live || response.status === 404) return;
+        if (response.status === 202) {
+          timer = setTimeout(() => void read(), 2e3);
+          return;
+        }
+        if (!response.ok) throw new Error();
+        const data = await response.json();
+        if (live) setReceipt(data.receipt);
+      } catch {
+        if (live) setError("Your receipt is temporarily unavailable.");
+      }
+    };
+    void read();
+    return () => {
+      live = false;
+      if (timer) clearTimeout(timer);
+    };
+  }, [endpoint, revision]);
+  if (!receipt) return error ? /* @__PURE__ */ jsxs22("section", { "aria-label": "Payment receipt", children: [
+    /* @__PURE__ */ jsx22("p", { role: "status", children: error }),
+    /* @__PURE__ */ jsx22("button", { type: "button", onClick: () => setRevision((value) => value + 1), children: "Reload receipt" })
+  ] }) : null;
+  const money = (cents) => new Intl.NumberFormat("en-US", { style: "currency", currency: receipt.currency }).format(cents / 100);
+  const email = async () => {
+    setEmailState("sending");
+    setError("");
+    try {
+      const response = await fetch(endpoint, { method: "POST" });
+      if (!response.ok) throw new Error();
+      const result = await response.json();
+      setPreviewEmail(result.preview === true);
+      setEmailState("sent");
+    } catch {
+      setEmailState("idle");
+      setError("We could not confirm email delivery. You can print or save your receipt.");
+    }
+  };
+  return /* @__PURE__ */ jsxs22("section", { className: "payment-receipt card", "aria-label": "Payment receipt", children: [
+    /* @__PURE__ */ jsx22("h2", { children: "Payment received" }),
+    /* @__PURE__ */ jsx22("p", { children: receipt.tierName }),
+    /* @__PURE__ */ jsxs22("dl", { className: "journey-summary", children: [
+      /* @__PURE__ */ jsx22("dt", { children: "Membership" }),
+      /* @__PURE__ */ jsx22("dd", { children: money(receipt.membershipCents) }),
+      receipt.namedSeat ? /* @__PURE__ */ jsxs22(Fragment10, { children: [
+        /* @__PURE__ */ jsxs22("dt", { children: [
+          "Additional member \u2014 ",
+          receipt.namedSeat.recipientName
+        ] }),
+        /* @__PURE__ */ jsxs22("dd", { children: [
+          receipt.namedSeat.amountCents === 0 ? "Included \u2014 " : "",
+          money(receipt.namedSeat.amountCents)
+        ] })
+      ] }) : null,
+      /* @__PURE__ */ jsx22("dt", { children: "Total paid" }),
+      /* @__PURE__ */ jsx22("dd", { children: money(receipt.totalCents) })
+    ] }),
+    /* @__PURE__ */ jsxs22("div", { className: "journey-actions", children: [
+      /* @__PURE__ */ jsx22("a", { className: "apply-link journey-secondary", href: `${endpoint}&format=html`, target: "_blank", rel: "noopener noreferrer", children: "Print / save receipt" }),
+      /* @__PURE__ */ jsx22("button", { type: "button", disabled: emailState !== "idle", onClick: () => void email(), children: emailState === "sending" ? "Sending\u2026" : emailState === "sent" ? "Receipt emailed" : "Email me my receipt" })
+    ] }),
+    emailState === "sent" ? /* @__PURE__ */ jsx22("p", { role: "status", children: previewEmail ? "Test receipt sent to the configured test inbox." : "Sent to the email used for your payment." }) : null,
+    error ? /* @__PURE__ */ jsx22("p", { role: "alert", children: error }) : null
+  ] });
+}
+
+// src/ui/join.tsx
+import { Fragment as Fragment11, jsx as jsx23, jsxs as jsxs23 } from "preact/jsx-runtime";
 function JoinIsland(props) {
-  return /* @__PURE__ */ jsx22(JourneyFrame, { children: /* @__PURE__ */ jsx22(JoinFlow, { ...props }) });
+  return /* @__PURE__ */ jsx23(JourneyFrame, { children: /* @__PURE__ */ jsx23(JoinFlow, { ...props }) });
 }
 function JoinFlow(props) {
   const inheritedCopy = useChapterCopy();
@@ -1646,10 +1716,10 @@ function JoinFlow(props) {
   const invitation = invitationState.invitation;
   const selectedTierId = invitation?.skuId ?? tierSelection.selectedTierId;
   const selectedTier = tiers.find((tier) => tier.id === selectedTierId) ?? tierSelection.selected;
-  const [state, setState] = useState17(requestedSeat ? { step: "form" } : props.initialState ?? { step: "form" });
-  const [error, setError] = useState17(null);
-  const [submitting, setSubmitting] = useState17(false);
-  const [giftOfferId, setGiftOfferId] = useState17(props.initialGiftOfferId ?? null);
+  const [state, setState] = useState18(requestedSeat ? { step: "form" } : props.initialState ?? { step: "form" });
+  const [error, setError] = useState18(null);
+  const [submitting, setSubmitting] = useState18(false);
+  const [giftOfferId, setGiftOfferId] = useState18(props.initialGiftOfferId ?? null);
   const simulatedPayment = props.simulation ? props.simulation.payment ?? {
     lineItems: {
       standardCents: selectedTier?.priceCents ?? 0,
@@ -1659,7 +1729,7 @@ function JoinFlow(props) {
   } : void 0;
   const simulatedBooking = props.simulation ? props.simulation.booking ?? { slots: [], timezone: "UTC" } : void 0;
   const submissionId = useRef3(null);
-  useEffect10(() => {
+  useEffect11(() => {
     if (props.simulation) return;
     const resolver = requestedSeat ? () => invitation?.applicationId ? loadJoinResume(invitation.applicationId) : Promise.resolve(null) : props.loadResume ?? (() => {
       if (typeof window === "undefined") return Promise.resolve(null);
@@ -1728,13 +1798,13 @@ function JoinFlow(props) {
       setSubmitting(false);
     }
   };
-  if (requestedSeat && !invitation) return /* @__PURE__ */ jsxs22("section", { className: "card", "aria-live": "polite", children: [
-    /* @__PURE__ */ jsx22("h2", { children: seatCopy.title }),
-    /* @__PURE__ */ jsx22("p", { role: invitationState.error ? "alert" : "status", children: invitationState.error || seatCopy.loading }),
-    invitationState.error ? /* @__PURE__ */ jsx22("button", { type: "button", onClick: invitationState.retry, children: seatCopy.retry }) : null
+  if (requestedSeat && !invitation) return /* @__PURE__ */ jsxs23("section", { className: "card", "aria-live": "polite", children: [
+    /* @__PURE__ */ jsx23("h2", { children: seatCopy.title }),
+    /* @__PURE__ */ jsx23("p", { role: invitationState.error ? "alert" : "status", children: invitationState.error || seatCopy.loading }),
+    invitationState.error ? /* @__PURE__ */ jsx23("button", { type: "button", onClick: invitationState.retry, children: seatCopy.retry }) : null
   ] });
-  const header = /* @__PURE__ */ jsxs22(Fragment10, { children: [
-    invitation ? /* @__PURE__ */ jsx22(
+  const header = /* @__PURE__ */ jsxs23(Fragment11, { children: [
+    invitation ? /* @__PURE__ */ jsx23(
       JoinInvitationNotice,
       {
         invitation,
@@ -1746,48 +1816,49 @@ function JoinFlow(props) {
       state,
       ...invitation ? { invitation } : {},
       ..."applicationId" in state ? { applicationId: state.applicationId } : {}
-    })
+    }),
+    !props.simulation && !requestedSeat && ["paymentPending", "booking", "accepted", "done"].includes(state.step) && "applicationId" in state ? /* @__PURE__ */ jsx23(PaymentReceiptCard, { applicationId: state.applicationId }) : null
   ] });
   if (state.step === "closed") {
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
-      /* @__PURE__ */ jsxs22("section", { className: "card", "aria-label": "Application closed", children: [
-        /* @__PURE__ */ jsx22("h2", { children: "This application is closed" }),
-        /* @__PURE__ */ jsx22("p", { children: "This link cannot resume payment or booking. Sign in to view your application status, or contact the chapter if you need help." }),
-        /* @__PURE__ */ jsx22("a", { className: "apply-link", href: membersHref, children: copy.done.memberArea })
+      /* @__PURE__ */ jsxs23("section", { className: "card", "aria-label": "Application closed", children: [
+        /* @__PURE__ */ jsx23("h2", { children: "This application is closed" }),
+        /* @__PURE__ */ jsx23("p", { children: "This link cannot resume payment or booking. Sign in to view your application status, or contact the chapter if you need help." }),
+        /* @__PURE__ */ jsx23("a", { className: "apply-link", href: membersHref, children: copy.done.memberArea })
       ] })
     ] });
   }
   if (state.step === "done") {
-    const body = renderDone?.({ ...state, membersHref }) ?? /* @__PURE__ */ jsxs22("div", { className: "join-done card", children: [
-      /* @__PURE__ */ jsx22("div", { className: "card-label", children: copy.done.label }),
-      /* @__PURE__ */ jsx22("p", { className: "meeting-date", children: fullLabel(state.booked.startAt, state.booked.timezone) }),
-      /* @__PURE__ */ jsx22("p", { className: "meeting-note", children: copy.done.calendarInvite }),
-      /* @__PURE__ */ jsx22("a", { className: "apply-link", href: membersHref, children: copy.done.memberArea })
+    const body = renderDone?.({ ...state, membersHref }) ?? /* @__PURE__ */ jsxs23("div", { className: "join-done card", children: [
+      /* @__PURE__ */ jsx23("div", { className: "card-label", children: copy.done.label }),
+      /* @__PURE__ */ jsx23("p", { className: "meeting-date", children: fullLabel(state.booked.startAt, state.booked.timezone) }),
+      /* @__PURE__ */ jsx23("p", { className: "meeting-note", children: copy.done.calendarInvite }),
+      /* @__PURE__ */ jsx23("a", { className: "apply-link", href: membersHref, children: copy.done.memberArea })
     ] });
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
       body
     ] });
   }
   if (state.step === "accepted") {
-    const body = renderAccepted?.({ ...state, membersHref }) ?? /* @__PURE__ */ jsx22(JoinAccepted, { copy, membersHref });
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    const body = renderAccepted?.({ ...state, membersHref }) ?? /* @__PURE__ */ jsx23(JoinAccepted, { copy, membersHref });
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
       body
     ] });
   }
   if (state.step === "gift") {
-    const body = renderGift?.(state) ?? /* @__PURE__ */ jsx22(GiftClaimCard, { applicationId: state.applicationId, claimId: state.claimId, initialCode: state.code, copy: copy.gift });
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    const body = renderGift?.(state) ?? /* @__PURE__ */ jsx23(GiftClaimCard, { applicationId: state.applicationId, claimId: state.claimId, initialCode: state.code, copy: copy.gift });
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
       body
     ] });
   }
   if (state.step === "booking") {
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
-      /* @__PURE__ */ jsx22(
+      /* @__PURE__ */ jsx23(
         JoinBooking,
         {
           applicationId: state.applicationId,
@@ -1802,9 +1873,9 @@ function JoinFlow(props) {
   }
   if (state.step === "payment") {
     if (props.namedSeatClaimApi && props.initialNamedSeatId && !props.simulation && !state.giftPurchase) {
-      return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+      return /* @__PURE__ */ jsxs23(Fragment11, { children: [
         header,
-        /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx23(
           JoinNamedSeat,
           {
             api: props.namedSeatClaimApi,
@@ -1817,9 +1888,9 @@ function JoinFlow(props) {
       ] });
     }
     const Payment = state.giftPurchase || props.simulation ? PaymentStep : MembershipPaymentStep;
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
-      props.giftClaimApi && !state.giftPurchase ? /* @__PURE__ */ jsx22(
+      props.giftClaimApi && !state.giftPurchase ? /* @__PURE__ */ jsx23(
         JoinGiftClaim,
         {
           api: props.giftClaimApi,
@@ -1830,7 +1901,7 @@ function JoinFlow(props) {
           onError: () => setError(copy.form.unexpectedFailure)
         }
       ) : null,
-      /* @__PURE__ */ jsx22(
+      /* @__PURE__ */ jsx23(
         Payment,
         {
           applicationId: state.applicationId,
@@ -1860,9 +1931,9 @@ function JoinFlow(props) {
   }
   if (state.step === "paymentPending") {
     if (props.namedSeatClaimApi && props.initialNamedSeatId && !props.simulation) {
-      return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+      return /* @__PURE__ */ jsxs23(Fragment11, { children: [
         header,
-        /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx23(
           JoinNamedSeat,
           {
             api: props.namedSeatClaimApi,
@@ -1874,14 +1945,14 @@ function JoinFlow(props) {
         )
       ] });
     }
-    return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+    return /* @__PURE__ */ jsxs23(Fragment11, { children: [
       header,
-      /* @__PURE__ */ jsx22("p", { className: "pay-status", role: "status", children: copy.payment.pending })
+      /* @__PURE__ */ jsx23("p", { className: "pay-status", role: "status", children: copy.payment.pending })
     ] });
   }
-  return /* @__PURE__ */ jsxs22(Fragment10, { children: [
+  return /* @__PURE__ */ jsxs23(Fragment11, { children: [
     header,
-    /* @__PURE__ */ jsx22(
+    /* @__PURE__ */ jsx23(
       JoinApplicationForm,
       {
         props,
@@ -2071,7 +2142,7 @@ function membershipPageDocument(input, options = {}) {
 }
 
 // src/ui/membership-cards.tsx
-import { jsx as jsx23, jsxs as jsxs23 } from "preact/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs24 } from "preact/jsx-runtime";
 var MEMBERSHIP_CARD_TOKEN_DEFAULTS = Object.freeze({
   "--ui-membership-grid-gap": "1.4rem",
   "--ui-membership-card-padding": "2rem 1.7rem 1.8rem",
@@ -2140,67 +2211,67 @@ function membershipApplicationHref(applicationPath, tierId) {
 }
 function TierAction(props) {
   if (props.mode === "select") {
-    return /* @__PURE__ */ jsxs23("button", { type: "button", className: "chapter-membership-action", "aria-current": props.selected ? "true" : void 0, onClick: () => props.onSelectTier?.(props.tierId), children: [
+    return /* @__PURE__ */ jsxs24("button", { type: "button", className: "chapter-membership-action", "aria-current": props.selected ? "true" : void 0, onClick: () => props.onSelectTier?.(props.tierId), children: [
       props.label,
-      /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", children: "\u2192" })
+      /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", children: "\u2192" })
     ] });
   }
   if (props.mode === "preview") {
-    return /* @__PURE__ */ jsxs23("span", { className: "chapter-membership-action", "aria-disabled": "true", children: [
+    return /* @__PURE__ */ jsxs24("span", { className: "chapter-membership-action", "aria-disabled": "true", children: [
       props.label,
-      /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", children: "\u2192" })
+      /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", children: "\u2192" })
     ] });
   }
-  return /* @__PURE__ */ jsxs23("a", { className: "chapter-membership-action", href: membershipApplicationHref(props.applicationPath, props.tierId), children: [
+  return /* @__PURE__ */ jsxs24("a", { className: "chapter-membership-action", href: membershipApplicationHref(props.applicationPath, props.tierId), children: [
     props.label,
-    /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", children: "\u2192" })
+    /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", children: "\u2192" })
   ] });
 }
 function TierCard(props) {
   const { tier, presentation } = props;
   const summary = presentation.summaryMarkdown ?? tier.blurb;
   const action = presentation.ctaLabel ?? (tier.free ? "Join for free" : `Choose ${tier.name}`);
-  return /* @__PURE__ */ jsxs23("article", { className: "chapter-membership-card", "data-tier-id": tier.id, "data-variant": presentation.variant ?? "standard", children: [
-    presentation.badge ? /* @__PURE__ */ jsx23("div", { className: "chapter-membership-badge", children: presentation.badge }) : null,
-    /* @__PURE__ */ jsx23("h3", { className: "chapter-membership-name", children: tier.name }),
-    /* @__PURE__ */ jsxs23("div", { className: "chapter-membership-offer", "data-with-capacity": presentation.capacity ? "true" : void 0, children: [
-      presentation.capacity ? /* @__PURE__ */ jsxs23("div", { className: "chapter-membership-capacity", "aria-label": `${presentation.capacity.total} ${presentation.capacity.label ?? "available"}`, children: [
-        /* @__PURE__ */ jsx23("strong", { children: presentation.capacity.total.toLocaleString("en-US") }),
-        /* @__PURE__ */ jsx23("small", { children: presentation.capacity.label ?? "available" })
+  return /* @__PURE__ */ jsxs24("article", { className: "chapter-membership-card", "data-tier-id": tier.id, "data-variant": presentation.variant ?? "standard", children: [
+    presentation.badge ? /* @__PURE__ */ jsx24("div", { className: "chapter-membership-badge", children: presentation.badge }) : null,
+    /* @__PURE__ */ jsx24("h3", { className: "chapter-membership-name", children: tier.name }),
+    /* @__PURE__ */ jsxs24("div", { className: "chapter-membership-offer", "data-with-capacity": presentation.capacity ? "true" : void 0, children: [
+      presentation.capacity ? /* @__PURE__ */ jsxs24("div", { className: "chapter-membership-capacity", "aria-label": `${presentation.capacity.total} ${presentation.capacity.label ?? "available"}`, children: [
+        /* @__PURE__ */ jsx24("strong", { children: presentation.capacity.total.toLocaleString("en-US") }),
+        /* @__PURE__ */ jsx24("small", { children: presentation.capacity.label ?? "available" })
       ] }) : null,
-      /* @__PURE__ */ jsxs23("div", { className: "chapter-membership-price-stack", children: [
-        presentation.priceEyebrow ? /* @__PURE__ */ jsx23("p", { className: "chapter-membership-price-eyebrow", children: presentation.priceEyebrow }) : tier.founding ? /* @__PURE__ */ jsx23("p", { className: "chapter-membership-price-eyebrow", children: "Founding member rate" }) : null,
-        /* @__PURE__ */ jsxs23("div", { className: "chapter-membership-price-row", children: [
-          tier.founding ? /* @__PURE__ */ jsx23("span", { className: "chapter-membership-compare", children: fmtMoney(tier.priceCents) }) : presentation.compareAtPriceCents !== void 0 ? /* @__PURE__ */ jsx23("span", { className: "chapter-membership-compare", children: fmtMoney(presentation.compareAtPriceCents) }) : null,
-          /* @__PURE__ */ jsx23("span", { className: "chapter-membership-price", children: tier.free ? "Free" : fmtMoney(tier.founding ? tier.founding.dueTodayCents : tier.priceCents) }),
-          !tier.free && presentation.billingLabel ? /* @__PURE__ */ jsx23("span", { className: "chapter-membership-billing", children: presentation.billingLabel }) : null
+      /* @__PURE__ */ jsxs24("div", { className: "chapter-membership-price-stack", children: [
+        presentation.priceEyebrow ? /* @__PURE__ */ jsx24("p", { className: "chapter-membership-price-eyebrow", children: presentation.priceEyebrow }) : tier.founding ? /* @__PURE__ */ jsx24("p", { className: "chapter-membership-price-eyebrow", children: "Founding member rate" }) : null,
+        /* @__PURE__ */ jsxs24("div", { className: "chapter-membership-price-row", children: [
+          tier.founding ? /* @__PURE__ */ jsx24("span", { className: "chapter-membership-compare", children: fmtMoney(tier.priceCents) }) : presentation.compareAtPriceCents !== void 0 ? /* @__PURE__ */ jsx24("span", { className: "chapter-membership-compare", children: fmtMoney(presentation.compareAtPriceCents) }) : null,
+          /* @__PURE__ */ jsx24("span", { className: "chapter-membership-price", children: tier.free ? "Free" : fmtMoney(tier.founding ? tier.founding.dueTodayCents : tier.priceCents) }),
+          !tier.free && presentation.billingLabel ? /* @__PURE__ */ jsx24("span", { className: "chapter-membership-billing", children: presentation.billingLabel }) : null
         ] })
       ] })
     ] }),
-    presentation.priceNoteMarkdown ? /* @__PURE__ */ jsx23(Markdown2, { className: "chapter-membership-price-note", source: presentation.priceNoteMarkdown }) : null,
-    summary ? /* @__PURE__ */ jsx23(Markdown2, { className: "chapter-membership-summary", source: summary }) : null,
-    presentation.benefits?.length ? /* @__PURE__ */ jsx23("ul", { className: "chapter-membership-benefits", children: presentation.benefits.map((benefit, index) => /* @__PURE__ */ jsxs23("li", { children: [
-      /* @__PURE__ */ jsx23("span", { className: "chapter-membership-check", "aria-hidden": "true", children: "\u2713" }),
-      /* @__PURE__ */ jsx23(Markdown2, { className: "chapter-membership-benefit", source: benefit })
+    presentation.priceNoteMarkdown ? /* @__PURE__ */ jsx24(Markdown2, { className: "chapter-membership-price-note", source: presentation.priceNoteMarkdown }) : null,
+    summary ? /* @__PURE__ */ jsx24(Markdown2, { className: "chapter-membership-summary", source: summary }) : null,
+    presentation.benefits?.length ? /* @__PURE__ */ jsx24("ul", { className: "chapter-membership-benefits", children: presentation.benefits.map((benefit, index) => /* @__PURE__ */ jsxs24("li", { children: [
+      /* @__PURE__ */ jsx24("span", { className: "chapter-membership-check", "aria-hidden": "true", children: "\u2713" }),
+      /* @__PURE__ */ jsx24(Markdown2, { className: "chapter-membership-benefit", source: benefit })
     ] }, `${tier.id}-benefit-${index}`)) }) : null,
-    presentation.callout ? /* @__PURE__ */ jsxs23("aside", { className: "chapter-membership-callout", children: [
-      presentation.callout.label ? /* @__PURE__ */ jsx23("p", { className: "chapter-membership-callout-label", children: presentation.callout.label }) : null,
-      /* @__PURE__ */ jsx23(Markdown2, { source: presentation.callout.bodyMarkdown })
+    presentation.callout ? /* @__PURE__ */ jsxs24("aside", { className: "chapter-membership-callout", children: [
+      presentation.callout.label ? /* @__PURE__ */ jsx24("p", { className: "chapter-membership-callout-label", children: presentation.callout.label }) : null,
+      /* @__PURE__ */ jsx24(Markdown2, { source: presentation.callout.bodyMarkdown })
     ] }) : null,
-    /* @__PURE__ */ jsx23(TierAction, { tierId: tier.id, label: action, mode: props.mode, selected: props.selected, applicationPath: props.applicationPath, onSelectTier: props.onSelectTier })
+    /* @__PURE__ */ jsx24(TierAction, { tierId: tier.id, label: action, mode: props.mode, selected: props.selected, applicationPath: props.applicationPath, onSelectTier: props.onSelectTier })
   ] });
 }
 function MembershipCards(props) {
   const document2 = membershipPageDocument(props.document, { tiers: props.tiers });
   const byId = new Map(props.tiers.map((tier) => [tier.id, tier]));
   const mode = props.mode ?? "link";
-  return /* @__PURE__ */ jsxs23("section", { className: ["chapter-membership", props.className].filter(Boolean).join(" "), "data-chapter-membership": MEMBERSHIP_PAGE_RENDERER, "aria-label": props.ariaLabel ?? "Membership options", children: [
-    /* @__PURE__ */ jsx23("style", { children: MEMBERSHIP_CARDS_CSS }),
-    /* @__PURE__ */ jsx23("div", { className: "chapter-membership-grid", style: { "--chapter-membership-columns": String(Math.min(document2.tiers.length, 3)) }, children: document2.tiers.map((presentation) => {
+  return /* @__PURE__ */ jsxs24("section", { className: ["chapter-membership", props.className].filter(Boolean).join(" "), "data-chapter-membership": MEMBERSHIP_PAGE_RENDERER, "aria-label": props.ariaLabel ?? "Membership options", children: [
+    /* @__PURE__ */ jsx24("style", { children: MEMBERSHIP_CARDS_CSS }),
+    /* @__PURE__ */ jsx24("div", { className: "chapter-membership-grid", style: { "--chapter-membership-columns": String(Math.min(document2.tiers.length, 3)) }, children: document2.tiers.map((presentation) => {
       const tier = byId.get(presentation.tierId);
-      return /* @__PURE__ */ jsx23(TierCard, { tier, presentation, mode, selected: props.selectedTierId === tier.id, applicationPath: props.applicationPath, onSelectTier: props.onSelectTier }, tier.id);
+      return /* @__PURE__ */ jsx24(TierCard, { tier, presentation, mode, selected: props.selectedTierId === tier.id, applicationPath: props.applicationPath, onSelectTier: props.onSelectTier }, tier.id);
     }) }),
-    document2.footnoteMarkdown ? /* @__PURE__ */ jsx23(Markdown2, { className: "chapter-membership-footnote", source: document2.footnoteMarkdown }) : null
+    document2.footnoteMarkdown ? /* @__PURE__ */ jsx24(Markdown2, { className: "chapter-membership-footnote", source: document2.footnoteMarkdown }) : null
   ] });
 }
 
@@ -2236,4 +2307,4 @@ export {
   membershipApplicationHref,
   MembershipCards
 };
-//# sourceMappingURL=chunk-VEOGTSVX.js.map
+//# sourceMappingURL=chunk-IQZWCG42.js.map