@economist/web-apple-pay 1.1.0 → 1.2.0

package/README.md

@@ -32,6 +32,8 @@ import { configureApplePay, defineApplePayElements } from '@economist/web-apple-
 configureApplePay({
   merchantId: 'merchant.com.economist.your-app',
   debugBypassEnabled: false,
+  // required: wallet API base URL for session and checkout calls
+  walletApiBaseUrl: 'https://bff-test.economist.com',
 });
 
 defineApplePayElements();
@@ -57,11 +59,13 @@ When clicked, the button creates and opens `teg-apple-pay-modal` automatically.
 ### `configureApplePay(config)`
 
 Sets package-level runtime configuration used by Apple Pay availability checks.
+Call this once during app startup.
 
 `config` shape:
 
 - `merchantId` (`string`, required): Apple Pay merchant identifier used for active-card checks.
 - `debugBypassEnabled` (`boolean`, optional): allows `?BYPASS_APPLE_PAY_CHECKS=1` query param to bypass capability checks in non-production-style debugging flows.
+- `walletApiBaseUrl` (`string`, required): base URL for wallet API requests.
 
 If `merchantId` is not configured, Apple Pay availability checks return `false` and the button hides itself.
 
@@ -94,7 +98,7 @@ Consumers should listen for this event and continue payment orchestration.
 ## Public API
 
 - `defineApplePayElements()`: registers both custom elements.
-- `configureApplePay(config)`: sets required runtime config (merchant ID and optional debug bypass).
+- `configureApplePay(config)`: sets required runtime config (merchant ID and wallet API base URL, with optional debug bypass).
 - `ApplePayButton`: button component class.
 - `ApplePayModal`: modal component class.
 - `ensureApplePayLogoSymbol()`: logo symbol injection helper.
@@ -106,7 +110,7 @@ Consumers should listen for this event and continue payment orchestration.
 
 Check:
 
-- `configureApplePay(...)` was called before rendering (with a valid `merchantId`)
+- `configureApplePay(...)` was called before rendering (with a valid `merchantId` and `walletApiBaseUrl`)
 - device/browser supports Apple Pay checks (Safari/Apple device logic)
 - query string/feature flag gating for your page is satisfied
 - offer variant is not excluded (`bundle`, `insider_print`)

package/dist/index.js

@@ -775,6 +775,9 @@ var isApplePayAvailable = async () => {
     }
     const merchantId = getApplePayConfig()?.merchantId;
     if (!merchantId) {
+      console.warn(
+        "[web-apple-pay] Missing merchantId. Call configureApplePay({ merchantId, ... }) before rendering Apple Pay components."
+      );
       return false;
     }
     return await applePaySession.canMakePaymentsWithActiveCard(merchantId);
@@ -784,6 +787,67 @@ var isApplePayAvailable = async () => {
   }
 };
 
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+
+// src/clients/payment-checkout/index.ts
+var getWalletApiBaseUrl = () => {
+  const config = getApplePayConfig();
+  if (!config?.walletApiBaseUrl) {
+    throw new Error(
+      "[web-apple-pay] Missing walletApiBaseUrl. Call configureApplePay({ merchantId, walletApiBaseUrl, ... }) before making wallet API requests."
+    );
+  }
+  return config.walletApiBaseUrl;
+};
+var apiFetch = async (path, options = {}) => {
+  const baseUrl = getWalletApiBaseUrl();
+  const method = (options.method ?? "GET").toUpperCase();
+  const hasBody = options.body !== void 0 && options.body !== null;
+  const headers = new Headers(options.headers);
+  if (!headers.has("Accept")) {
+    headers.set("Accept", "application/json");
+  }
+  if (!headers.has("Content-Type")) {
+    if (hasBody || method !== "GET" && method !== "HEAD") {
+      headers.set("Content-Type", "application/json");
+    }
+  }
+  const response = await fetch(`${baseUrl}${path}`, {
+    ...options,
+    headers
+  });
+  if (!response.ok) {
+    const contentType = response.headers.get("content-type") || "";
+    if (contentType.includes("application/json")) {
+      const errorBody = await response.json();
+      throw new ApiError(response.status, errorBody);
+    }
+    const errorText = await response.text();
+    throw new Error(
+      `API request failed: ${response.status} ${response.statusText} - ${errorText}`
+    );
+  }
+  return response.json();
+};
+
+// src/clients/payment-checkout/session.ts
+var getExpressCheckoutSession = () => {
+  return apiFetch("/v1/wallet/session", {
+    method: "GET",
+    credentials: "include"
+  });
+};
+
 // src/apple-pay-button.ts
 var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
 var APPLE_PAY_EXCLUDED_VARIANTS = ["bundle", "insider_print"];
@@ -841,6 +905,11 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
         this.style.display = "none";
         return;
       }
+      const sessionData = await this.#fetchSession();
+      if (sessionData?.loggedIn && (sessionData.userType === "active-subscription" || sessionData.userType === "b2b-user")) {
+        this.style.display = "none";
+        return;
+      }
       this.style.removeProperty("display");
       ensureApplePayLogoSymbol();
       const template = document.createElement("template");
@@ -883,6 +952,13 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
     button.setAttribute("disabled", "");
     button.setAttribute("aria-disabled", "true");
   }
+  async #fetchSession() {
+    try {
+      return await getExpressCheckoutSession();
+    } catch {
+      return null;
+    }
+  }
 };
 
 // src/index.ts

package/dist/src/apple-pay-button.js

@@ -770,6 +770,9 @@ var isApplePayAvailable = async () => {
     }
     const merchantId = getApplePayConfig()?.merchantId;
     if (!merchantId) {
+      console.warn(
+        "[web-apple-pay] Missing merchantId. Call configureApplePay({ merchantId, ... }) before rendering Apple Pay components."
+      );
       return false;
     }
     return await applePaySession.canMakePaymentsWithActiveCard(merchantId);
@@ -779,6 +782,67 @@ var isApplePayAvailable = async () => {
   }
 };
 
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+
+// src/clients/payment-checkout/index.ts
+var getWalletApiBaseUrl = () => {
+  const config = getApplePayConfig();
+  if (!config?.walletApiBaseUrl) {
+    throw new Error(
+      "[web-apple-pay] Missing walletApiBaseUrl. Call configureApplePay({ merchantId, walletApiBaseUrl, ... }) before making wallet API requests."
+    );
+  }
+  return config.walletApiBaseUrl;
+};
+var apiFetch = async (path, options = {}) => {
+  const baseUrl = getWalletApiBaseUrl();
+  const method = (options.method ?? "GET").toUpperCase();
+  const hasBody = options.body !== void 0 && options.body !== null;
+  const headers = new Headers(options.headers);
+  if (!headers.has("Accept")) {
+    headers.set("Accept", "application/json");
+  }
+  if (!headers.has("Content-Type")) {
+    if (hasBody || method !== "GET" && method !== "HEAD") {
+      headers.set("Content-Type", "application/json");
+    }
+  }
+  const response = await fetch(`${baseUrl}${path}`, {
+    ...options,
+    headers
+  });
+  if (!response.ok) {
+    const contentType = response.headers.get("content-type") || "";
+    if (contentType.includes("application/json")) {
+      const errorBody = await response.json();
+      throw new ApiError(response.status, errorBody);
+    }
+    const errorText = await response.text();
+    throw new Error(
+      `API request failed: ${response.status} ${response.statusText} - ${errorText}`
+    );
+  }
+  return response.json();
+};
+
+// src/clients/payment-checkout/session.ts
+var getExpressCheckoutSession = () => {
+  return apiFetch("/v1/wallet/session", {
+    method: "GET",
+    credentials: "include"
+  });
+};
+
 // src/apple-pay-button.ts
 var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
 var APPLE_PAY_EXCLUDED_VARIANTS = ["bundle", "insider_print"];
@@ -836,6 +900,11 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
         this.style.display = "none";
         return;
       }
+      const sessionData = await this.#fetchSession();
+      if (sessionData?.loggedIn && (sessionData.userType === "active-subscription" || sessionData.userType === "b2b-user")) {
+        this.style.display = "none";
+        return;
+      }
       this.style.removeProperty("display");
       ensureApplePayLogoSymbol();
       const template = document.createElement("template");
@@ -878,6 +947,13 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
     button.setAttribute("disabled", "");
     button.setAttribute("aria-disabled", "true");
   }
+  async #fetchSession() {
+    try {
+      return await getExpressCheckoutSession();
+    } catch {
+      return null;
+    }
+  }
 };
 export {
   ApplePayButton

package/dist/src/clients/payment-checkout/config.d.ts

@@ -1,6 +1,7 @@
 export interface ApplePayRuntimeConfig {
     merchantId: string;
     debugBypassEnabled?: boolean;
+    walletApiBaseUrl: string;
 }
 export declare const configureApplePay: (config: ApplePayRuntimeConfig) => void;
 export declare const getApplePayConfig: () => ApplePayRuntimeConfig | null;

package/dist/src/clients/payment-checkout/detects.js

@@ -29,6 +29,9 @@ var isApplePayAvailable = async () => {
     }
     const merchantId = getApplePayConfig()?.merchantId;
     if (!merchantId) {
+      console.warn(
+        "[web-apple-pay] Missing merchantId. Call configureApplePay({ merchantId, ... }) before rendering Apple Pay components."
+      );
       return false;
     }
     return await applePaySession.canMakePaymentsWithActiveCard(merchantId);

package/dist/src/clients/payment-checkout/index.d.ts

@@ -0,0 +1 @@
+export declare const apiFetch: <T>(path: string, options?: RequestInit) => Promise<T>;

package/dist/src/clients/payment-checkout/index.js

@@ -0,0 +1,59 @@
+// src/clients/payment-checkout/config.ts
+var runtimeConfig = null;
+var getApplePayConfig = () => runtimeConfig;
+
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+
+// src/clients/payment-checkout/index.ts
+var getWalletApiBaseUrl = () => {
+  const config = getApplePayConfig();
+  if (!config?.walletApiBaseUrl) {
+    throw new Error(
+      "[web-apple-pay] Missing walletApiBaseUrl. Call configureApplePay({ merchantId, walletApiBaseUrl, ... }) before making wallet API requests."
+    );
+  }
+  return config.walletApiBaseUrl;
+};
+var apiFetch = async (path, options = {}) => {
+  const baseUrl = getWalletApiBaseUrl();
+  const method = (options.method ?? "GET").toUpperCase();
+  const hasBody = options.body !== void 0 && options.body !== null;
+  const headers = new Headers(options.headers);
+  if (!headers.has("Accept")) {
+    headers.set("Accept", "application/json");
+  }
+  if (!headers.has("Content-Type")) {
+    if (hasBody || method !== "GET" && method !== "HEAD") {
+      headers.set("Content-Type", "application/json");
+    }
+  }
+  const response = await fetch(`${baseUrl}${path}`, {
+    ...options,
+    headers
+  });
+  if (!response.ok) {
+    const contentType = response.headers.get("content-type") || "";
+    if (contentType.includes("application/json")) {
+      const errorBody = await response.json();
+      throw new ApiError(response.status, errorBody);
+    }
+    const errorText = await response.text();
+    throw new Error(
+      `API request failed: ${response.status} ${response.statusText} - ${errorText}`
+    );
+  }
+  return response.json();
+};
+export {
+  apiFetch
+};

package/dist/src/clients/payment-checkout/session.d.ts

@@ -0,0 +1,2 @@
+import type { SessionResponse } from './types';
+export declare const getExpressCheckoutSession: () => Promise<SessionResponse>;

package/dist/src/clients/payment-checkout/session.js

@@ -0,0 +1,67 @@
+// src/clients/payment-checkout/config.ts
+var runtimeConfig = null;
+var getApplePayConfig = () => runtimeConfig;
+
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+
+// src/clients/payment-checkout/index.ts
+var getWalletApiBaseUrl = () => {
+  const config = getApplePayConfig();
+  if (!config?.walletApiBaseUrl) {
+    throw new Error(
+      "[web-apple-pay] Missing walletApiBaseUrl. Call configureApplePay({ merchantId, walletApiBaseUrl, ... }) before making wallet API requests."
+    );
+  }
+  return config.walletApiBaseUrl;
+};
+var apiFetch = async (path, options = {}) => {
+  const baseUrl = getWalletApiBaseUrl();
+  const method = (options.method ?? "GET").toUpperCase();
+  const hasBody = options.body !== void 0 && options.body !== null;
+  const headers = new Headers(options.headers);
+  if (!headers.has("Accept")) {
+    headers.set("Accept", "application/json");
+  }
+  if (!headers.has("Content-Type")) {
+    if (hasBody || method !== "GET" && method !== "HEAD") {
+      headers.set("Content-Type", "application/json");
+    }
+  }
+  const response = await fetch(`${baseUrl}${path}`, {
+    ...options,
+    headers
+  });
+  if (!response.ok) {
+    const contentType = response.headers.get("content-type") || "";
+    if (contentType.includes("application/json")) {
+      const errorBody = await response.json();
+      throw new ApiError(response.status, errorBody);
+    }
+    const errorText = await response.text();
+    throw new Error(
+      `API request failed: ${response.status} ${response.statusText} - ${errorText}`
+    );
+  }
+  return response.json();
+};
+
+// src/clients/payment-checkout/session.ts
+var getExpressCheckoutSession = () => {
+  return apiFetch("/v1/wallet/session", {
+    method: "GET",
+    credentials: "include"
+  });
+};
+export {
+  getExpressCheckoutSession
+};

package/dist/src/clients/payment-checkout/types.d.ts

@@ -0,0 +1,14 @@
+export type SessionResponse = {
+    loggedIn: false;
+    userType: 'new-eligible-user';
+} | {
+    loggedIn: true;
+    emailAddress: string;
+    contactId: string;
+    userType: 'active-subscription' | 'b2b-user' | 'new-eligible-user';
+};
+export declare class ApiError extends Error {
+    readonly status: number;
+    readonly body: unknown;
+    constructor(status: number, body: unknown);
+}

package/dist/src/clients/payment-checkout/types.js

@@ -0,0 +1,14 @@
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+export {
+  ApiError
+};

package/dist/src/index.js

@@ -775,6 +775,9 @@ var isApplePayAvailable = async () => {
     }
     const merchantId = getApplePayConfig()?.merchantId;
     if (!merchantId) {
+      console.warn(
+        "[web-apple-pay] Missing merchantId. Call configureApplePay({ merchantId, ... }) before rendering Apple Pay components."
+      );
       return false;
     }
     return await applePaySession.canMakePaymentsWithActiveCard(merchantId);
@@ -784,6 +787,67 @@ var isApplePayAvailable = async () => {
   }
 };
 
+// src/clients/payment-checkout/types.ts
+var ApiError = class extends Error {
+  status;
+  body;
+  constructor(status, body) {
+    super(`API request failed with status ${status}`);
+    this.name = "ApiError";
+    this.status = status;
+    this.body = body;
+  }
+};
+
+// src/clients/payment-checkout/index.ts
+var getWalletApiBaseUrl = () => {
+  const config = getApplePayConfig();
+  if (!config?.walletApiBaseUrl) {
+    throw new Error(
+      "[web-apple-pay] Missing walletApiBaseUrl. Call configureApplePay({ merchantId, walletApiBaseUrl, ... }) before making wallet API requests."
+    );
+  }
+  return config.walletApiBaseUrl;
+};
+var apiFetch = async (path, options = {}) => {
+  const baseUrl = getWalletApiBaseUrl();
+  const method = (options.method ?? "GET").toUpperCase();
+  const hasBody = options.body !== void 0 && options.body !== null;
+  const headers = new Headers(options.headers);
+  if (!headers.has("Accept")) {
+    headers.set("Accept", "application/json");
+  }
+  if (!headers.has("Content-Type")) {
+    if (hasBody || method !== "GET" && method !== "HEAD") {
+      headers.set("Content-Type", "application/json");
+    }
+  }
+  const response = await fetch(`${baseUrl}${path}`, {
+    ...options,
+    headers
+  });
+  if (!response.ok) {
+    const contentType = response.headers.get("content-type") || "";
+    if (contentType.includes("application/json")) {
+      const errorBody = await response.json();
+      throw new ApiError(response.status, errorBody);
+    }
+    const errorText = await response.text();
+    throw new Error(
+      `API request failed: ${response.status} ${response.statusText} - ${errorText}`
+    );
+  }
+  return response.json();
+};
+
+// src/clients/payment-checkout/session.ts
+var getExpressCheckoutSession = () => {
+  return apiFetch("/v1/wallet/session", {
+    method: "GET",
+    credentials: "include"
+  });
+};
+
 // src/apple-pay-button.ts
 var FEATURE_APPLE_PAY_EXPRESS_CHECKOUT = "FEATURE_APPLE_PAY_EXPRESS_CHECKOUT";
 var APPLE_PAY_EXCLUDED_VARIANTS = ["bundle", "insider_print"];
@@ -841,6 +905,11 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
         this.style.display = "none";
         return;
       }
+      const sessionData = await this.#fetchSession();
+      if (sessionData?.loggedIn && (sessionData.userType === "active-subscription" || sessionData.userType === "b2b-user")) {
+        this.style.display = "none";
+        return;
+      }
       this.style.removeProperty("display");
       ensureApplePayLogoSymbol();
       const template = document.createElement("template");
@@ -883,6 +952,13 @@ var ApplePayButton = class _ApplePayButton extends HTMLElement {
     button.setAttribute("disabled", "");
     button.setAttribute("aria-disabled", "true");
   }
+  async #fetchSession() {
+    try {
+      return await getExpressCheckoutSession();
+    } catch {
+      return null;
+    }
+  }
 };
 
 // src/index.ts

package/dist/src/types/offer.types.d.ts

@@ -71,13 +71,3 @@ export type Offer = {
     content?: Content;
     meta_data?: MetaData;
 };
-/** Total number of items matching the relevant lookup. */
-export type ResponseModelMetaTotal = {
-    total: number;
-};
-export type ResponsePostPricedSkuOffer = {
-    /** Offer list. */
-    data: Offer[] | null;
-    /** Set of key value pairs. */
-    meta: ResponseModelMetaTotal | null;
-};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@economist/web-apple-pay",
   "description": "Web component package for Apple Pay checkout UI",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",