@blamejs/blamejs-shop 0.3.54 → 0.3.56

package/lib/storefront.js

@@ -2192,6 +2192,49 @@ function _buildPreorderNotice(marker) {
   return "<p class=\"" + cls + "\" role=\"" + role + "\">" + b.template.escapeHtml(n.copy) + "</p>\n      ";
 }
 
+// Map a thrown validator TypeError to the single form field it rejected, so a
+// re-render can mark exactly that input with aria-invalid + a per-field error
+// span (WCAG 3.3.1 Error Identification / 3.3.3 Error Suggestion) — IN ADDITION
+// to the page-top role="alert" summary banner the routes already render.
+//
+// The shop's validators throw "<module>: <field> <reason>" (or
+// "<module>.<method>: <field> <reason>") where the leading token after the
+// prefix IS the form `name`. This reads that already-thrown error; it does NOT
+// re-validate (the backend stays the single validator). `modulePrefix` is the
+// thrower's prefix (e.g. "addresses", "reviews", "productQA", "supportTickets")
+// and `formFields` is the set of `name`s the form actually renders, so an error
+// on a non-form internal (e.g. customer_id) returns null — the page-top banner
+// still shows, but no input is falsely marked.
+//
+// Returns { field, message } with the module prefix stripped from `message`
+// (so the per-field span carries just the human reason), or null when the
+// rejected token isn't one of this form's fields.
+function _fieldFromValidatorError(e, modulePrefix, formFields) {
+  var raw = (e && e.message) || "";
+  var prefixRe = new RegExp("^" + modulePrefix + "(?:\\.\\w+)?:\\s+");
+  var m = new RegExp("^" + modulePrefix + "(?:\\.\\w+)?:\\s+([a-z_]+)\\b").exec(raw);
+  var field = m && m[1];
+  if (!field || !formFields || !Object.prototype.hasOwnProperty.call(formFields, field)) return null;
+  return { field: field, message: raw.replace(prefixRe, "") };
+}
+
+// Build the aria-invalid + aria-describedby attribute fragment for an input
+// when `inv` (a { field, message } from _fieldFromValidatorError) names this
+// field. Empty string otherwise. `idPrefix` + field is the static, escaped id.
+function _fieldAriaAttr(idPrefix, name, inv) {
+  if (!inv || inv.field !== name) return "";
+  return " aria-invalid=\"true\" aria-describedby=\"" + b.template.escapeHtml(idPrefix + name) + "\"";
+}
+
+// Build the adjacent per-field error span (role="alert") for the rejected
+// field; empty string otherwise. The reason is escaped operator-validator
+// prose; the id is the static, escaped `idPrefix + name`.
+function _fieldErrorSpan(idPrefix, name, inv) {
+  if (!inv || inv.field !== name) return "";
+  return "<span class=\"form-field__error\" id=\"" + b.template.escapeHtml(idPrefix + name) +
+    "\" role=\"alert\">" + b.template.escapeHtml(inv.message == null ? "" : String(inv.message)) + "</span>";
+}
+
 var PRODUCT_PAGE =
   "<section class=\"pdp\">\n" +
   "  <nav class=\"breadcrumb\" aria-label=\"Breadcrumb\">\n" +
@@ -2486,17 +2529,20 @@ var REVIEW_FORM_PAGE =
   "  <h1 class=\"review-form-page__title\">Review {{title}}</h1>\n" +
   "  RAW_NOTICE_PLACEHOLDER\n" +
   "  <form class=\"review-form\" method=\"post\" action=\"/products/{{slug}}/review\">\n" +
-  "    <fieldset class=\"review-form__rating\">\n" +
+  "    <fieldset class=\"review-form__rating\"RAW_RATING_ARIA_PLACEHOLDER>\n" +
   "      <legend>Your rating</legend>\n" +
   "      RAW_STARS_PLACEHOLDER\n" +
+  "      RAW_RATING_ERROR_PLACEHOLDER\n" +
   "    </fieldset>\n" +
   "    <label class=\"form-field\">\n" +
   "      <span class=\"form-field__label\">Title</span>\n" +
-  "      <input type=\"text\" name=\"title\" maxlength=\"120\" required autocomplete=\"off\">\n" +
+  "      <input type=\"text\" name=\"title\" maxlength=\"120\" required autocomplete=\"off\"RAW_TITLE_ARIA_PLACEHOLDER>\n" +
+  "      RAW_TITLE_ERROR_PLACEHOLDER\n" +
   "    </label>\n" +
   "    <label class=\"form-field\">\n" +
   "      <span class=\"form-field__label\">Your review</span>\n" +
-  "      <textarea name=\"body\" maxlength=\"4000\" rows=\"6\"></textarea>\n" +
+  "      <textarea name=\"body\" maxlength=\"4000\" rows=\"6\"RAW_BODY_ARIA_PLACEHOLDER></textarea>\n" +
+  "      RAW_BODY_ERROR_PLACEHOLDER\n" +
   "    </label>\n" +
   "    <button type=\"submit\" class=\"btn-primary\">Submit review</button>\n" +
   "  </form>\n" +
@@ -2519,12 +2565,17 @@ function renderReviewForm(opts) {
   var notice = opts.notice
     ? "<p class=\"form-notice form-notice--error\" role=\"alert\">" + esc(String(opts.notice)) + "</p>"
     : "";
-  var body = _render(REVIEW_FORM_PAGE, {
-    title: opts.product.title,
-    slug:  slug,
-  })
+  // On a validation re-render, mark the one rejected control. The rating is a
+  // <fieldset> (the aria goes on the group, per the existing fieldset/legend
+  // shape); title/body are ordinary inputs. ids are static "review-err-<name>".
+  var inv = opts.invalid_field || null;
+  var body = _render(REVIEW_FORM_PAGE, { title: opts.product.title, slug: slug })
     .replace("RAW_NOTICE_PLACEHOLDER", notice)
     .replace("RAW_STARS_PLACEHOLDER", stars);
+  ["rating", "title", "body"].forEach(function (name) {
+    body = _spliceRaw(body, "RAW_" + name.toUpperCase() + "_ARIA_PLACEHOLDER", _fieldAriaAttr("review-err-", name, inv));
+    body = _spliceRaw(body, "RAW_" + name.toUpperCase() + "_ERROR_PLACEHOLDER", _fieldErrorSpan("review-err-", name, inv));
+  });
   return _wrap({
     title:      "Review " + opts.product.title,
     shop_name:  opts.shop_name || "blamejs.shop",
@@ -2631,7 +2682,8 @@ var QA_FORM_PAGE =
   "  <form class=\"review-form\" method=\"post\" action=\"/products/{{slug}}/question\">\n" +
   "    <label class=\"form-field\">\n" +
   "      <span class=\"form-field__label\">Your question</span>\n" +
-  "      <textarea name=\"body\" maxlength=\"4000\" rows=\"6\" required></textarea>\n" +
+  "      <textarea name=\"body\" maxlength=\"4000\" rows=\"6\" requiredRAW_BODY_ARIA_PLACEHOLDER></textarea>\n" +
+  "      RAW_BODY_ERROR_PLACEHOLDER\n" +
   "    </label>\n" +
   "    <button type=\"submit\" class=\"btn-primary\">Submit question</button>\n" +
   "  </form>\n" +
@@ -2645,11 +2697,16 @@ function renderQuestionForm(opts) {
   var notice = opts.notice
     ? "<p class=\"form-notice form-notice--error\" role=\"alert\">" + esc(String(opts.notice)) + "</p>"
     : "";
+  // Single field (`body`); on a re-render, mark it with aria-invalid + an
+  // adjacent error span. id is the static "qa-err-body".
+  var inv = opts.invalid_field || null;
   var body = _render(QA_FORM_PAGE, {
     title: opts.product.title,
     slug:  opts.product.slug,
   })
     .replace("RAW_NOTICE_PLACEHOLDER", notice);
+  body = _spliceRaw(body, "RAW_BODY_ARIA_PLACEHOLDER", _fieldAriaAttr("qa-err-", "body", inv));
+  body = _spliceRaw(body, "RAW_BODY_ERROR_PLACEHOLDER", _fieldErrorSpan("qa-err-", "body", inv));
   return _wrap({
     title:      "Ask about " + opts.product.title,
     shop_name:  opts.shop_name || "blamejs.shop",
@@ -2748,6 +2805,11 @@ function renderWishlist(opts) {
   // sharing primitive isn't wired, or a unit test calling the renderer
   // directly) the panel is empty so the page renders unchanged.
   var sharePanel = opts.share_panel || "";
+  // Alert + digest opt-in panel (server-rendered, no client JS). The
+  // route builds it (it owns the per-trigger / per-schedule prefs reads);
+  // absent it (the alerts/digest primitives aren't wired, or a unit test
+  // calling the renderer directly) the panel is empty.
+  var prefsPanel = opts.prefs_panel || "";
   var body =
     "<section class=\"account-wishlist\">" +
       "<nav class=\"breadcrumb\" aria-label=\"Breadcrumb\"><ol>" +
@@ -2756,6 +2818,7 @@ function renderWishlist(opts) {
       "</ol></nav>" +
       "<h1 class=\"account-wishlist__title\">Saved items</h1>" +
       notice +
+      prefsPanel +
       sharePanel +
       inner +
     "</section>";
@@ -2841,6 +2904,81 @@ function _wishlistSharePanel(opts) {
          "</section>";
 }
 
+// The wishlist alert + digest opt-in panel (mounts on /account/wishlist
+// when the alerts / digest primitives are wired). Server-rendered, no
+// client JS: each toggle is a `<form method="post">` whose hidden `on`
+// field flips on submit (the submit button carries the new state). The
+// `_csrf` token is injected automatically by the `_wrap` form chokepoint
+// (_injectCsrfFields) like every other container POST form — the panel
+// emits no token itself.
+//
+//   opts.alerts   — [{ trigger, label, subscribed }] (subscribed drives
+//                   the button's on/off action)
+//   opts.digests  — [{ slug, label, enrolled, enrollment_id }]
+//   opts.notice   — "alerts" | "digest" → a saved confirmation
+//
+// Every operator-controlled string (a schedule slug used as a label) is
+// escaped via the storefront `esc()` path.
+var WISHLIST_PREFS_NOTICES = {
+  alerts: "Alert preferences saved.",
+  digest: "Digest subscription updated.",
+};
+function _wishlistPrefsPanel(opts) {
+  opts = opts || {};
+  var esc = b.template.escapeHtml;
+  var alerts  = opts.alerts  || [];
+  var digests = opts.digests || [];
+  if (alerts.length === 0 && digests.length === 0) return "";
+  var noticeMsg = WISHLIST_PREFS_NOTICES[opts.notice];
+  var notice = noticeMsg
+    ? "<p class=\"form-notice form-notice--ok\" role=\"status\">" + esc(noticeMsg) + "</p>"
+    : "";
+
+  var alertRows = "";
+  for (var i = 0; i < alerts.length; i += 1) {
+    var a = alerts[i];
+    var on = a.subscribed === true;
+    // Submitting flips the state: a subscribed trigger posts on="" (off);
+    // an unsubscribed one posts on="1".
+    alertRows +=
+      "<form class=\"wishlist-prefs__row\" method=\"post\" action=\"/account/wishlist/alerts\">" +
+        "<input type=\"hidden\" name=\"trigger\" value=\"" + esc(a.trigger) + "\">" +
+        "<input type=\"hidden\" name=\"on\" value=\"" + (on ? "" : "1") + "\">" +
+        "<span class=\"wishlist-prefs__label\">" + esc(a.label || a.trigger) + "</span>" +
+        "<span class=\"wishlist-prefs__state\">" + (on ? "On" : "Off") + "</span>" +
+        "<button type=\"submit\" class=\"btn-ghost btn-ghost--sm\">" + (on ? "Turn off" : "Turn on") + "</button>" +
+      "</form>";
+  }
+  var alertsBlock = alertRows
+    ? "<h3 class=\"wishlist-prefs__subhead\">Price-drop &amp; back-in-stock alerts</h3>" + alertRows
+    : "";
+
+  var digestRows = "";
+  for (var j = 0; j < digests.length; j += 1) {
+    var d = digests[j];
+    var enrolled = d.enrolled === true;
+    digestRows +=
+      "<form class=\"wishlist-prefs__row\" method=\"post\" action=\"/account/wishlist/digest\">" +
+        "<input type=\"hidden\" name=\"schedule_slug\" value=\"" + esc(d.slug) + "\">" +
+        "<input type=\"hidden\" name=\"on\" value=\"" + (enrolled ? "" : "1") + "\">" +
+        "<span class=\"wishlist-prefs__label\">" + esc(d.label || d.slug) + "</span>" +
+        "<span class=\"wishlist-prefs__state\">" + (enrolled ? "Subscribed" : "Not subscribed") + "</span>" +
+        "<button type=\"submit\" class=\"btn-ghost btn-ghost--sm\">" + (enrolled ? "Unsubscribe" : "Subscribe") + "</button>" +
+      "</form>";
+  }
+  var digestBlock = digestRows
+    ? "<h3 class=\"wishlist-prefs__subhead\">Periodic wishlist digest</h3>" + digestRows
+    : "";
+
+  return "<section class=\"wishlist-prefs-panel\" aria-labelledby=\"wishlist-prefs-heading\">" +
+           "<h2 id=\"wishlist-prefs-heading\" class=\"wishlist-prefs-panel__title\">Wishlist notifications</h2>" +
+           "<p class=\"wishlist-prefs-panel__lede\">Choose how you'd like to hear about your saved items. We'll only email you if your store has email delivery configured.</p>" +
+           notice +
+           alertsBlock +
+           digestBlock +
+         "</section>";
+}
+
 // Public, no-auth shared-wishlist page (`GET /wishlist/shared/:token`). It
 // renders ONLY the shared product cards (title, image, link to each PDP) —
 // the owner's identity, the per-entry private notes, and the owner customer
@@ -3545,32 +3683,59 @@ function _addrField(name, labelText, value, opts) {
   // The `*` is a color-only visual cue; pair it with a visually-hidden
   // "(required)" so a screen reader announces the field's requiredness.
   var req = opts.required ? " <span class=\"form-field__req\" aria-hidden=\"true\">*</span><span class=\"sr-only\">(required)</span>" : "";
+  // On a validation re-render, the rejected field carries aria-invalid +
+  // aria-describedby pointing at an adjacent error span (WCAG 3.3.1/3.3.3).
+  // The id is a static prefix + field name (attacker-uncontrolled) but is
+  // still escaped for defense-in-depth; the reason is operator-validator
+  // prose, escaped via esc().
+  var errSpan = "";
+  if (opts.invalid) {
+    attrs += " aria-invalid=\"true\" aria-describedby=\"" + esc(opts.error_id) + "\"";
+    errSpan = "<span class=\"form-field__error\" id=\"" + esc(opts.error_id) +
+      "\" role=\"alert\">" + esc(opts.error_msg == null ? "" : String(opts.error_msg)) + "</span>";
+  }
   return "<label class=\"form-field\">" +
            "<span class=\"form-field__label\">" + esc(labelText) + req + "</span>" +
            "<input type=\"text\" name=\"" + esc(name) + "\" value=\"" + esc(value == null ? "" : String(value)) + "\"" + attrs + ">" +
+           errSpan +
          "</label>";
 }
 
 // Shared add/edit address form. `addr` pre-fills for edit (null = add).
-function _addressForm(action, addr, submitLabel) {
+// `invalidField` (optional) is a { field, message } picked off the
+// backend-thrown validator error so the one rejected input renders with
+// aria-invalid + a per-field error span (WCAG 3.3.1/3.3.3). When null, every
+// field renders byte-identically to the no-error path.
+function _addressForm(action, addr, submitLabel, invalidField) {
   var esc = b.template.escapeHtml;
   addr = addr || {};
   function _checked(v) { return Number(v) === 1 ? " checked" : ""; }
+  // Merge the per-field invalid marker into a field's opts when it is the one
+  // the validator rejected. The id is a static "addr-err-<name>" so it is
+  // attacker-uncontrolled.
+  function _mark(name, opts) {
+    if (invalidField && invalidField.field === name) {
+      opts.invalid = true;
+      opts.error_id = "addr-err-" + name;
+      opts.error_msg = invalidField.message;
+    }
+    return opts;
+  }
   return "<form class=\"address-form form-stack\" method=\"post\" action=\"" + esc(action) + "\">" +
-    _addrField("recipient_name", "Recipient name", addr.recipient_name, { required: true, maxlength: 120, autocomplete: "name" }) +
-    _addrField("label", "Label (e.g. Home, Work)", addr.label, { maxlength: 60 }) +
-    _addrField("company", "Company", addr.company, { maxlength: 120, autocomplete: "organization" }) +
-    _addrField("street_line1", "Street address", addr.street_line1, { required: true, maxlength: 200, autocomplete: "address-line1" }) +
-    _addrField("street_line2", "Apt / suite / unit", addr.street_line2, { maxlength: 200, autocomplete: "address-line2" }) +
+    _addrField("recipient_name", "Recipient name", addr.recipient_name, _mark("recipient_name", { required: true, maxlength: 120, autocomplete: "name" })) +
+    _addrField("label", "Label (e.g. Home, Work)", addr.label, _mark("label", { maxlength: 60 })) +
+    _addrField("company", "Company", addr.company, _mark("company", { maxlength: 120, autocomplete: "organization" })) +
+    _addrField("street_line1", "Street address", addr.street_line1, _mark("street_line1", { required: true, maxlength: 200, autocomplete: "address-line1" })) +
+    _addrField("street_line2", "Apt / suite / unit", addr.street_line2, _mark("street_line2", { maxlength: 200, autocomplete: "address-line2" })) +
     "<div class=\"form-row form-row--inline\">" +
-      _addrField("city", "City", addr.city, { required: true, maxlength: 120, autocomplete: "address-level2" }) +
-      _addrField("region", "State / region", addr.region, { maxlength: 120, autocomplete: "address-level1" }) +
+      _addrField("city", "City", addr.city, _mark("city", { required: true, maxlength: 120, autocomplete: "address-level2" })) +
+      _addrField("region", "State / region", addr.region, _mark("region", { maxlength: 120, autocomplete: "address-level1" })) +
     "</div>" +
     "<div class=\"form-row form-row--inline\">" +
-      _addrField("postal_code", "Postal code", addr.postal_code, { required: true, maxlength: 32, autocomplete: "postal-code" }) +
-      _addrField("country", "Country (ISO 3166-1)", addr.country || "US", { required: true, maxlength: 2, pattern: "[A-Za-z]{2}", autocomplete: "country" }) +
+      _addrField("postal_code", "Postal code", addr.postal_code, _mark("postal_code", { required: true, maxlength: 32, autocomplete: "postal-code" })) +
+      _addrField("country", "Country (ISO 3166-1)", addr.country || "US", _mark("country", { required: true, maxlength: 2, pattern: "[A-Za-z]{2}", autocomplete: "country" })) +
     "</div>" +
-    _addrField("phone", "Phone", addr.phone, { maxlength: 40, autocomplete: "tel" }) +
+    _addrField("phone", "Phone", addr.phone, _mark("phone", { maxlength: 40, autocomplete: "tel" })) +
     "<label class=\"address-form__check\"><input type=\"checkbox\" name=\"is_default_shipping\" value=\"1\"" + _checked(addr.is_default_shipping) + "> Default shipping address</label>" +
     "<label class=\"address-form__check\"><input type=\"checkbox\" name=\"is_default_billing\" value=\"1\"" + _checked(addr.is_default_billing) + "> Default billing address</label>" +
     "<button type=\"submit\" class=\"btn-primary\">" + esc(submitLabel) + "</button>" +
@@ -3642,7 +3807,7 @@ function renderAddresses(opts) {
       listHtml +
       "<h2 class=\"account-addresses__form-title\">" + esc(formHeading) + "</h2>" +
       notice +
-      _addressForm(formAction, editing, editing ? "Save changes" : "Add address") +
+      _addressForm(formAction, editing, editing ? "Save changes" : "Add address", opts.invalid_field || null) +
     "</section>";
   return _wrap({
     title:      "Addresses",
@@ -4615,6 +4780,13 @@ function renderSupportNew(opts) {
   var notice = opts.notice
     ? "<p class=\"form-notice form-notice--error\" role=\"alert\">" + esc(String(opts.notice)) + "</p>"
     : "";
+  // On a validation re-render, mark the one rejected field with aria-invalid +
+  // an adjacent error span (WCAG 3.3.1/3.3.3) via the shared field helpers.
+  // `opts.invalid_field` is the { field, message } the route picked off the
+  // backend-thrown error; ids are static "support-err-<name>".
+  var inv = opts.invalid_field || null;
+  function _supAria(name) { return _fieldAriaAttr("support-err-", name, inv); }
+  function _supErr(name) { return _fieldErrorSpan("support-err-", name, inv); }
   var body =
     "<section class=\"return-form-page\">" +
       "<nav class=\"breadcrumb\" aria-label=\"Breadcrumb\"><ol>" +
@@ -4626,14 +4798,14 @@ function renderSupportNew(opts) {
       notice +
       "<form class=\"return-form form-stack\" method=\"post\" action=\"/account/support\">" +
         "<label class=\"form-field\"><span class=\"form-field__label\">Email for our reply</span>" +
-          "<input type=\"email\" name=\"customer_email\" value=\"" + esc(v.customer_email == null ? "" : String(v.customer_email)) + "\" required autocomplete=\"email\" maxlength=\"254\"></label>" +
+          "<input type=\"email\" name=\"customer_email\" value=\"" + esc(v.customer_email == null ? "" : String(v.customer_email)) + "\" required autocomplete=\"email\" maxlength=\"254\"" + _supAria("customer_email") + ">" + _supErr("customer_email") + "</label>" +
         "<label class=\"form-field\"><span class=\"form-field__label\">Category</span>" +
-          "<select name=\"category\" required>" + categoryOpts + "</select></label>" +
+          "<select name=\"category\" required" + _supAria("category") + ">" + categoryOpts + "</select>" + _supErr("category") + "</label>" +
         orderField +
         "<label class=\"form-field\"><span class=\"form-field__label\">Subject</span>" +
-          "<input type=\"text\" name=\"subject\" value=\"" + esc(v.subject == null ? "" : String(v.subject)) + "\" required maxlength=\"200\"></label>" +
+          "<input type=\"text\" name=\"subject\" value=\"" + esc(v.subject == null ? "" : String(v.subject)) + "\" required maxlength=\"200\"" + _supAria("subject") + ">" + _supErr("subject") + "</label>" +
         "<label class=\"form-field\"><span class=\"form-field__label\">How can we help?</span>" +
-          "<textarea name=\"body\" required maxlength=\"8000\" rows=\"6\">" + esc(v.body == null ? "" : String(v.body)) + "</textarea></label>" +
+          "<textarea name=\"body\" required maxlength=\"8000\" rows=\"6\"" + _supAria("body") + ">" + esc(v.body == null ? "" : String(v.body)) + "</textarea>" + _supErr("body") + "</label>" +
         "<button type=\"submit\" class=\"btn-primary\">Send</button>" +
       "</form>" +
     "</section>";
@@ -8511,6 +8683,7 @@ var ACCOUNT_LOGIN_PAGE =
   "      <p id=\"login-message\" class=\"auth-form__message\"></p>\n" +
   "    </form>\n" +
   "    RAW_LOGIN_OAUTH\n" +
+  "    RAW_LOGIN_MAGIC\n" +
   "    <p class=\"auth-card__alt\">New here? <a href=\"/account/register\">Create an account →</a></p>\n" +
   "  </div>\n" +
   "  RAW_LOGIN_SCRIPT\n" +
@@ -8519,6 +8692,7 @@ var ACCOUNT_LOGIN_PAGE =
 var LOGIN_ERROR_MESSAGES = {
   oauth:           "We couldn't complete that sign-in. Please try again.",
   "email-conflict": "That email already has an account — sign in with your passkey instead.",
+  link:            "That sign-in link is invalid or has expired. Request a fresh one.",
 };
 
 function renderAccountLogin(opts) {
@@ -8539,8 +8713,12 @@ function renderAccountLogin(opts) {
   var errHtml = (opts.error && LOGIN_ERROR_MESSAGES[opts.error])
     ? "<p class=\"auth-form__message auth-form__message--err\">" + b.template.escapeHtml(LOGIN_ERROR_MESSAGES[opts.error]) + "</p>"
     : "";
+  var magicHtml = opts.magic_link_enabled
+    ? "<p class=\"auth-card__alt\"><a href=\"/account/login/link\">Email me a sign-in link instead →</a></p>"
+    : "";
   var body = ACCOUNT_LOGIN_PAGE
     .replace("RAW_LOGIN_OAUTH", oauthHtml)
+    .replace("RAW_LOGIN_MAGIC", magicHtml)
     .replace("RAW_LOGIN_ERROR", errHtml)
     // Login captcha is gated separately (CAPTCHA_GATE_LOGIN): the widget
     // renders only when the operator has a provider active AND opted login
@@ -8557,6 +8735,50 @@ function renderAccountLogin(opts) {
   });
 }
 
+// Magic-link sign-in — a passwordless entry for shoppers without a
+// passkey or a social login. The page is a single email field that POSTs
+// to /account/login/link. The response is always the same enumeration-
+// safe confirmation ("if an account exists, we've emailed a link")
+// regardless of whether the address resolves — no account-existence
+// oracle. Server-rendered, no client JS.
+var ACCOUNT_MAGIC_LINK_PAGE =
+  "<section class=\"auth-page\">\n" +
+  "  <div class=\"auth-card\">\n" +
+  "    <p class=\"eyebrow\">Sign in by email</p>\n" +
+  "    <h1 class=\"auth-card__title\">Email me a sign-in link</h1>\n" +
+  "    <p class=\"auth-card__lede\">No passkey or social login? Enter your email and we'll send a single-use link that signs you in.</p>\n" +
+  "    RAW_MAGIC_LINK_NOTICE\n" +
+  "    <form method=\"post\" action=\"/account/login/link\" class=\"form-stack auth-form\">\n" +
+  "      <div class=\"form-row\"><label class=\"form-field\"><span class=\"form-field__label\">Email</span><input type=\"email\" name=\"email\" required autocomplete=\"email\" autofocus></label></div>\n" +
+  "      <div class=\"form-actions\"><button type=\"submit\" class=\"btn-primary auth-form__submit\">Email me a link</button></div>\n" +
+  "    </form>\n" +
+  "    <p class=\"auth-card__alt\"><a href=\"/account/login\">← Back to sign in</a></p>\n" +
+  "  </div>\n" +
+  "</section>\n";
+
+function renderMagicLinkPage(opts) {
+  opts = opts || {};
+  var esc = b.template.escapeHtml;
+  // The post-submit confirmation (sent=1) is the enumeration-safe message
+  // — identical whether or not the address matched an account. The
+  // unconfigured-mailer case carries its own honest notice.
+  var noticeHtml = "";
+  if (opts.sent) {
+    noticeHtml = "<p class=\"form-notice form-notice--ok\" role=\"status\">If an account exists for that email, we've sent a sign-in link. Check your inbox.</p>";
+  } else if (opts.unavailable) {
+    noticeHtml = "<p class=\"auth-form__message auth-form__message--err\">Email sign-in isn't available on this store. Use a passkey or social login instead.</p>";
+  }
+  var body = ACCOUNT_MAGIC_LINK_PAGE.replace("RAW_MAGIC_LINK_NOTICE", noticeHtml);
+  void esc;
+  return _wrap({
+    title:      "Email sign-in",
+    shop_name:  opts.shop_name || "blamejs.shop",
+    cart_count: opts.cart_count,
+    theme_css:  opts.theme_css,
+    body:       body,
+  });
+}
+
 var ACCOUNT_REGISTER_PAGE =
   "<section class=\"auth-page\">\n" +
   "  <div class=\"auth-card\">\n" +
@@ -12535,6 +12757,7 @@ function mount(router, deps) {
         cart_count:     cartCount,
         google_enabled: !!deps.oauthGoogle,
         apple_enabled:  !!deps.oauthApple,
+        magic_link_enabled: !!(deps.customerPortal && deps.customerPortalEmail),
         error:          url && url.searchParams.get("error"),
         captcha_kind:        captchaLoginOn ? captchaKind   : null,
         captcha_public_key:  captchaLoginOn ? captchaPubKey : null,
@@ -12554,6 +12777,105 @@ function mount(router, deps) {
       }));
     });
 
+    // ---- magic-link sign-in (passwordless email entry) ------------------
+    //
+    // A minimal passwordless login for shoppers without a passkey or a
+    // social login. Composes the customer-portal primitive: createSession
+    // mints a single-use, hashed-at-rest token; the link is emailed; the
+    // GET redemption verifies (single-use) and sets the sealed shop_auth
+    // cookie. The whole surface mounts only when BOTH the portal primitive
+    // AND a transactional mailer are wired — absent either, /account/login/
+    // link renders an "unavailable" state and passkey / OAuth are unchanged.
+    if (deps.customerPortal && deps.customerPortalEmail) {
+      // GET — the email-entry form.
+      router.get("/account/login/link", async function (req, res) {
+        var cartCount = await _cartCountForReq(req);
+        var url = req.url ? new URL(req.url, "http://localhost") : null;
+        _send(res, 200, renderMagicLinkPage({
+          shop_name:  shopName,
+          cart_count: cartCount,
+          sent:       url ? url.searchParams.get("sent") === "1" : false,
+        }));
+      });
+
+      // POST — resolve the email to a customer, mint a portal session,
+      // email the link. The response is ALWAYS the same enumeration-safe
+      // confirmation (sent=1) regardless of whether the address matched —
+      // no account-existence oracle. A bad-shaped email re-renders the
+      // form. Every send is best-effort: a mailer failure still shows the
+      // generic confirmation (the link simply doesn't arrive).
+      router.post("/account/login/link", async function (req, res) {
+        var body = req.body || {};
+        var emailRaw = typeof body.email === "string" ? body.email : "";
+        var customerId = null;
+        // Resolve the customer by email hash. A malformed address (hashEmail
+        // throws on bad shape) or a no-match both fall through to the
+        // generic confirmation — no oracle.
+        try {
+          var hash = deps.customers.hashEmail(emailRaw);
+          var cust = await deps.customers.byEmailHash(hash);
+          if (cust && cust.id) customerId = cust.id;
+        } catch (_e) { customerId = null; }
+
+        if (customerId) {
+          try {
+            var minted = await deps.customerPortal.createSession({
+              customer_id: customerId,
+              scope:       "full",
+            });
+            // Build the absolute redemption link from this request's origin.
+            var origin = "";
+            try { origin = new URL(_requestUrls(req).canonical_url).origin; }
+            catch (_e2) { origin = ""; }
+            var linkUrl = origin + "/account/portal/" + encodeURIComponent(minted.plaintext_token);
+            // The customer's plaintext address: the portal flow needs a
+            // deliverable address. The customers store keeps only the hash,
+            // so reuse the submitted address (the customer just typed it);
+            // the email handle validates the address shape.
+            await deps.customerPortalEmail.sendMagicLink({
+              customer_email: emailRaw,
+              link_url:       linkUrl,
+            });
+          } catch (_e3) { /* drop-silent — generic confirmation regardless */ }
+        }
+        // 303 to the GET with the generic confirmation flag.
+        res.status(303);
+        res.setHeader && res.setHeader("location", "/account/login/link?sent=1");
+        return res.end ? res.end() : res.send("");
+      });
+
+      // GET — redeem the magic-link token. verifyToken is single-use (flips
+      // the row to consumed) and re-checks expiry; on success set the sealed
+      // shop_auth cookie + 303 to /account. An unknown / expired / already-
+      // used token bounces to login with a soft error (no oracle on why).
+      router.get("/account/portal/:token", async function (req, res) {
+        var token = (req.params && req.params.token) || "";
+        var rv = null;
+        try { rv = await deps.customerPortal.verifyToken(token); }
+        catch (e) {
+          if (e && e.code === "vault/not-initialized") return _serviceUnavailable(res, "auth not configured");
+          rv = null;
+        }
+        if (!rv || !rv.customer_id) {
+          res.status(303);
+          res.setHeader && res.setHeader("location", "/account/login?error=link");
+          return res.end ? res.end() : res.send("");
+        }
+        // Adopt the guest cart into the now-authenticated account, mirroring
+        // the OAuth / passkey login paths.
+        var sid = _readSidCookie(req);
+        if (sid) {
+          try {
+            var anonCart = await deps.cart.bySession(sid);
+            if (anonCart) await deps.cart.setCustomer(anonCart.id, rv.customer_id);
+          } catch (_e) { /* best-effort merge; sign-in itself succeeds */ }
+        }
+        _setAuthCookie(req, res, { customer_id: rv.customer_id, exp: Date.now() + b.constants.TIME.days(14) });
+        res.status(303); res.setHeader && res.setHeader("location", "/account");
+        return res.end ? res.end() : res.send("");
+      });
+    }
+
     router.post("/account/passkey/register-begin", async function (req, res) {
       try {
         var body = _readJsonBody(req);
@@ -13663,15 +13985,152 @@ function mount(router, deps) {
             notice: wlUrl ? wlUrl.searchParams.get("share") : null,
           });
         }
+        // Alert + digest opt-in panel — only when those primitives are
+        // wired (a mailer-configured deploy). The current per-trigger
+        // opt-out + per-schedule enrollment state drives each toggle's
+        // checked/unchecked render. A reads failure degrades to no panel
+        // rather than 500-ing the page.
+        var prefsPanel = await _buildWishlistPrefsPanel(
+          auth.customer_id,
+          wlUrl ? wlUrl.searchParams.get("prefs") : null,
+        );
         _send(res, 200, renderWishlist({
           items:        items,
           notice:       wlUrl ? wlUrl.searchParams.get("ok") : null,
+          prefs_panel:  prefsPanel,
           share_panel:  sharePanel,
           shop_name:    shopName,
           cart_count:   cartCount,
           asset_prefix: deps.asset_prefix || "/assets/",
         }));
       });
+
+      // Build the alert + digest opt-in panel for a signed-in customer.
+      // Reads the current per-trigger opt-out state (isUnsubscribedFrom
+      // Trigger, now exported) for each scannable alert trigger, and the
+      // active-enrollment state per live digest schedule. Each read is
+      // best-effort: a missing table / read error drops that section
+      // rather than throwing. Returns "" when neither primitive is wired.
+      async function _buildWishlistPrefsPanel(customerId, notice) {
+        var alerts  = [];
+        var digests = [];
+        if (deps.wishlistAlerts) {
+          var ALERT_TRIGGERS = [
+            { trigger: "price_drop",    label: "Email me when a saved item drops in price" },
+            { trigger: "back_in_stock", label: "Email me when a saved item is back in stock" },
+          ];
+          for (var i = 0; i < ALERT_TRIGGERS.length; i += 1) {
+            var t = ALERT_TRIGGERS[i];
+            var unsub = true;
+            try { unsub = await deps.wishlistAlerts.isUnsubscribedFromTrigger(customerId, t.trigger); }
+            catch (_e) { unsub = false; }
+            alerts.push({ trigger: t.trigger, label: t.label, subscribed: !unsub });
+          }
+        }
+        if (deps.wishlistDigest) {
+          var schedules = [];
+          try { schedules = await deps.wishlistDigest.listSchedules({ active_only: true }); }
+          catch (_e) { schedules = []; }
+          var enrollments = [];
+          try { enrollments = await deps.wishlistDigest.enrollmentsForCustomer(customerId); }
+          catch (_e) { enrollments = []; }
+          var activeBySlug = {};
+          for (var k = 0; k < enrollments.length; k += 1) {
+            var en = enrollments[k];
+            if (en.status === "active") activeBySlug[en.schedule_slug] = en.id;
+          }
+          for (var s = 0; s < schedules.length; s += 1) {
+            var sch = schedules[s];
+            var label = (sch.frequency === "weekly" ? "Weekly" : "Monthly") +
+                        " digest (" + sch.slug + ")";
+            digests.push({
+              slug:          sch.slug,
+              label:         label,
+              enrolled:      Object.prototype.hasOwnProperty.call(activeBySlug, sch.slug),
+              enrollment_id: activeBySlug[sch.slug] || null,
+            });
+          }
+        }
+        return _wishlistPrefsPanel({ alerts: alerts, digests: digests, notice: notice });
+      }
+
+      // POST /account/wishlist/alerts — flip a per-trigger alert opt-out.
+      // Body { trigger, on }: a falsey `on` unsubscribes (insert opt-out
+      // row); a truthy `on` re-subscribes (delete the opt-out row). Gated
+      // on the session customer; CSRF rides the container form chokepoint.
+      if (deps.wishlistAlerts) {
+        router.post("/account/wishlist/alerts", async function (req, res) {
+          var auth;
+          try { auth = _currentCustomer(req); }
+          catch (e) {
+            if (e && e.code === "vault/not-initialized") return _serviceUnavailable(res, "auth not configured");
+            throw e;
+          }
+          if (!auth) {
+            res.status(303); res.setHeader && res.setHeader("location", "/account/login");
+            return res.end ? res.end() : res.send("");
+          }
+          var body = req.body || {};
+          var trigger = body.trigger;
+          var on = body.on === "1" || body.on === "on" || body.on === true;
+          try {
+            if (on) {
+              await deps.wishlistAlerts.resubscribeToAlertKind({ customer_id: auth.customer_id, trigger: trigger });
+            } else {
+              await deps.wishlistAlerts.unsubscribeFromAlertKind({ customer_id: auth.customer_id, trigger: trigger });
+            }
+          } catch (e) {
+            res.status(e instanceof TypeError ? 400 : 500);
+            return res.end ? res.end((e && e.message) || "Error") : res.send((e && e.message) || "Error");
+          }
+          res.status(303); res.setHeader && res.setHeader("location", "/account/wishlist?prefs=alerts");
+          return res.end ? res.end() : res.send("");
+        });
+      }
+
+      // POST /account/wishlist/digest — enroll / pause a digest schedule.
+      // Body { schedule_slug, on }: a truthy `on` enrolls; a falsey `on`
+      // pauses the active enrollment for that slug (looked up via
+      // enrollmentsForCustomer). Gated on the session customer.
+      if (deps.wishlistDigest) {
+        router.post("/account/wishlist/digest", async function (req, res) {
+          var auth;
+          try { auth = _currentCustomer(req); }
+          catch (e) {
+            if (e && e.code === "vault/not-initialized") return _serviceUnavailable(res, "auth not configured");
+            throw e;
+          }
+          if (!auth) {
+            res.status(303); res.setHeader && res.setHeader("location", "/account/login");
+            return res.end ? res.end() : res.send("");
+          }
+          var body = req.body || {};
+          var scheduleSlug = body.schedule_slug;
+          var on = body.on === "1" || body.on === "on" || body.on === true;
+          try {
+            if (on) {
+              await deps.wishlistDigest.enrollCustomer({ customer_id: auth.customer_id, schedule_slug: scheduleSlug });
+            } else {
+              // Find the active enrollment for this slug and pause it.
+              var enrollments = await deps.wishlistDigest.enrollmentsForCustomer(auth.customer_id);
+              var target = null;
+              for (var i = 0; i < enrollments.length; i += 1) {
+                if (enrollments[i].schedule_slug === scheduleSlug && enrollments[i].status === "active") {
+                  target = enrollments[i]; break;
+                }
+              }
+              if (target) {
+                await deps.wishlistDigest.pauseEnrollment({ enrollment_id: target.id, reason: "customer opted out" });
+              }
+            }
+          } catch (e) {
+            res.status(e instanceof TypeError ? 400 : 500);
+            return res.end ? res.end((e && e.message) || "Error") : res.send((e && e.message) || "Error");
+          }
+          res.status(303); res.setHeader && res.setHeader("location", "/account/wishlist?prefs=digest");
+          return res.end ? res.end() : res.send("");
+        });
+      }
     }
 
     // ---- wishlist sharing -----------------------------------------------
@@ -14567,7 +15026,7 @@ function mount(router, deps) {
         if (kind === "default-billing")  return "Default billing address updated.";
         return null;
       }
-      async function _renderAddrPage(req, res, auth, editAddr, notice, code) {
+      async function _renderAddrPage(req, res, auth, editAddr, notice, code, invalidField) {
         var rows = await deps.addresses.listForCustomer(auth.customer_id, { limit: 50 });
         var cartCount = await _cartCountForReq(req);
         var url = req.url ? new URL(req.url, "http://localhost") : null;
@@ -14577,15 +15036,24 @@ function mount(router, deps) {
         // when the ?undo=<id> marker round-trips a real owned address id.
         var undoId = (okKind === "removed" && url) ? url.searchParams.get("undo") : null;
         _send(res, code || 200, renderAddresses({
-          addresses:  rows,
-          edit:       editAddr || null,
-          notice:     notice || null,
-          success:    success,
-          undo_id:    undoId || null,
-          shop_name:  shopName,
-          cart_count: cartCount,
+          addresses:     rows,
+          edit:          editAddr || null,
+          notice:        notice || null,
+          success:       success,
+          undo_id:       undoId || null,
+          invalid_field: invalidField || null,
+          shop_name:     shopName,
+          cart_count:    cartCount,
         }));
       }
+      // The address form's renderable fields, by `name`. An error on a
+      // non-form internal (customer_id, address_id) returns null from the
+      // shared extractor, so the page-top banner still shows but no input is
+      // falsely marked.
+      var _ADDR_FORM_FIELDS = {
+        recipient_name: 1, label: 1, company: 1, street_line1: 1, street_line2: 1,
+        city: 1, region: 1, postal_code: 1, country: 1, phone: 1,
+      };
       function _addrInput(body, customerId) {
         return {
           customer_id:         customerId,
@@ -14622,7 +15090,10 @@ function mount(router, deps) {
         try {
           await deps.addresses.add(_addrInput(req.body || {}, auth.customer_id));
         } catch (e) {
-          if (e instanceof TypeError) return _renderAddrPage(req, res, auth, null, (e && e.message) || "Please check the address.", 400);
+          if (e instanceof TypeError) {
+            var inv = _fieldFromValidatorError(e, "addresses", _ADDR_FORM_FIELDS);
+            return _renderAddrPage(req, res, auth, null, (e && e.message) || "Please check the address.", 400, inv);
+          }
           throw e;
         }
         res.status(303); res.setHeader && res.setHeader("location", "/account/addresses?ok=added");
@@ -14637,7 +15108,8 @@ function mount(router, deps) {
         } catch (e) {
           if (e instanceof TypeError) {
             var merged = Object.assign({}, addr, _addrInput(req.body || {}, auth.customer_id));
-            return _renderAddrPage(req, res, auth, merged, (e && e.message) || "Please check the address.", 400);
+            var inv = _fieldFromValidatorError(e, "addresses", _ADDR_FORM_FIELDS);
+            return _renderAddrPage(req, res, auth, merged, (e && e.message) || "Please check the address.", 400, inv);
           }
           throw e;
         }
@@ -15730,11 +16202,12 @@ function mount(router, deps) {
         } catch (e) {
           if (e instanceof TypeError) {
             return _send(res, 400, renderSupportNew({
-              orders:     await _orders(),
-              values:     body,
-              notice:     (e && e.message || "").replace(/^supportTickets[.:]\s*/, "") || "Please check your ticket and try again.",
-              shop_name:  shopName,
-              cart_count: cartCount,
+              orders:        await _orders(),
+              values:        body,
+              notice:        (e && e.message || "").replace(/^supportTickets[.:]\s*/, "") || "Please check your ticket and try again.",
+              invalid_field: _fieldFromValidatorError(e, "supportTickets", { customer_email: 1, category: 1, subject: 1, body: 1 }),
+              shop_name:     shopName,
+              cart_count:    cartCount,
             }));
           }
           throw e;
@@ -16418,10 +16891,11 @@ function mount(router, deps) {
           // anything else is a real 500.
           if (e instanceof TypeError) {
             return _send(res, 400, renderReviewForm({
-              product:    { title: ctx.product.title, slug: ctx.product.slug },
-              notice:     (e && e.message) || "Please check your review and try again.",
-              shop_name:  shopName,
-              cart_count: ctx.cartCount,
+              product:       { title: ctx.product.title, slug: ctx.product.slug },
+              notice:        (e && e.message) || "Please check your review and try again.",
+              invalid_field: _fieldFromValidatorError(e, "reviews", { rating: 1, title: 1, body: 1 }),
+              shop_name:     shopName,
+              cart_count:    ctx.cartCount,
             }));
           }
           throw e;
@@ -16489,10 +16963,11 @@ function mount(router, deps) {
           // anything else is a real 500.
           if (e instanceof TypeError) {
             return _send(res, 400, renderQuestionForm({
-              product:    { title: ctx.product.title, slug: ctx.product.slug },
-              notice:     (e && e.message) || "Please check your question and try again.",
-              shop_name:  shopName,
-              cart_count: ctx.cartCount,
+              product:       { title: ctx.product.title, slug: ctx.product.slug },
+              notice:        (e && e.message) || "Please check your question and try again.",
+              invalid_field: _fieldFromValidatorError(e, "productQA", { body: 1 }),
+              shop_name:     shopName,
+              cart_count:    ctx.cartCount,
             }));
           }
           throw e;