@amos.com/react-amos-js 0.6.1 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +6 -6
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -14,7 +14,7 @@ npm install @amos.com/react-amos-js
14
14
 
15
15
  - React components for the iframe payment method forms: `AmosCreditCardPaymentMethodForm`, `AmosBankAccountPaymentMethodForm`, `AmosGooglePayButton`, `AmosApplePayButton`.
16
16
  - React-flavoured iframe message helpers that accept a React `ref`: `validateForm({ iframeRef })`, `confirmPaymentIntent({ iframeRef, token })`, `confirmSetupIntent({ iframeRef, token })`.
17
- - Re-exports of the `@amos.com/amos-js` helpers and types that come up in client code: `createMessage`, `decodeJwt`, `getEmbedOrigin`, `hasNativeApplePaySession`, `formatGooglePayPaymentData`, `FormattedGooglePayPaymentData`, `Appearance`, `Message`, etc.
17
+ - Re-exports of the `@amos.com/amos-js` helpers and types that come up in client code: `createMessage`, `decodeJwt`, `getEmbedOrigin`, `formatGooglePayPaymentData`, `FormattedGooglePayPaymentData`, `Appearance`, `Message`, etc.
18
18
 
19
19
  > **Note:** A server-side SDK (for example `@amos.com/node`) must be used alongside `@amos.com/react-amos-js` for end-to-end payment processing. `@amos.com/react-amos-js` is the client-side half.
20
20
 
@@ -262,7 +262,7 @@ function CheckoutGooglePay() {
262
262
  }
263
263
  ```
264
264
 
265
- `AmosApplePayButton` uses the same props and express-checkout callbacks. Drop it in the same place (or alongside Google Pay) with the same `amount`, `merchantName`, and `onInitiatePaymentIntentRequest` wiring. On mount, the SDK tells the iframe whether the host has a native `ApplePaySession` (Safari); when it does not, the SDK may temporarily expand the iframe full-viewport for Chrome's QR handoff UI.
265
+ `AmosApplePayButton` uses the same props and express-checkout callbacks. Drop it in the same place (or alongside Google Pay) with the same `amount`, `merchantName`, and `onInitiatePaymentIntentRequest` wiring. On Safari, the native payment sheet is used; on other browsers, Apple's QR handoff opens in a popup (`pay.apple.com`). While that popup is open, the SDK shows a waiting overlay on your page with a **Cancel payment** button.
266
266
 
267
267
  ### Saving a payment method with setup intent (credit card)
268
268
 
@@ -422,7 +422,7 @@ Renders the secure Google Pay iframe button (express checkout flow).
422
422
 
423
423
  Renders the secure Apple Pay iframe button (express checkout flow). Same props and callbacks as `AmosGooglePayButton`.
424
424
 
425
- Only Amos domains need Apple merchant registration. During the `IFRAME_READY` handshake, the SDK sends `UPDATE_NATIVE_APPLE_PAY_SESSION` with `hasNativeApplePaySession` (whether the host page exposes a native `ApplePaySession`, typically Safari). When that is `false`, non-Safari browsers load Apple's SDK inside the embed iframe and may send `EXPAND_IFRAME` so Chrome's in-iframe QR handoff UI is not clipped; `COLLAPSE_IFRAME` restores the button-sized layout. Merchants do not need to call `hasNativeApplePaySession` / `updateNativeApplePaySession` or handle expand/collapse themselves `AmosApplePayButton` does this automatically via the re-exported `@amos.com/amos-js` protocol.
425
+ Only Amos domains need Apple merchant registration. The button and `ApplePaySession` run inside the Amos embed iframe. On Safari, the native payment sheet is used. On other browsers, Apple's QR handoff opens in a popup (`pay.apple.com`); while that popup is open, the SDK automatically shows a full-viewport waiting overlay on the host page with instructions and a **Cancel payment** button. You do not need to implement popup or overlay handling yourself.
426
426
 
427
427
  ### `formatGooglePayPaymentData({ paymentData })`
428
428
 
@@ -434,9 +434,9 @@ Transforms Google Pay payment data into an Amos-compatible `paymentMethod` paylo
434
434
 
435
435
  **Returns:** `FormattedGooglePayPaymentData` — the `paymentMethod` field is typed for embed confirm endpoints, so no extra type assertions are needed at call sites.
436
436
 
437
- ### `createMessage(message)` / `decodeJwt(token)` / `getEmbedOrigin(renderToken)` / `hasNativeApplePaySession()`
437
+ ### `createMessage(message)` / `decodeJwt(token)` / `getEmbedOrigin(renderToken)`
438
438
 
439
- Re-exports of the same advanced helpers exposed by `@amos.com/amos-js`. Most integrators do not need to call these directly. `hasNativeApplePaySession` reports whether the host page has a native `ApplePaySession` (Safari); `AmosApplePayButton` already uses it during the iframe handshake.
439
+ Re-exports of the same advanced helpers exposed by `@amos.com/amos-js`. Most integrators do not need to call these directly.
440
440
 
441
441
  ### Exported types
442
442
 
@@ -447,7 +447,7 @@ Re-exports of the same advanced helpers exposed by `@amos.com/amos-js`. Most int
447
447
  - **`ref` / `iframeRef`**: for card and bank forms, pass `ref={iframeRef}` to the form component. The same `iframeRef` must be used when calling `validateForm`, `confirmPaymentIntent`, or `confirmSetupIntent`. The component forwards the ref to the inner iframe.
448
448
  - **Same components for payment vs setup intents**: `AmosCreditCardPaymentMethodForm` and `AmosBankAccountPaymentMethodForm` support both payment intents and setup intents. The flow differs only by which server call you make and which confirmation function you use (`confirmPaymentIntent` vs `confirmSetupIntent`). You may optionally provide `onPaymentIntentConfirmationSucceeded` and/or `onSetupIntentConfirmationSucceeded`; the appropriate one is invoked based on the flow.
449
449
  - **Amount format**: for `AmosGooglePayButton` and `AmosApplePayButton`, `amount` is a string (e.g. `"5000"` for $50.00). For `components["schemas"]["CreatePaymentIntentInput"]` on the server, `amount` is a number in cents (e.g. `5000`).
450
- - **Apple Pay iframe overlay**: on browsers without a native `ApplePaySession` (e.g. Chrome), the SDK may expand the Apple Pay iframe to a full-viewport overlay for QR handoff. Do not clip the iframe in an overflow-hidden container that would prevent that expand, and avoid competing fixed overlays at a higher z-index. During expand, the SDK sets the iframe to `position: fixed` covering the viewport and hides `document.body` overflow.
450
+ - **Apple Pay waiting overlay**: on browsers where Apple's QR handoff opens in a popup (non-Safari), `AmosApplePayButton` shows a fixed full-viewport overlay on the host page until payment completes, the popup closes, or the user clicks **Cancel payment**. Avoid stacking other fixed UI above it.
451
451
  - **Going framework-free**: if you need to use Amos outside of React (vanilla JS, another framework, etc.), use [`@amos.com/amos-js`](../amos-js) directly.
452
452
 
453
453
  ---
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@amos.com/react-amos-js",
3
- "version": "0.6.1",
3
+ "version": "0.7.1",
4
4
  "main": "dist/index.js",
5
5
  "repository": {
6
6
  "type": "git",
@@ -46,7 +46,7 @@
46
46
  "vite-plugin-dts": "5.0.3"
47
47
  },
48
48
  "dependencies": {
49
- "@amos.com/amos-js": "0.6.1",
49
+ "@amos.com/amos-js": "0.7.1",
50
50
  "@amos.com/node": "0.1.32",
51
51
  "@types/googlepay": "0.7.11"
52
52
  },