@wirexapp/card-wallet-topup-web 0.1.0-beta.3 → 0.1.0-beta.5

package/CHANGELOG.md

@@ -1,5 +1,38 @@
 # @wirexapp/card-wallet-topup-web
 
+## 0.1.0-beta.4
+
+### Minor Changes
+
+- 0a24437: Wallet top-up reworked to the confirmed backend contract ("Wallet Top-Ups
+  Integration"): the checkout frame now TOKENIZES AND RETURNS instead of
+  executing. Breaking within the beta line for the wallet surface only
+  (collect/reveal/3ds untouched):
+
+  - `createWalletTopUpForm` / `<WalletTopUpForm />` take `{ quote, walletConfig }`
+    (the host's estimate response + the app config's `topup` provider block,
+    passed verbatim) instead of `{ session: { estimationId, getCheckoutToken } }`
+    — `checkout_token` does not exist in the confirmed contract.
+  - The payment sheet's encrypted payload arrives in `onToken` (replaces
+    `onResult`); relay it verbatim as the execute call's `wallet_payment_token`.
+    The execute watchdog is gone (the host owns execute), and the
+    `threeDsRequired` result is removed — `three_ds_state` is never present on a
+    wallet top-up.
+  - New `onAttemptFailed(reason)` callback for sheet attempts that produce no
+    token (e.g. merchant validation failure).
+  - `checkWalletAvailability` / `useWalletAvailability` accept the provider
+    config so the Google readiness check uses the backend's
+    `allowed_auth_methods` / networks verbatim instead of built-in defaults.
+  - Frames: the checkout document no longer calls estimation-view/config/execute
+    endpoints (its only backend call is Apple merchant validation); the dev mock
+    API now mirrors the real contract shapes (`/api/v1/cards/topup/estimate`,
+    `/execute`, `/api/v1/config` `topup` block).
+
+### Patch Changes
+
+- Updated dependencies [0a24437]
+  - @wirexapp/card-sdk-core@0.1.0-beta.4
+
 ## 0.1.0-beta.3
 
 ### Minor Changes

package/README.md

@@ -1,20 +1,24 @@
 # @wirexapp/card-wallet-topup-web
 
 Top up via Apple Pay / Google Pay inside a Wirex-served checkout frame: the
-frame renders the transaction review (amounts fetched by estimation id — the
-host cannot spoof them) and the wallet buttons under Wirex's single merchant
-identity, so partners need no Apple/Google onboarding of their own. The host
-passes only an estimation reference and receives status callbacks.
+frame renders the transaction review from your quote and the wallet buttons
+under Wirex's single merchant identity, so partners need no Apple/Google
+onboarding of their own. The frame tokenizes and returns — the payment sheet's
+encrypted payload comes back to your page, and your app calls the execute
+endpoint with it (`wallet_payment_token`, relayed verbatim). There is no 3DS
+on the wallet path.
 
-- `checkWalletAvailability(sdk)` — Phase-A probe (hidden frame, cached per
-  page session): `{ applePay, googlePay }` as the real tokenization path
-  would answer, per browser/context.
-- `createWalletTopUpForm(sdk, config)` — mount / update / destroy the checkout
-  frame; results via callbacks, with an execute watchdog and a designed-in
-  `threeDsRequired` fallback into `@wirexapp/card-3ds-web`.
+- `checkWalletAvailability(sdk, { config })` — Phase-A probe (hidden frame,
+  cached per page session): `{ applePay, googlePay }` as the real tokenization
+  path would answer, per browser/context. Pass the app config's `topup`
+  provider block so the Google check mirrors the real parameters.
+- `createWalletTopUpForm(sdk, { quote, walletConfig, onToken, ... })` — mount /
+  update / destroy the checkout frame; the sheet's token arrives in `onToken`,
+  quote expiry in `onEstimationExpired` (re-estimate and `update()`).
 
 Availability rule: render a wallet entry point only where the probe says it
-can tokenize (Safari → Apple Pay, Android Chrome → Google Pay).
+can tokenize (Safari → Apple Pay, Android Chrome → Google Pay), and only when
+the `WalletTopup` capability is Active.
 
 React bindings: `useWalletAvailability()` + `<WalletTopUpForm />` in
 `@wirexapp/card-react`. Full partner docs: `partner-docs/` in the repo

package/dist/index.d.ts

@@ -1,33 +1,48 @@
 /**
  * `@wirexapp/card-wallet-topup-web` — top up via Apple Pay / Google Pay inside
- * a Wirex-served checkout iframe. Design: docs/WALLET-TOPUP-DESIGN.md.
+ * a Wirex-served checkout iframe. Design: docs/WALLET-TOPUP-DESIGN.md, on the
+ * confirmed backend contract ("Wallet Top-Ups Integration").
  *
- * The flow (partner's view):
- *  1. Your backend prices the top-up through the Wirex estimate API and hands
- *     your frontend an `estimation_id` + a short-lived `checkout_token`.
- *  2. `checkWalletAvailability()` (once per session, before showing the row).
+ * The flow (host's view):
+ *  1. Read the app config's `topup` block (providers keyed by name) and the
+ *     `WalletTopup` capability; `checkWalletAvailability()` (once per session,
+ *     before showing the row) answers whether THIS device can tokenize.
+ *  2. Estimate with a wallet `payment_method` (no card id) — the response owns
+ *     the instrument and names the `provider` whose config block applies.
  *  3. `createWalletTopUpForm(...).mount(container)` — the frame renders the
- *     review screen (amounts fetched from the backend, not from your page) and
- *     the wallet buttons under Wirex's merchant identity. No Apple/Google
- *     registration, no certificates, no PCI exposure on your side.
- *  4. The outcome arrives in `onResult`; reconcile the money-moved truth on
- *     your backend. A `threeDsRequired` outcome plugs into
- *     `@wirexapp/card-3ds-web`.
+ *     review screen from your quote and the wallet buttons under Wirex's
+ *     merchant identity. No Apple/Google registration, no certificates.
+ *  4. The payment sheet's encrypted payload arrives in `onToken` — relay it
+ *     VERBATIM as the execute call's `wallet_payment_token`. No 3DS ever
+ *     happens on this path; reconcile the money-moved truth on your backend.
  */
-import { PciWalletTopUpElement, type PciSdkConfig, type PciWalletAvailability, type PciWalletTopUpElementConfig } from '@wirexapp/card-sdk-core';
+import { PciWalletTopUpElement, type PciSdkConfig, type PciWalletAvailability, type PciWalletProviderConfig, type PciWalletTopUpElementConfig, type PciWalletTopUpPopup, type PciWalletTopUpPopupConfig } from '@wirexapp/card-sdk-core';
 /** Config of the combined (review + buttons) wallet checkout element. */
 export type WalletTopUpFormConfig = PciWalletTopUpElementConfig;
 export type WalletTopUpForm = PciWalletTopUpElement;
+export interface CheckWalletAvailabilityOptions {
+    force?: boolean;
+    /** The app config's `topup` provider block (`default_provider` entry —
+     *  before a quote exists there is nothing to echo). When present its Google
+     *  Pay values drive the readiness check verbatim. */
+    config?: PciWalletProviderConfig;
+}
 /**
  * Phase-A availability check. Run it before showing the wallet row at all —
  * `false` means hide the row (`googlePay: false` on desktop/non-Chrome is
  * expected: the cryptogram-only policy has no eligible cards there).
  */
-export declare const checkWalletAvailability: (sdk: PciSdkConfig, options?: {
-    force?: boolean;
-}) => Promise<PciWalletAvailability>;
+export declare const checkWalletAvailability: (sdk: PciSdkConfig, options?: CheckWalletAvailabilityOptions) => Promise<PciWalletAvailability>;
 /** Combined variant: review screen + wallet buttons in one Wirex-served frame. */
 export declare const createWalletTopUpForm: (sdk: PciSdkConfig, config: WalletTopUpFormConfig) => WalletTopUpForm;
 export type * from '@wirexapp/card-sdk-core';
 export { PciFrameRequestError } from '@wirexapp/card-sdk-core';
+/** Mode B: the wallet checkout opened TOP-LEVEL in a popup on the frames
+ *  domain. Apple binds merchant sessions to the top-level page's domain — in
+ *  a popup that is the frames origin itself (already Apple-verified), so
+ *  hosts need NO Apple domain registration or association file in this mode.
+ *  MUST be called synchronously from a click handler (popup blockers). The
+ *  encrypted token still arrives in `onToken`; the host still executes. */
+export declare const openWalletCheckoutPopup: (sdk: PciSdkConfig, config: PciWalletTopUpPopupConfig) => PciWalletTopUpPopup;
+export type { PciWalletTopUpPopup as WalletTopUpPopup, PciWalletTopUpPopupConfig as WalletTopUpPopupConfig };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAGL,qBAAqB,EACrB,KAAK,YAAY,EACjB,KAAK,qBAAqB,EAC1B,KAAK,2BAA2B,EACjC,MAAM,yBAAyB,CAAC;AAEjC,yEAAyE;AACzE,MAAM,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAChE,MAAM,MAAM,eAAe,GAAG,qBAAqB,CAAC;AAOpD;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,GAClC,KAAK,YAAY,EACjB,UAAU;IAAE,KAAK,CAAC,EAAE,OAAO,CAAA;CAAE,KAC5B,OAAO,CAAC,qBAAqB,CAY/B,CAAC;AAEF,kFAAkF;AAClF,eAAO,MAAM,qBAAqB,GAChC,KAAK,YAAY,EACjB,QAAQ,qBAAqB,KAC5B,eAA2F,CAAC;AAI/F,mBAAmB,yBAAyB,CAAC;AAG7C,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAIL,qBAAqB,EACrB,KAAK,YAAY,EACjB,KAAK,qBAAqB,EAC1B,KAAK,uBAAuB,EAC5B,KAAK,2BAA2B,EAChC,KAAK,mBAAmB,EACxB,KAAK,yBAAyB,EAC/B,MAAM,yBAAyB,CAAC;AAEjC,yEAAyE;AACzE,MAAM,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AAChE,MAAM,MAAM,eAAe,GAAG,qBAAqB,CAAC;AASpD,MAAM,WAAW,8BAA8B;IAC7C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;yDAEqD;IACrD,MAAM,CAAC,EAAE,uBAAuB,CAAC;CAClC;AAED;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,GAClC,KAAK,YAAY,EACjB,UAAU,8BAA8B,KACvC,OAAO,CAAC,qBAAqB,CAY/B,CAAC;AAEF,kFAAkF;AAClF,eAAO,MAAM,qBAAqB,GAChC,KAAK,YAAY,EACjB,QAAQ,qBAAqB,KAC5B,eAA2F,CAAC;AAI/F,mBAAmB,yBAAyB,CAAC;AAG7C,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE/D;;;;;2EAK2E;AAC3E,eAAO,MAAM,uBAAuB,GAClC,KAAK,YAAY,EACjB,QAAQ,yBAAyB,KAChC,mBAA0F,CAAC;AAE9F,YAAY,EAAE,mBAAmB,IAAI,gBAAgB,EAAE,yBAAyB,IAAI,sBAAsB,EAAE,CAAC"}

package/dist/index.js

@@ -1,23 +1,27 @@
 /**
  * `@wirexapp/card-wallet-topup-web` — top up via Apple Pay / Google Pay inside
- * a Wirex-served checkout iframe. Design: docs/WALLET-TOPUP-DESIGN.md.
+ * a Wirex-served checkout iframe. Design: docs/WALLET-TOPUP-DESIGN.md, on the
+ * confirmed backend contract ("Wallet Top-Ups Integration").
  *
- * The flow (partner's view):
- *  1. Your backend prices the top-up through the Wirex estimate API and hands
- *     your frontend an `estimation_id` + a short-lived `checkout_token`.
- *  2. `checkWalletAvailability()` (once per session, before showing the row).
+ * The flow (host's view):
+ *  1. Read the app config's `topup` block (providers keyed by name) and the
+ *     `WalletTopup` capability; `checkWalletAvailability()` (once per session,
+ *     before showing the row) answers whether THIS device can tokenize.
+ *  2. Estimate with a wallet `payment_method` (no card id) — the response owns
+ *     the instrument and names the `provider` whose config block applies.
  *  3. `createWalletTopUpForm(...).mount(container)` — the frame renders the
- *     review screen (amounts fetched from the backend, not from your page) and
- *     the wallet buttons under Wirex's merchant identity. No Apple/Google
- *     registration, no certificates, no PCI exposure on your side.
- *  4. The outcome arrives in `onResult`; reconcile the money-moved truth on
- *     your backend. A `threeDsRequired` outcome plugs into
- *     `@wirexapp/card-3ds-web`.
+ *     review screen from your quote and the wallet buttons under Wirex's
+ *     merchant identity. No Apple/Google registration, no certificates.
+ *  4. The payment sheet's encrypted payload arrives in `onToken` — relay it
+ *     VERBATIM as the execute call's `wallet_payment_token`. No 3DS ever
+ *     happens on this path; reconcile the money-moved truth on your backend.
  */
-import { buildFrameUrl, probeWalletAvailability, PciWalletTopUpElement, } from '@wirexapp/card-sdk-core';
+import { buildFrameUrl, openWalletTopUpPopup, probeWalletAvailability, PciWalletTopUpElement, } from '@wirexapp/card-sdk-core';
 /** One probe per frame URL (environment + client) per page session — the
  *  checks take no transaction context, so the result cannot go stale within a
- *  session. Failed probes are not cached. */
+ *  session. The provider config is assumed stable per session (it comes from
+ *  the app config), so it does not partition the cache. Failed probes are not
+ *  cached. */
 const availabilityCache = new Map();
 /**
  * Phase-A availability check. Run it before showing the wallet row at all —
@@ -31,7 +35,7 @@ export const checkWalletAvailability = (sdk, options) => {
         if (cached)
             return cached;
     }
-    const probe = probeWalletAvailability(frameUrl).catch((error) => {
+    const probe = probeWalletAvailability(frameUrl, options?.config).catch((error) => {
         availabilityCache.delete(frameUrl);
         throw error;
     });
@@ -43,4 +47,11 @@ export const createWalletTopUpForm = (sdk, config) => new PciWalletTopUpElement(
 // Value re-export so `error instanceof PciFrameRequestError` works when
 // imported from this package.
 export { PciFrameRequestError } from '@wirexapp/card-sdk-core';
+/** Mode B: the wallet checkout opened TOP-LEVEL in a popup on the frames
+ *  domain. Apple binds merchant sessions to the top-level page's domain — in
+ *  a popup that is the frames origin itself (already Apple-verified), so
+ *  hosts need NO Apple domain registration or association file in this mode.
+ *  MUST be called synchronously from a click handler (popup blockers). The
+ *  encrypted token still arrives in `onToken`; the host still executes. */
+export const openWalletCheckoutPopup = (sdk, config) => openWalletTopUpPopup(buildFrameUrl(sdk, 'wallet-checkout'), config);
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EACL,aAAa,EACb,uBAAuB,EACvB,qBAAqB,GAItB,MAAM,yBAAyB,CAAC;AAMjC;;6CAE6C;AAC7C,MAAM,iBAAiB,GAAG,IAAI,GAAG,EAA0C,CAAC;AAE5E;;;;GAIG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACrC,GAAiB,EACjB,OAA6B,EACG,EAAE;IAClC,MAAM,QAAQ,GAAG,aAAa,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC;IACpD,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACpB,MAAM,MAAM,GAAG,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC/C,IAAI,MAAM;YAAE,OAAO,MAAM,CAAC;IAC5B,CAAC;IACD,MAAM,KAAK,GAAG,uBAAuB,CAAC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC,KAAc,EAAE,EAAE;QACvE,iBAAiB,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACnC,MAAM,KAAK,CAAC;IACd,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACvC,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,kFAAkF;AAClF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,GAAiB,EACjB,MAA6B,EACZ,EAAE,CAAC,IAAI,qBAAqB,CAAC,aAAa,CAAC,GAAG,EAAE,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC;AAK/F,wEAAwE;AACxE,8BAA8B;AAC9B,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EACL,aAAa,EACb,oBAAoB,EACpB,uBAAuB,EACvB,qBAAqB,GAOtB,MAAM,yBAAyB,CAAC;AAMjC;;;;cAIc;AACd,MAAM,iBAAiB,GAAG,IAAI,GAAG,EAA0C,CAAC;AAU5E;;;;GAIG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACrC,GAAiB,EACjB,OAAwC,EACR,EAAE;IAClC,MAAM,QAAQ,GAAG,aAAa,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC;IACpD,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACpB,MAAM,MAAM,GAAG,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC/C,IAAI,MAAM;YAAE,OAAO,MAAM,CAAC;IAC5B,CAAC;IACD,MAAM,KAAK,GAAG,uBAAuB,CAAC,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,KAAc,EAAE,EAAE;QACxF,iBAAiB,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;QACnC,MAAM,KAAK,CAAC;IACd,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACvC,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,kFAAkF;AAClF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,GAAiB,EACjB,MAA6B,EACZ,EAAE,CAAC,IAAI,qBAAqB,CAAC,aAAa,CAAC,GAAG,EAAE,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC;AAK/F,wEAAwE;AACxE,8BAA8B;AAC9B,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE/D;;;;;2EAK2E;AAC3E,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACrC,GAAiB,EACjB,MAAiC,EACZ,EAAE,CAAC,oBAAoB,CAAC,aAAa,CAAC,GAAG,EAAE,iBAAiB,CAAC,EAAE,MAAM,CAAC,CAAC"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@wirexapp/card-wallet-topup-web",
-  "version": "0.1.0-beta.3",
+  "version": "0.1.0-beta.5",
   "type": "module",
-  "description": "Top up via Apple Pay / Google Pay inside a Wirex-served checkout iframe — review screen + wallet buttons under Wirex's merchant identity; the host passes only an estimation reference. No wallet onboarding on the partner side.",
+  "description": "Top up via Apple Pay / Google Pay inside a Wirex-served checkout iframe — review screen + wallet buttons under Wirex's merchant identity; the payment sheet's encrypted token is returned to the host, which executes the top-up. No wallet onboarding on the partner side.",
   "license": "UNLICENSED",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -37,6 +37,6 @@
     "prepublishOnly": "yarn clean && yarn build"
   },
   "dependencies": {
-    "@wirexapp/card-sdk-core": "0.1.0-beta.3"
+    "@wirexapp/card-sdk-core": "0.1.0-beta.5"
   }
 }