@seatlayer/js 0.40.0 → 0.41.0

package/dist/index.cjs

@@ -1329,6 +1329,7 @@ var SeatingChart = class {
     this.mount = null;
     this.hostEl = null;
     this.rendered = false;
+    this.retryBtn = null;
     this.mode_ = null;
     this.tipEl = null;
     this.tipPos = { x: 0, y: 0 };
@@ -1390,6 +1391,7 @@ var SeatingChart = class {
     const info = await this.controller.render(host);
     if (!info) {
       this.rendered = false;
+      if (this.opts.errorDisplay !== "none") this.showLoadFailure(host);
       return this;
     }
     this.controller.setViewMode(this.opts.initialView ?? "flat");
@@ -1680,10 +1682,36 @@ var SeatingChart = class {
     }
     return ok;
   }
+  /**
+   * The visible failure state. Deliberately inline-styled and dependency-free:
+   * this renders on a stranger's website, where our stylesheet may not have
+   * loaded (the chart fetch just failed) and where inheriting the host's own
+   * styles is likelier to produce something unreadable than something on-brand.
+   */
+  showLoadFailure(host) {
+    const box = document.createElement("div");
+    box.setAttribute("role", "status");
+    box.style.cssText = 'display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;min-height:180px;box-sizing:border-box;padding:24px;text-align:center;font:500 14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#3b4256;';
+    const text = document.createElement("div");
+    text.textContent = "The seat map didn\u2019t load.";
+    box.appendChild(text);
+    const btn = document.createElement("button");
+    btn.type = "button";
+    btn.textContent = "Try again";
+    btn.style.cssText = "appearance:none;border:1px solid #c9cede;background:#fff;color:#10162a;border-radius:8px;padding:8px 16px;font:600 13px/1 inherit;cursor:pointer;";
+    btn.addEventListener("click", () => {
+      this.destroy();
+      void this.render().catch((err) => this.opts.onError?.(err));
+    });
+    box.appendChild(btn);
+    this.retryBtn = btn;
+    host.appendChild(box);
+  }
   destroy() {
     this.realtime?.stop();
     this.realtime = null;
     this.access?.clear();
+    this.retryBtn = null;
     if (this.hostEl && this.onTipMove) this.hostEl.removeEventListener("mousemove", this.onTipMove);
     this.tipEl = null;
     this.onTipMove = null;
@@ -5862,7 +5890,15 @@ var SeatPicker = class _SeatPicker {
     this.checkoutPanel = mountCheckout2({
       root: this.root,
       state,
-      startSession: (input) => this.pubApi.startCheckout(this.opts.event, input),
+      // `returnUrl` rides along so a redirecting gateway can come back to the
+      // HOST's page. The server validates its origin against the organizer's
+      // declared embed domains and silently falls back to our own buyer page
+      // when it does not match, so passing one can never redirect a paid buyer
+      // somewhere the organizer did not sanction.
+      startSession: (input) => this.pubApi.startCheckout(this.opts.event, {
+        ...input,
+        ...this.opts.returnUrl ? { returnUrl: this.opts.returnUrl } : {}
+      }),
       orderStatus: (orderId) => this.pubApi.orderStatus(orderId),
       onCancel: () => {
         this.checkoutPanel = null;