@amos.com/amos-js 0.6.1 → 0.7.0
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.
- package/dist/apple-pay.d.ts +2 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/index.mjs +64 -107
- package/dist/messaging.d.ts +0 -13
- package/dist/types.d.ts +0 -18
- package/package.json +1 -1
- package/src/apple-pay.ts +3 -73
- package/src/index.ts +0 -2
- package/src/messaging.ts +0 -28
- package/src/types.ts +0 -21
package/dist/apple-pay.d.ts
CHANGED
|
@@ -75,7 +75,7 @@ export type ApplePayButtonController = {
|
|
|
75
75
|
*
|
|
76
76
|
* The Apple Pay button and `ApplePaySession` run inside the Amos embed
|
|
77
77
|
* iframe (so only Amos domains need Apple merchant registration). On
|
|
78
|
-
*
|
|
79
|
-
*
|
|
78
|
+
* non-Safari browsers, the embed opens Apple's QR handoff in a popup
|
|
79
|
+
* (`pay.apple.com`) rather than expanding this iframe.
|
|
80
80
|
*/
|
|
81
81
|
export declare function attachApplePayButtonListeners(iframe: HTMLIFrameElement, options: ApplePayButtonListenerOptions): ApplePayButtonController;
|
package/dist/index.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ export { attachApplePayButtonListeners, getApplePayButtonInitialHeight, getApple
|
|
|
4
4
|
export type { FormattedGooglePayPaymentData, GooglePayButtonController, GooglePayButtonListenerOptions, } from './google-pay';
|
|
5
5
|
export { attachGooglePayButtonListeners, formatGooglePayPaymentData, getGooglePayButtonInitialHeight, getGooglePayButtonSrc, } from './google-pay';
|
|
6
6
|
export { decodeJwt, getEmbedOrigin } from './jwt';
|
|
7
|
-
export { confirmPaymentIntent, confirmSetupIntent,
|
|
7
|
+
export { confirmPaymentIntent, confirmSetupIntent, sendConfirmationFailed, sendParentReadyMessage, updateAmount, updateAppearance, updateMerchantName, validateForm, } from './messaging';
|
|
8
8
|
export type { AmosApplePayButtonMountController, AmosApplePayButtonOptions, AmosBankAccountPaymentMethodFormOptions, AmosCreditCardPaymentMethodFormOptions, AmosGooglePayButtonMountController, AmosGooglePayButtonOptions, AmosPaymentMethodFormMountController, } from './mount';
|
|
9
9
|
export { mountAmosApplePayButton, mountAmosBankAccountPaymentMethodForm, mountAmosCreditCardPaymentMethodForm, mountAmosGooglePayButton, } from './mount';
|
|
10
10
|
export type { BillingAddressRequirement, CreditCardAdditionalFields, PaymentMethodFormController, PaymentMethodFormListenerOptions, } from './payment-method-form';
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});function e(e){let[t=``,n=``,r=``]=e?.split(`.`)??[],i=typeof atob==`function`?atob:e=>Buffer.from(e,`base64`).toString(`utf8`);return{header:JSON.parse(i(t)),payload:JSON.parse(i(n)),signature:r}}function t(t){let{env:n=`sandbox`}=e(t).payload;switch(n){case`production`:return`https://embed.amos.com`;case`sandbox`:return`https://embed-sandbox.amos.com`;default:return`https://embed-sandbox.amos.com`}}function n(e){return e}function r(e){e?.contentWindow?.postMessage(n({type:`PARENT_ACKNOWLEDGED_IFRAME_READY`}),`*`)}function i({iframe:e,appearance:t={}}){e?.contentWindow?.postMessage(n({type:`UPDATE_APPEARANCE`,appearance:t}),`*`)}function a({iframe:e,amount:t}){e?.contentWindow?.postMessage(n({type:`UPDATE_AMOUNT`,amount:t}),`*`)}function o({iframe:e,merchantName:t}){e?.contentWindow?.postMessage(n({type:`UPDATE_MERCHANT_NAME`,merchantName:t}),`*`)}function s(){return`ApplePaySession`in globalThis}function c({iframe:e,hasNativeApplePaySession:t}){e?.contentWindow?.postMessage(n({type:`UPDATE_NATIVE_APPLE_PAY_SESSION`,hasNativeApplePaySession:t}),`*`)}function l({iframe:e}){let t=crypto.randomUUID();return new Promise(r=>{e?.contentWindow?.postMessage(n({type:`VALIDATE_FORM`,requestId:t}),`*`);let i=setTimeout(()=>{window.removeEventListener(`message`,a),r(!1)},5e3);function a(e){e.data.type===`VALIDATE_FORM`&&e.data.requestId===t&&(window.removeEventListener(`message`,a),clearTimeout(i),r(e.data.isValid??!1))}window.addEventListener(`message`,a)})}function u({iframe:t,token:r}){let{payment_intent_id:i}=e(r).payload;t?.contentWindow?.postMessage(n({type:`CONFIRM_PAYMENT_INTENT`,token:r,id:i??void 0}),`*`)}function d({iframe:t,token:r}){let{setup_intent_id:i}=e(r).payload;t?.contentWindow?.postMessage(n({type:`CONFIRM_SETUP_INTENT`,token:r,id:i??void 0}),`*`)}function f({iframe:e,errorMessage:t}){e?.contentWindow?.postMessage(n({type:`CONFIRMATION_FAILED`,errorMessage:t}),`*`)}function p(e){return`${t(e)}/iframe/apple-pay?token=${e}`}function m(){return`40px`}function h(e){let t={cssText:e.style.cssText,bodyOverflow:document.body.style.overflow};return document.body.style.overflow=`hidden`,Object.assign(e.style,{position:`fixed`,inset:`0px`,width:`100vw`,height:`100vh`,maxWidth:`none`,maxHeight:`none`,margin:`0`,border:`0`,zIndex:`2147483647`,opacity:`1`,background:`#ffffff`}),t}function g(e,t){t&&(document.body.style.overflow=t.bodyOverflow,e.style.cssText=t.cssText)}function _(e,t){let n={...t},l=null;function d(){a({iframe:e,amount:n.amount})}function p(){o({iframe:e,merchantName:n.merchantName})}function m(){c({iframe:e,hasNativeApplePaySession:s()})}function _(t){if(t.source===e.contentWindow)switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance}),m(),d(),p();break;case`UPDATE_HEIGHT`:l||n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`EXPAND_IFRAME`:l||=h(e);break;case`COLLAPSE_IFRAME`:g(e,l),l=null;break;case`CREATE_PAYMENT_INTENT`:n.onInitiatePaymentIntentRequest({paymentIntentCreateAttributes:t.data.paymentIntentCreateAttributes,customerCreateAttributes:t.data.customerCreateAttributes}).then(t=>{u({iframe:e,token:t})}).catch(t=>{f({iframe:e,errorMessage:t instanceof Error?t.message:`Unknown error`})});break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded(t.data.paymentIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,_),{update(t){let r=`appearance`in t,a=`amount`in t,o=`merchantName`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance}),a&&d(),o&&p()},destroy(){window.removeEventListener(`message`,_),g(e,l),l=null}}}function v(e){return`${t(e)}/iframe/google-pay?token=${e}`}function y(){return`40px`}function b(e,t){let n={...t};function s(){a({iframe:e,amount:n.amount})}function c(){o({iframe:e,merchantName:n.merchantName})}function l(t){switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance}),s(),c();break;case`UPDATE_HEIGHT`:n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`CREATE_PAYMENT_INTENT`:n.onInitiatePaymentIntentRequest({paymentIntentCreateAttributes:t.data.paymentIntentCreateAttributes,customerCreateAttributes:t.data.customerCreateAttributes}).then(t=>{u({iframe:e,token:t})}).catch(t=>{f({iframe:e,errorMessage:t instanceof Error?t.message:`Unknown error`})});break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded(t.data.paymentIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,l),{update(t){let r=`appearance`in t,a=`amount`in t,o=`merchantName`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance}),a&&s(),o&&c()},destroy(){window.removeEventListener(`message`,l)}}}function x({paymentData:e}){return{paymentMethod:{type:`googlepay`,billing_address_attributes:{name:e.shippingAddress?.name,address_line1:e.shippingAddress?.address1,address_line2:e.shippingAddress?.address2,city:e.shippingAddress?.locality,state:e.shippingAddress?.administrativeArea,postal_code:e.shippingAddress?.postalCode,country:e.shippingAddress?.countryCode,email:e.email,phone:e.shippingAddress?.phoneNumber},card_profile_attributes:{wallet_provider:`googlepay`,wallet_payload:e.paymentMethodData.tokenizationData.token,wallet_last4:e.paymentMethodData.info?.cardDetails,wallet_brand:(()=>{switch(e.paymentMethodData.info?.cardNetwork){case`AMEX`:return`american_express`;case`VISA`:return`visa`;case`MASTERCARD`:return`master`;case`DISCOVER`:return`discover`;default:return}})()}}}}var S={country:212,full:452},C=80,w={country:400,full:640};function T(e,n={cardholderName:!1},r=`country`){let i=Object.entries(n).filter(([,e])=>e).map(([e])=>e).join(`,`),a=new URLSearchParams({token:e,additionalFields:i,billingAddressRequirement:r});return`${t(e)}/iframe/card?${a}`}function E(e,n=`country`){let r=new URLSearchParams({token:e,billingAddressRequirement:n});return`${t(e)}/iframe/bank?${r}`}function D(e={cardholderName:!1},t=`country`){return`${(S[t]??S.country)+(e.cardholderName?C:0)}px`}function O(e=`country`){return`${w[e]??w.country}px`}function k(e,t){let n={...t};function a(t){switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance});break;case`UPDATE_HEIGHT`:n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded?.(t.data.paymentIntent);break;case`SETUP_INTENT_CONFIRMATION_SUCCEEDED`:n.onSetupIntentConfirmationSucceeded?.(t.data.setupIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,a),{update(t){let r=`appearance`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance})},destroy(){window.removeEventListener(`message`,a)}}}function A(e){if(typeof e==`string`){let t=document.querySelector(e);if(!(t instanceof HTMLElement))throw Error(`[amos-js] Container "${e}" did not match any HTMLElement.`);return t}return e}var j={width:`calc(100% + 8px)`,transition:`opacity 150ms ease-in, height 200ms ease-in-out`,margin:`0 -4px`,opacity:`0`,border:`0`};function M({src:e,title:t,name:n,height:r,allow:i}){let a=document.createElement(`iframe`);return a.src=e,a.title=t,a.name=n,a.setAttribute(`role`,`presentation`),a.scrolling=`no`,i&&(a.allow=i),Object.assign(a.style,j,{height:r}),a}function N(e,t){let n=A(e),{renderToken:r,additionalFields:i={cardholderName:!1},billingAddressRequirement:a=`country`,...o}=t,s=M({src:T(r,i,a),title:`Secure credit card payment method form powered by Amos`,name:`amos-credit-card-payment-method-form`,height:D(i,a)});n.appendChild(s);let c=k(s,{...o,onHeightChange:e=>{s.style.height=e,o.onHeightChange?.(e)},onAppearanceReady:()=>{s.style.opacity=`1`,o.onAppearanceReady?.()}});return{iframe:s,update:c.update,destroy(){c.destroy(),s.remove()}}}function P(e,t){let n=A(e),{renderToken:r,billingAddressRequirement:i=`country`,...a}=t,o=M({src:E(r,i),title:`Secure bank account payment method form powered by Amos`,name:`amos-bank-account-payment-method-form`,height:O(i)});n.appendChild(o);let s=k(o,{...a,onHeightChange:e=>{o.style.height=e,a.onHeightChange?.(e)},onAppearanceReady:()=>{o.style.opacity=`1`,a.onAppearanceReady?.()}});return{iframe:o,update:s.update,destroy(){s.destroy(),o.remove()}}}function F(e,t){let n=A(e),{renderToken:r,...i}=t,a=M({src:v(r),title:`Secure Google Pay button powered by Amos`,name:`amos-google-pay-button`,height:y(),allow:`payment`});n.appendChild(a);let o=b(a,{...i,onHeightChange:e=>{a.style.height=e,i.onHeightChange?.(e)},onAppearanceReady:()=>{a.style.opacity=`1`,i.onAppearanceReady?.()}});return{iframe:a,update:o.update,destroy(){o.destroy(),a.remove()}}}function I(e,t){let n=A(e),{renderToken:r,...i}=t,a=M({src:p(r),title:`Secure Apple Pay button powered by Amos`,name:`amos-apple-pay-button`,height:m(),allow:`payment`});n.appendChild(a);let o=_(a,{...i,onHeightChange:e=>{a.style.height=e,i.onHeightChange?.(e)},onAppearanceReady:()=>{a.style.opacity=`1`,i.onAppearanceReady?.()}});return{iframe:a,update:o.update,destroy(){o.destroy(),a.remove()}}}exports.attachApplePayButtonListeners=_,exports.attachGooglePayButtonListeners=b,exports.attachPaymentMethodFormListeners=k,exports.confirmPaymentIntent=u,exports.confirmSetupIntent=d,exports.createMessage=n,exports.decodeJwt=e,exports.formatGooglePayPaymentData=x,exports.getApplePayButtonInitialHeight=m,exports.getApplePayButtonSrc=p,exports.getBankAccountFormInitialHeight=O,exports.getBankAccountFormSrc=E,exports.getCreditCardFormInitialHeight=D,exports.getCreditCardFormSrc=T,exports.getEmbedOrigin=t,exports.getGooglePayButtonInitialHeight=y,exports.getGooglePayButtonSrc=v,exports.hasNativeApplePaySession=s,exports.mountAmosApplePayButton=I,exports.mountAmosBankAccountPaymentMethodForm=P,exports.mountAmosCreditCardPaymentMethodForm=N,exports.mountAmosGooglePayButton=F,exports.sendConfirmationFailed=f,exports.sendParentReadyMessage=r,exports.updateAmount=a,exports.updateAppearance=i,exports.updateMerchantName=o,exports.updateNativeApplePaySession=c,exports.validateForm=l;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});function e(e){let[t=``,n=``,r=``]=e?.split(`.`)??[],i=typeof atob==`function`?atob:e=>Buffer.from(e,`base64`).toString(`utf8`);return{header:JSON.parse(i(t)),payload:JSON.parse(i(n)),signature:r}}function t(t){let{env:n=`sandbox`}=e(t).payload;switch(n){case`production`:return`https://embed.amos.com`;case`sandbox`:return`https://embed-sandbox.amos.com`;default:return`https://embed-sandbox.amos.com`}}function n(e){return e}function r(e){e?.contentWindow?.postMessage(n({type:`PARENT_ACKNOWLEDGED_IFRAME_READY`}),`*`)}function i({iframe:e,appearance:t={}}){e?.contentWindow?.postMessage(n({type:`UPDATE_APPEARANCE`,appearance:t}),`*`)}function a({iframe:e,amount:t}){e?.contentWindow?.postMessage(n({type:`UPDATE_AMOUNT`,amount:t}),`*`)}function o({iframe:e,merchantName:t}){e?.contentWindow?.postMessage(n({type:`UPDATE_MERCHANT_NAME`,merchantName:t}),`*`)}function s({iframe:e}){let t=crypto.randomUUID();return new Promise(r=>{e?.contentWindow?.postMessage(n({type:`VALIDATE_FORM`,requestId:t}),`*`);let i=setTimeout(()=>{window.removeEventListener(`message`,a),r(!1)},5e3);function a(e){e.data.type===`VALIDATE_FORM`&&e.data.requestId===t&&(window.removeEventListener(`message`,a),clearTimeout(i),r(e.data.isValid??!1))}window.addEventListener(`message`,a)})}function c({iframe:t,token:r}){let{payment_intent_id:i}=e(r).payload;t?.contentWindow?.postMessage(n({type:`CONFIRM_PAYMENT_INTENT`,token:r,id:i??void 0}),`*`)}function l({iframe:t,token:r}){let{setup_intent_id:i}=e(r).payload;t?.contentWindow?.postMessage(n({type:`CONFIRM_SETUP_INTENT`,token:r,id:i??void 0}),`*`)}function u({iframe:e,errorMessage:t}){e?.contentWindow?.postMessage(n({type:`CONFIRMATION_FAILED`,errorMessage:t}),`*`)}function d(e){return`${t(e)}/iframe/apple-pay?token=${e}`}function f(){return`40px`}function p(e,t){let n={...t};function s(){a({iframe:e,amount:n.amount})}function l(){o({iframe:e,merchantName:n.merchantName})}function d(t){if(t.source===e.contentWindow)switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance}),s(),l();break;case`UPDATE_HEIGHT`:n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`CREATE_PAYMENT_INTENT`:n.onInitiatePaymentIntentRequest({paymentIntentCreateAttributes:t.data.paymentIntentCreateAttributes,customerCreateAttributes:t.data.customerCreateAttributes}).then(t=>{c({iframe:e,token:t})}).catch(t=>{u({iframe:e,errorMessage:t instanceof Error?t.message:`Unknown error`})});break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded(t.data.paymentIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,d),{update(t){let r=`appearance`in t,a=`amount`in t,o=`merchantName`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance}),a&&s(),o&&l()},destroy(){window.removeEventListener(`message`,d)}}}function m(e){return`${t(e)}/iframe/google-pay?token=${e}`}function h(){return`40px`}function g(e,t){let n={...t};function s(){a({iframe:e,amount:n.amount})}function l(){o({iframe:e,merchantName:n.merchantName})}function d(t){switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance}),s(),l();break;case`UPDATE_HEIGHT`:n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`CREATE_PAYMENT_INTENT`:n.onInitiatePaymentIntentRequest({paymentIntentCreateAttributes:t.data.paymentIntentCreateAttributes,customerCreateAttributes:t.data.customerCreateAttributes}).then(t=>{c({iframe:e,token:t})}).catch(t=>{u({iframe:e,errorMessage:t instanceof Error?t.message:`Unknown error`})});break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded(t.data.paymentIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,d),{update(t){let r=`appearance`in t,a=`amount`in t,o=`merchantName`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance}),a&&s(),o&&l()},destroy(){window.removeEventListener(`message`,d)}}}function _({paymentData:e}){return{paymentMethod:{type:`googlepay`,billing_address_attributes:{name:e.shippingAddress?.name,address_line1:e.shippingAddress?.address1,address_line2:e.shippingAddress?.address2,city:e.shippingAddress?.locality,state:e.shippingAddress?.administrativeArea,postal_code:e.shippingAddress?.postalCode,country:e.shippingAddress?.countryCode,email:e.email,phone:e.shippingAddress?.phoneNumber},card_profile_attributes:{wallet_provider:`googlepay`,wallet_payload:e.paymentMethodData.tokenizationData.token,wallet_last4:e.paymentMethodData.info?.cardDetails,wallet_brand:(()=>{switch(e.paymentMethodData.info?.cardNetwork){case`AMEX`:return`american_express`;case`VISA`:return`visa`;case`MASTERCARD`:return`master`;case`DISCOVER`:return`discover`;default:return}})()}}}}var v={country:212,full:452},y=80,b={country:400,full:640};function x(e,n={cardholderName:!1},r=`country`){let i=Object.entries(n).filter(([,e])=>e).map(([e])=>e).join(`,`),a=new URLSearchParams({token:e,additionalFields:i,billingAddressRequirement:r});return`${t(e)}/iframe/card?${a}`}function S(e,n=`country`){let r=new URLSearchParams({token:e,billingAddressRequirement:n});return`${t(e)}/iframe/bank?${r}`}function C(e={cardholderName:!1},t=`country`){return`${(v[t]??v.country)+(e.cardholderName?y:0)}px`}function w(e=`country`){return`${b[e]??b.country}px`}function T(e,t){let n={...t};function a(t){switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance});break;case`UPDATE_HEIGHT`:n.onHeightChange?.(t.data.height);break;case`UPDATE_APPEARANCE`:i({iframe:e,appearance:t.data.appearance});break;case`UPDATED_APPEARANCE`:n.onAppearanceReady?.();break;case`PAYMENT_INTENT_CONFIRMATION_SUCCEEDED`:n.onPaymentIntentConfirmationSucceeded?.(t.data.paymentIntent);break;case`SETUP_INTENT_CONFIRMATION_SUCCEEDED`:n.onSetupIntentConfirmationSucceeded?.(t.data.setupIntent);break;case`CONFIRMATION_FAILED`:n.onConfirmationFailed(t.data.errorMessage);break}}return window.addEventListener(`message`,a),{update(t){let r=`appearance`in t;n={...n,...t},r&&i({iframe:e,appearance:n.appearance})},destroy(){window.removeEventListener(`message`,a)}}}function E(e){if(typeof e==`string`){let t=document.querySelector(e);if(!(t instanceof HTMLElement))throw Error(`[amos-js] Container "${e}" did not match any HTMLElement.`);return t}return e}var D={width:`calc(100% + 8px)`,transition:`opacity 150ms ease-in, height 200ms ease-in-out`,margin:`0 -4px`,opacity:`0`,border:`0`};function O({src:e,title:t,name:n,height:r,allow:i}){let a=document.createElement(`iframe`);return a.src=e,a.title=t,a.name=n,a.setAttribute(`role`,`presentation`),a.scrolling=`no`,i&&(a.allow=i),Object.assign(a.style,D,{height:r}),a}function k(e,t){let n=E(e),{renderToken:r,additionalFields:i={cardholderName:!1},billingAddressRequirement:a=`country`,...o}=t,s=O({src:x(r,i,a),title:`Secure credit card payment method form powered by Amos`,name:`amos-credit-card-payment-method-form`,height:C(i,a)});n.appendChild(s);let c=T(s,{...o,onHeightChange:e=>{s.style.height=e,o.onHeightChange?.(e)},onAppearanceReady:()=>{s.style.opacity=`1`,o.onAppearanceReady?.()}});return{iframe:s,update:c.update,destroy(){c.destroy(),s.remove()}}}function A(e,t){let n=E(e),{renderToken:r,billingAddressRequirement:i=`country`,...a}=t,o=O({src:S(r,i),title:`Secure bank account payment method form powered by Amos`,name:`amos-bank-account-payment-method-form`,height:w(i)});n.appendChild(o);let s=T(o,{...a,onHeightChange:e=>{o.style.height=e,a.onHeightChange?.(e)},onAppearanceReady:()=>{o.style.opacity=`1`,a.onAppearanceReady?.()}});return{iframe:o,update:s.update,destroy(){s.destroy(),o.remove()}}}function j(e,t){let n=E(e),{renderToken:r,...i}=t,a=O({src:m(r),title:`Secure Google Pay button powered by Amos`,name:`amos-google-pay-button`,height:h(),allow:`payment`});n.appendChild(a);let o=g(a,{...i,onHeightChange:e=>{a.style.height=e,i.onHeightChange?.(e)},onAppearanceReady:()=>{a.style.opacity=`1`,i.onAppearanceReady?.()}});return{iframe:a,update:o.update,destroy(){o.destroy(),a.remove()}}}function M(e,t){let n=E(e),{renderToken:r,...i}=t,a=O({src:d(r),title:`Secure Apple Pay button powered by Amos`,name:`amos-apple-pay-button`,height:f(),allow:`payment`});n.appendChild(a);let o=p(a,{...i,onHeightChange:e=>{a.style.height=e,i.onHeightChange?.(e)},onAppearanceReady:()=>{a.style.opacity=`1`,i.onAppearanceReady?.()}});return{iframe:a,update:o.update,destroy(){o.destroy(),a.remove()}}}exports.attachApplePayButtonListeners=p,exports.attachGooglePayButtonListeners=g,exports.attachPaymentMethodFormListeners=T,exports.confirmPaymentIntent=c,exports.confirmSetupIntent=l,exports.createMessage=n,exports.decodeJwt=e,exports.formatGooglePayPaymentData=_,exports.getApplePayButtonInitialHeight=f,exports.getApplePayButtonSrc=d,exports.getBankAccountFormInitialHeight=w,exports.getBankAccountFormSrc=S,exports.getCreditCardFormInitialHeight=C,exports.getCreditCardFormSrc=x,exports.getEmbedOrigin=t,exports.getGooglePayButtonInitialHeight=h,exports.getGooglePayButtonSrc=m,exports.mountAmosApplePayButton=M,exports.mountAmosBankAccountPaymentMethodForm=A,exports.mountAmosCreditCardPaymentMethodForm=k,exports.mountAmosGooglePayButton=j,exports.sendConfirmationFailed=u,exports.sendParentReadyMessage=r,exports.updateAmount=a,exports.updateAppearance=i,exports.updateMerchantName=o,exports.validateForm=s;
|
package/dist/index.mjs
CHANGED
|
@@ -43,16 +43,7 @@ function o({ iframe: e, merchantName: t }) {
|
|
|
43
43
|
merchantName: t
|
|
44
44
|
}), "*");
|
|
45
45
|
}
|
|
46
|
-
function s() {
|
|
47
|
-
return "ApplePaySession" in globalThis;
|
|
48
|
-
}
|
|
49
|
-
function c({ iframe: e, hasNativeApplePaySession: t }) {
|
|
50
|
-
e?.contentWindow?.postMessage(n({
|
|
51
|
-
type: "UPDATE_NATIVE_APPLE_PAY_SESSION",
|
|
52
|
-
hasNativeApplePaySession: t
|
|
53
|
-
}), "*");
|
|
54
|
-
}
|
|
55
|
-
function l({ iframe: e }) {
|
|
46
|
+
function s({ iframe: e }) {
|
|
56
47
|
let t = crypto.randomUUID();
|
|
57
48
|
return new Promise((r) => {
|
|
58
49
|
e?.contentWindow?.postMessage(n({
|
|
@@ -68,7 +59,7 @@ function l({ iframe: e }) {
|
|
|
68
59
|
window.addEventListener("message", a);
|
|
69
60
|
});
|
|
70
61
|
}
|
|
71
|
-
function
|
|
62
|
+
function c({ iframe: t, token: r }) {
|
|
72
63
|
let { payment_intent_id: i } = e(r).payload;
|
|
73
64
|
t?.contentWindow?.postMessage(n({
|
|
74
65
|
type: "CONFIRM_PAYMENT_INTENT",
|
|
@@ -76,7 +67,7 @@ function u({ iframe: t, token: r }) {
|
|
|
76
67
|
id: i ?? void 0
|
|
77
68
|
}), "*");
|
|
78
69
|
}
|
|
79
|
-
function
|
|
70
|
+
function l({ iframe: t, token: r }) {
|
|
80
71
|
let { setup_intent_id: i } = e(r).payload;
|
|
81
72
|
t?.contentWindow?.postMessage(n({
|
|
82
73
|
type: "CONFIRM_SETUP_INTENT",
|
|
@@ -84,7 +75,7 @@ function d({ iframe: t, token: r }) {
|
|
|
84
75
|
id: i ?? void 0
|
|
85
76
|
}), "*");
|
|
86
77
|
}
|
|
87
|
-
function
|
|
78
|
+
function u({ iframe: e, errorMessage: t }) {
|
|
88
79
|
e?.contentWindow?.postMessage(n({
|
|
89
80
|
type: "CONFIRMATION_FAILED",
|
|
90
81
|
errorMessage: t
|
|
@@ -92,64 +83,36 @@ function f({ iframe: e, errorMessage: t }) {
|
|
|
92
83
|
}
|
|
93
84
|
//#endregion
|
|
94
85
|
//#region src/apple-pay.ts
|
|
95
|
-
function
|
|
86
|
+
function d(e) {
|
|
96
87
|
return `${t(e)}/iframe/apple-pay?token=${e}`;
|
|
97
88
|
}
|
|
98
|
-
function
|
|
89
|
+
function f() {
|
|
99
90
|
return "40px";
|
|
100
91
|
}
|
|
101
|
-
function
|
|
102
|
-
let
|
|
103
|
-
|
|
104
|
-
bodyOverflow: document.body.style.overflow
|
|
105
|
-
};
|
|
106
|
-
return document.body.style.overflow = "hidden", Object.assign(e.style, {
|
|
107
|
-
position: "fixed",
|
|
108
|
-
inset: "0px",
|
|
109
|
-
width: "100vw",
|
|
110
|
-
height: "100vh",
|
|
111
|
-
maxWidth: "none",
|
|
112
|
-
maxHeight: "none",
|
|
113
|
-
margin: "0",
|
|
114
|
-
border: "0",
|
|
115
|
-
zIndex: "2147483647",
|
|
116
|
-
opacity: "1",
|
|
117
|
-
background: "#ffffff"
|
|
118
|
-
}), t;
|
|
119
|
-
}
|
|
120
|
-
function g(e, t) {
|
|
121
|
-
t && (document.body.style.overflow = t.bodyOverflow, e.style.cssText = t.cssText);
|
|
122
|
-
}
|
|
123
|
-
function _(e, t) {
|
|
124
|
-
let n = { ...t }, l = null;
|
|
125
|
-
function d() {
|
|
92
|
+
function p(e, t) {
|
|
93
|
+
let n = { ...t };
|
|
94
|
+
function s() {
|
|
126
95
|
a({
|
|
127
96
|
iframe: e,
|
|
128
97
|
amount: n.amount
|
|
129
98
|
});
|
|
130
99
|
}
|
|
131
|
-
function
|
|
100
|
+
function l() {
|
|
132
101
|
o({
|
|
133
102
|
iframe: e,
|
|
134
103
|
merchantName: n.merchantName
|
|
135
104
|
});
|
|
136
105
|
}
|
|
137
|
-
function
|
|
138
|
-
c({
|
|
139
|
-
iframe: e,
|
|
140
|
-
hasNativeApplePaySession: s()
|
|
141
|
-
});
|
|
142
|
-
}
|
|
143
|
-
function _(t) {
|
|
106
|
+
function d(t) {
|
|
144
107
|
if (t.source === e.contentWindow) switch (t.data.type) {
|
|
145
108
|
case "IFRAME_READY":
|
|
146
109
|
r(e), i({
|
|
147
110
|
iframe: e,
|
|
148
111
|
appearance: n.appearance
|
|
149
|
-
}),
|
|
112
|
+
}), s(), l();
|
|
150
113
|
break;
|
|
151
114
|
case "UPDATE_HEIGHT":
|
|
152
|
-
|
|
115
|
+
n.onHeightChange?.(t.data.height);
|
|
153
116
|
break;
|
|
154
117
|
case "UPDATE_APPEARANCE":
|
|
155
118
|
i({
|
|
@@ -160,23 +123,17 @@ function _(e, t) {
|
|
|
160
123
|
case "UPDATED_APPEARANCE":
|
|
161
124
|
n.onAppearanceReady?.();
|
|
162
125
|
break;
|
|
163
|
-
case "EXPAND_IFRAME":
|
|
164
|
-
l ||= h(e);
|
|
165
|
-
break;
|
|
166
|
-
case "COLLAPSE_IFRAME":
|
|
167
|
-
g(e, l), l = null;
|
|
168
|
-
break;
|
|
169
126
|
case "CREATE_PAYMENT_INTENT":
|
|
170
127
|
n.onInitiatePaymentIntentRequest({
|
|
171
128
|
paymentIntentCreateAttributes: t.data.paymentIntentCreateAttributes,
|
|
172
129
|
customerCreateAttributes: t.data.customerCreateAttributes
|
|
173
130
|
}).then((t) => {
|
|
174
|
-
|
|
131
|
+
c({
|
|
175
132
|
iframe: e,
|
|
176
133
|
token: t
|
|
177
134
|
});
|
|
178
135
|
}).catch((t) => {
|
|
179
|
-
|
|
136
|
+
u({
|
|
180
137
|
iframe: e,
|
|
181
138
|
errorMessage: t instanceof Error ? t.message : "Unknown error"
|
|
182
139
|
});
|
|
@@ -190,7 +147,7 @@ function _(e, t) {
|
|
|
190
147
|
break;
|
|
191
148
|
}
|
|
192
149
|
}
|
|
193
|
-
return window.addEventListener("message",
|
|
150
|
+
return window.addEventListener("message", d), {
|
|
194
151
|
update(t) {
|
|
195
152
|
let r = "appearance" in t, a = "amount" in t, o = "merchantName" in t;
|
|
196
153
|
n = {
|
|
@@ -199,22 +156,22 @@ function _(e, t) {
|
|
|
199
156
|
}, r && i({
|
|
200
157
|
iframe: e,
|
|
201
158
|
appearance: n.appearance
|
|
202
|
-
}), a &&
|
|
159
|
+
}), a && s(), o && l();
|
|
203
160
|
},
|
|
204
161
|
destroy() {
|
|
205
|
-
window.removeEventListener("message",
|
|
162
|
+
window.removeEventListener("message", d);
|
|
206
163
|
}
|
|
207
164
|
};
|
|
208
165
|
}
|
|
209
166
|
//#endregion
|
|
210
167
|
//#region src/google-pay.ts
|
|
211
|
-
function
|
|
168
|
+
function m(e) {
|
|
212
169
|
return `${t(e)}/iframe/google-pay?token=${e}`;
|
|
213
170
|
}
|
|
214
|
-
function
|
|
171
|
+
function h() {
|
|
215
172
|
return "40px";
|
|
216
173
|
}
|
|
217
|
-
function
|
|
174
|
+
function g(e, t) {
|
|
218
175
|
let n = { ...t };
|
|
219
176
|
function s() {
|
|
220
177
|
a({
|
|
@@ -222,19 +179,19 @@ function b(e, t) {
|
|
|
222
179
|
amount: n.amount
|
|
223
180
|
});
|
|
224
181
|
}
|
|
225
|
-
function
|
|
182
|
+
function l() {
|
|
226
183
|
o({
|
|
227
184
|
iframe: e,
|
|
228
185
|
merchantName: n.merchantName
|
|
229
186
|
});
|
|
230
187
|
}
|
|
231
|
-
function
|
|
188
|
+
function d(t) {
|
|
232
189
|
switch (t.data.type) {
|
|
233
190
|
case "IFRAME_READY":
|
|
234
191
|
r(e), i({
|
|
235
192
|
iframe: e,
|
|
236
193
|
appearance: n.appearance
|
|
237
|
-
}), s(),
|
|
194
|
+
}), s(), l();
|
|
238
195
|
break;
|
|
239
196
|
case "UPDATE_HEIGHT":
|
|
240
197
|
n.onHeightChange?.(t.data.height);
|
|
@@ -253,12 +210,12 @@ function b(e, t) {
|
|
|
253
210
|
paymentIntentCreateAttributes: t.data.paymentIntentCreateAttributes,
|
|
254
211
|
customerCreateAttributes: t.data.customerCreateAttributes
|
|
255
212
|
}).then((t) => {
|
|
256
|
-
|
|
213
|
+
c({
|
|
257
214
|
iframe: e,
|
|
258
215
|
token: t
|
|
259
216
|
});
|
|
260
217
|
}).catch((t) => {
|
|
261
|
-
|
|
218
|
+
u({
|
|
262
219
|
iframe: e,
|
|
263
220
|
errorMessage: t instanceof Error ? t.message : "Unknown error"
|
|
264
221
|
});
|
|
@@ -272,7 +229,7 @@ function b(e, t) {
|
|
|
272
229
|
break;
|
|
273
230
|
}
|
|
274
231
|
}
|
|
275
|
-
return window.addEventListener("message",
|
|
232
|
+
return window.addEventListener("message", d), {
|
|
276
233
|
update(t) {
|
|
277
234
|
let r = "appearance" in t, a = "amount" in t, o = "merchantName" in t;
|
|
278
235
|
n = {
|
|
@@ -281,14 +238,14 @@ function b(e, t) {
|
|
|
281
238
|
}, r && i({
|
|
282
239
|
iframe: e,
|
|
283
240
|
appearance: n.appearance
|
|
284
|
-
}), a && s(), o &&
|
|
241
|
+
}), a && s(), o && l();
|
|
285
242
|
},
|
|
286
243
|
destroy() {
|
|
287
|
-
window.removeEventListener("message",
|
|
244
|
+
window.removeEventListener("message", d);
|
|
288
245
|
}
|
|
289
246
|
};
|
|
290
247
|
}
|
|
291
|
-
function
|
|
248
|
+
function _({ paymentData: e }) {
|
|
292
249
|
return { paymentMethod: {
|
|
293
250
|
type: "googlepay",
|
|
294
251
|
billing_address_attributes: {
|
|
@@ -320,14 +277,14 @@ function x({ paymentData: e }) {
|
|
|
320
277
|
}
|
|
321
278
|
//#endregion
|
|
322
279
|
//#region src/payment-method-form.ts
|
|
323
|
-
var
|
|
280
|
+
var v = {
|
|
324
281
|
country: 212,
|
|
325
282
|
full: 452
|
|
326
|
-
},
|
|
283
|
+
}, y = 80, b = {
|
|
327
284
|
country: 400,
|
|
328
285
|
full: 640
|
|
329
286
|
};
|
|
330
|
-
function
|
|
287
|
+
function x(e, n = { cardholderName: !1 }, r = "country") {
|
|
331
288
|
let i = Object.entries(n).filter(([, e]) => e).map(([e]) => e).join(","), a = new URLSearchParams({
|
|
332
289
|
token: e,
|
|
333
290
|
additionalFields: i,
|
|
@@ -335,20 +292,20 @@ function T(e, n = { cardholderName: !1 }, r = "country") {
|
|
|
335
292
|
});
|
|
336
293
|
return `${t(e)}/iframe/card?${a}`;
|
|
337
294
|
}
|
|
338
|
-
function
|
|
295
|
+
function S(e, n = "country") {
|
|
339
296
|
let r = new URLSearchParams({
|
|
340
297
|
token: e,
|
|
341
298
|
billingAddressRequirement: n
|
|
342
299
|
});
|
|
343
300
|
return `${t(e)}/iframe/bank?${r}`;
|
|
344
301
|
}
|
|
345
|
-
function
|
|
346
|
-
return `${(
|
|
302
|
+
function C(e = { cardholderName: !1 }, t = "country") {
|
|
303
|
+
return `${(v[t] ?? v.country) + (e.cardholderName ? y : 0)}px`;
|
|
347
304
|
}
|
|
348
|
-
function
|
|
349
|
-
return `${
|
|
305
|
+
function w(e = "country") {
|
|
306
|
+
return `${b[e] ?? b.country}px`;
|
|
350
307
|
}
|
|
351
|
-
function
|
|
308
|
+
function T(e, t) {
|
|
352
309
|
let n = { ...t };
|
|
353
310
|
function a(t) {
|
|
354
311
|
switch (t.data.type) {
|
|
@@ -399,7 +356,7 @@ function k(e, t) {
|
|
|
399
356
|
}
|
|
400
357
|
//#endregion
|
|
401
358
|
//#region src/mount.ts
|
|
402
|
-
function
|
|
359
|
+
function E(e) {
|
|
403
360
|
if (typeof e == "string") {
|
|
404
361
|
let t = document.querySelector(e);
|
|
405
362
|
if (!(t instanceof HTMLElement)) throw Error(`[amos-js] Container "${e}" did not match any HTMLElement.`);
|
|
@@ -407,26 +364,26 @@ function A(e) {
|
|
|
407
364
|
}
|
|
408
365
|
return e;
|
|
409
366
|
}
|
|
410
|
-
var
|
|
367
|
+
var D = {
|
|
411
368
|
width: "calc(100% + 8px)",
|
|
412
369
|
transition: "opacity 150ms ease-in, height 200ms ease-in-out",
|
|
413
370
|
margin: "0 -4px",
|
|
414
371
|
opacity: "0",
|
|
415
372
|
border: "0"
|
|
416
373
|
};
|
|
417
|
-
function
|
|
374
|
+
function O({ src: e, title: t, name: n, height: r, allow: i }) {
|
|
418
375
|
let a = document.createElement("iframe");
|
|
419
|
-
return a.src = e, a.title = t, a.name = n, a.setAttribute("role", "presentation"), a.scrolling = "no", i && (a.allow = i), Object.assign(a.style,
|
|
376
|
+
return a.src = e, a.title = t, a.name = n, a.setAttribute("role", "presentation"), a.scrolling = "no", i && (a.allow = i), Object.assign(a.style, D, { height: r }), a;
|
|
420
377
|
}
|
|
421
|
-
function
|
|
422
|
-
let n =
|
|
423
|
-
src:
|
|
378
|
+
function k(e, t) {
|
|
379
|
+
let n = E(e), { renderToken: r, additionalFields: i = { cardholderName: !1 }, billingAddressRequirement: a = "country", ...o } = t, s = O({
|
|
380
|
+
src: x(r, i, a),
|
|
424
381
|
title: "Secure credit card payment method form powered by Amos",
|
|
425
382
|
name: "amos-credit-card-payment-method-form",
|
|
426
|
-
height:
|
|
383
|
+
height: C(i, a)
|
|
427
384
|
});
|
|
428
385
|
n.appendChild(s);
|
|
429
|
-
let c =
|
|
386
|
+
let c = T(s, {
|
|
430
387
|
...o,
|
|
431
388
|
onHeightChange: (e) => {
|
|
432
389
|
s.style.height = e, o.onHeightChange?.(e);
|
|
@@ -443,15 +400,15 @@ function N(e, t) {
|
|
|
443
400
|
}
|
|
444
401
|
};
|
|
445
402
|
}
|
|
446
|
-
function
|
|
447
|
-
let n =
|
|
448
|
-
src:
|
|
403
|
+
function A(e, t) {
|
|
404
|
+
let n = E(e), { renderToken: r, billingAddressRequirement: i = "country", ...a } = t, o = O({
|
|
405
|
+
src: S(r, i),
|
|
449
406
|
title: "Secure bank account payment method form powered by Amos",
|
|
450
407
|
name: "amos-bank-account-payment-method-form",
|
|
451
|
-
height:
|
|
408
|
+
height: w(i)
|
|
452
409
|
});
|
|
453
410
|
n.appendChild(o);
|
|
454
|
-
let s =
|
|
411
|
+
let s = T(o, {
|
|
455
412
|
...a,
|
|
456
413
|
onHeightChange: (e) => {
|
|
457
414
|
o.style.height = e, a.onHeightChange?.(e);
|
|
@@ -468,16 +425,16 @@ function P(e, t) {
|
|
|
468
425
|
}
|
|
469
426
|
};
|
|
470
427
|
}
|
|
471
|
-
function
|
|
472
|
-
let n =
|
|
473
|
-
src:
|
|
428
|
+
function j(e, t) {
|
|
429
|
+
let n = E(e), { renderToken: r, ...i } = t, a = O({
|
|
430
|
+
src: m(r),
|
|
474
431
|
title: "Secure Google Pay button powered by Amos",
|
|
475
432
|
name: "amos-google-pay-button",
|
|
476
|
-
height:
|
|
433
|
+
height: h(),
|
|
477
434
|
allow: "payment"
|
|
478
435
|
});
|
|
479
436
|
n.appendChild(a);
|
|
480
|
-
let o =
|
|
437
|
+
let o = g(a, {
|
|
481
438
|
...i,
|
|
482
439
|
onHeightChange: (e) => {
|
|
483
440
|
a.style.height = e, i.onHeightChange?.(e);
|
|
@@ -494,16 +451,16 @@ function F(e, t) {
|
|
|
494
451
|
}
|
|
495
452
|
};
|
|
496
453
|
}
|
|
497
|
-
function
|
|
498
|
-
let n =
|
|
499
|
-
src:
|
|
454
|
+
function M(e, t) {
|
|
455
|
+
let n = E(e), { renderToken: r, ...i } = t, a = O({
|
|
456
|
+
src: d(r),
|
|
500
457
|
title: "Secure Apple Pay button powered by Amos",
|
|
501
458
|
name: "amos-apple-pay-button",
|
|
502
|
-
height:
|
|
459
|
+
height: f(),
|
|
503
460
|
allow: "payment"
|
|
504
461
|
});
|
|
505
462
|
n.appendChild(a);
|
|
506
|
-
let o =
|
|
463
|
+
let o = p(a, {
|
|
507
464
|
...i,
|
|
508
465
|
onHeightChange: (e) => {
|
|
509
466
|
a.style.height = e, i.onHeightChange?.(e);
|
|
@@ -521,4 +478,4 @@ function I(e, t) {
|
|
|
521
478
|
};
|
|
522
479
|
}
|
|
523
480
|
//#endregion
|
|
524
|
-
export {
|
|
481
|
+
export { p as attachApplePayButtonListeners, g as attachGooglePayButtonListeners, T as attachPaymentMethodFormListeners, c as confirmPaymentIntent, l as confirmSetupIntent, n as createMessage, e as decodeJwt, _ as formatGooglePayPaymentData, f as getApplePayButtonInitialHeight, d as getApplePayButtonSrc, w as getBankAccountFormInitialHeight, S as getBankAccountFormSrc, C as getCreditCardFormInitialHeight, x as getCreditCardFormSrc, t as getEmbedOrigin, h as getGooglePayButtonInitialHeight, m as getGooglePayButtonSrc, M as mountAmosApplePayButton, A as mountAmosBankAccountPaymentMethodForm, k as mountAmosCreditCardPaymentMethodForm, j as mountAmosGooglePayButton, u as sendConfirmationFailed, r as sendParentReadyMessage, a as updateAmount, i as updateAppearance, o as updateMerchantName, s as validateForm };
|
package/dist/messaging.d.ts
CHANGED
|
@@ -34,19 +34,6 @@ export declare function updateMerchantName({ iframe, merchantName, }: {
|
|
|
34
34
|
iframe: Iframe;
|
|
35
35
|
merchantName: string;
|
|
36
36
|
}): void;
|
|
37
|
-
/**
|
|
38
|
-
* Whether the host page exposes a native `ApplePaySession` (Safari).
|
|
39
|
-
* Non-Safari browsers load Apple's SDK inside the embed iframe instead.
|
|
40
|
-
*/
|
|
41
|
-
export declare function hasNativeApplePaySession(): boolean;
|
|
42
|
-
/**
|
|
43
|
-
* Tell the Apple Pay iframe whether the parent has a native
|
|
44
|
-
* `ApplePaySession`. Sent during the `IFRAME_READY` handshake.
|
|
45
|
-
*/
|
|
46
|
-
export declare function updateNativeApplePaySession({ iframe, hasNativeApplePaySession, }: {
|
|
47
|
-
iframe: Iframe;
|
|
48
|
-
hasNativeApplePaySession: boolean;
|
|
49
|
-
}): void;
|
|
50
37
|
/**
|
|
51
38
|
* Ask the embedded credit-card or bank-account iframe form to validate
|
|
52
39
|
* its inputs.
|
package/dist/types.d.ts
CHANGED
|
@@ -42,14 +42,6 @@ export type Message = {
|
|
|
42
42
|
} | {
|
|
43
43
|
type: "UPDATE_MERCHANT_NAME";
|
|
44
44
|
merchantName: string;
|
|
45
|
-
} | {
|
|
46
|
-
/**
|
|
47
|
-
* Parent → iframe: whether the host page has a native
|
|
48
|
-
* `ApplePaySession` (Safari). When `false`, the iframe should
|
|
49
|
-
* expand for Chrome's in-iframe QR handoff UI.
|
|
50
|
-
*/
|
|
51
|
-
type: "UPDATE_NATIVE_APPLE_PAY_SESSION";
|
|
52
|
-
hasNativeApplePaySession: boolean;
|
|
53
45
|
} | {
|
|
54
46
|
type: "UPDATE_APPEARANCE";
|
|
55
47
|
appearance: Appearance;
|
|
@@ -76,16 +68,6 @@ export type Message = {
|
|
|
76
68
|
errorMessage: string;
|
|
77
69
|
} | {
|
|
78
70
|
type: "UPDATED_APPEARANCE";
|
|
79
|
-
} | {
|
|
80
|
-
/**
|
|
81
|
-
* Iframe → parent: expand the Apple Pay iframe to a full-viewport
|
|
82
|
-
* overlay so Chrome's QR handoff UI is not clipped by the button
|
|
83
|
-
* height. The Apple Pay session stays on the Amos embed origin.
|
|
84
|
-
*/
|
|
85
|
-
type: "EXPAND_IFRAME";
|
|
86
|
-
} | {
|
|
87
|
-
/** Iframe → parent: restore the Apple Pay iframe to its button size. */
|
|
88
|
-
type: "COLLAPSE_IFRAME";
|
|
89
71
|
};
|
|
90
72
|
/**
|
|
91
73
|
* Identity helper that brands an object as a typed `Message`.
|
package/package.json
CHANGED
package/src/apple-pay.ts
CHANGED
|
@@ -2,13 +2,11 @@ import type { components } from "@amos.com/node";
|
|
|
2
2
|
import { getEmbedOrigin } from "./jwt";
|
|
3
3
|
import {
|
|
4
4
|
confirmPaymentIntent,
|
|
5
|
-
hasNativeApplePaySession,
|
|
6
5
|
sendConfirmationFailed,
|
|
7
6
|
sendParentReadyMessage,
|
|
8
7
|
updateAmount as sendUpdateAmount,
|
|
9
8
|
updateAppearance as sendUpdateAppearance,
|
|
10
9
|
updateMerchantName as sendUpdateMerchantName,
|
|
11
|
-
updateNativeApplePaySession as sendUpdateNativeApplePaySession,
|
|
12
10
|
} from "./messaging";
|
|
13
11
|
import type { Appearance, Message } from "./types";
|
|
14
12
|
|
|
@@ -90,49 +88,6 @@ export type ApplePayButtonController = {
|
|
|
90
88
|
destroy: () => void;
|
|
91
89
|
};
|
|
92
90
|
|
|
93
|
-
type SavedIframeLayout = {
|
|
94
|
-
cssText: string;
|
|
95
|
-
bodyOverflow: string;
|
|
96
|
-
};
|
|
97
|
-
|
|
98
|
-
/**
|
|
99
|
-
* Expand the Apple Pay iframe to a full-viewport overlay so Chrome's QR
|
|
100
|
-
* handoff UI (rendered inside the iframe) is not clipped to the button
|
|
101
|
-
* height. Safari's native sheet is OS-level and unaffected.
|
|
102
|
-
*/
|
|
103
|
-
function expandApplePayIframe(iframe: HTMLIFrameElement): SavedIframeLayout {
|
|
104
|
-
const saved: SavedIframeLayout = {
|
|
105
|
-
cssText: iframe.style.cssText,
|
|
106
|
-
bodyOverflow: document.body.style.overflow,
|
|
107
|
-
};
|
|
108
|
-
document.body.style.overflow = "hidden";
|
|
109
|
-
Object.assign(iframe.style, {
|
|
110
|
-
position: "fixed",
|
|
111
|
-
inset: "0px",
|
|
112
|
-
width: "100vw",
|
|
113
|
-
height: "100vh",
|
|
114
|
-
maxWidth: "none",
|
|
115
|
-
maxHeight: "none",
|
|
116
|
-
margin: "0",
|
|
117
|
-
border: "0",
|
|
118
|
-
zIndex: "2147483647",
|
|
119
|
-
opacity: "1",
|
|
120
|
-
background: "#ffffff",
|
|
121
|
-
});
|
|
122
|
-
return saved;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
function collapseApplePayIframe(
|
|
126
|
-
iframe: HTMLIFrameElement,
|
|
127
|
-
saved: SavedIframeLayout | null,
|
|
128
|
-
): void {
|
|
129
|
-
if (!saved) {
|
|
130
|
-
return;
|
|
131
|
-
}
|
|
132
|
-
document.body.style.overflow = saved.bodyOverflow;
|
|
133
|
-
iframe.style.cssText = saved.cssText;
|
|
134
|
-
}
|
|
135
|
-
|
|
136
91
|
/**
|
|
137
92
|
* Wire up the host-page side of the Apple Pay iframe message protocol
|
|
138
93
|
* on an existing `<iframe>` element. Returns a controller for updating
|
|
@@ -143,15 +98,14 @@ function collapseApplePayIframe(
|
|
|
143
98
|
*
|
|
144
99
|
* The Apple Pay button and `ApplePaySession` run inside the Amos embed
|
|
145
100
|
* iframe (so only Amos domains need Apple merchant registration). On
|
|
146
|
-
*
|
|
147
|
-
*
|
|
101
|
+
* non-Safari browsers, the embed opens Apple's QR handoff in a popup
|
|
102
|
+
* (`pay.apple.com`) rather than expanding this iframe.
|
|
148
103
|
*/
|
|
149
104
|
export function attachApplePayButtonListeners(
|
|
150
105
|
iframe: HTMLIFrameElement,
|
|
151
106
|
options: ApplePayButtonListenerOptions,
|
|
152
107
|
): ApplePayButtonController {
|
|
153
108
|
let current = { ...options };
|
|
154
|
-
let savedLayout: SavedIframeLayout | null = null;
|
|
155
109
|
|
|
156
110
|
function pushAmount() {
|
|
157
111
|
sendUpdateAmount({ iframe, amount: current.amount });
|
|
@@ -161,13 +115,6 @@ export function attachApplePayButtonListeners(
|
|
|
161
115
|
sendUpdateMerchantName({ iframe, merchantName: current.merchantName });
|
|
162
116
|
}
|
|
163
117
|
|
|
164
|
-
function pushNativeApplePaySession() {
|
|
165
|
-
sendUpdateNativeApplePaySession({
|
|
166
|
-
iframe,
|
|
167
|
-
hasNativeApplePaySession: hasNativeApplePaySession(),
|
|
168
|
-
});
|
|
169
|
-
}
|
|
170
|
-
|
|
171
118
|
function handleMessage(event: MessageEvent<Message>) {
|
|
172
119
|
// Ignore messages from other frames / windows.
|
|
173
120
|
if (event.source !== iframe.contentWindow) {
|
|
@@ -178,16 +125,12 @@ export function attachApplePayButtonListeners(
|
|
|
178
125
|
case "IFRAME_READY":
|
|
179
126
|
sendParentReadyMessage(iframe);
|
|
180
127
|
sendUpdateAppearance({ iframe, appearance: current.appearance });
|
|
181
|
-
pushNativeApplePaySession();
|
|
182
128
|
pushAmount();
|
|
183
129
|
pushMerchantName();
|
|
184
130
|
break;
|
|
185
131
|
|
|
186
132
|
case "UPDATE_HEIGHT":
|
|
187
|
-
|
|
188
|
-
if (!savedLayout) {
|
|
189
|
-
current.onHeightChange?.(event.data.height);
|
|
190
|
-
}
|
|
133
|
+
current.onHeightChange?.(event.data.height);
|
|
191
134
|
break;
|
|
192
135
|
|
|
193
136
|
case "UPDATE_APPEARANCE":
|
|
@@ -198,17 +141,6 @@ export function attachApplePayButtonListeners(
|
|
|
198
141
|
current.onAppearanceReady?.();
|
|
199
142
|
break;
|
|
200
143
|
|
|
201
|
-
case "EXPAND_IFRAME":
|
|
202
|
-
if (!savedLayout) {
|
|
203
|
-
savedLayout = expandApplePayIframe(iframe);
|
|
204
|
-
}
|
|
205
|
-
break;
|
|
206
|
-
|
|
207
|
-
case "COLLAPSE_IFRAME":
|
|
208
|
-
collapseApplePayIframe(iframe, savedLayout);
|
|
209
|
-
savedLayout = null;
|
|
210
|
-
break;
|
|
211
|
-
|
|
212
144
|
case "CREATE_PAYMENT_INTENT":
|
|
213
145
|
current
|
|
214
146
|
.onInitiatePaymentIntentRequest({
|
|
@@ -258,8 +190,6 @@ export function attachApplePayButtonListeners(
|
|
|
258
190
|
},
|
|
259
191
|
destroy() {
|
|
260
192
|
window.removeEventListener("message", handleMessage);
|
|
261
|
-
collapseApplePayIframe(iframe, savedLayout);
|
|
262
|
-
savedLayout = null;
|
|
263
193
|
},
|
|
264
194
|
};
|
|
265
195
|
}
|
package/src/index.ts
CHANGED
|
@@ -27,13 +27,11 @@ export { decodeJwt, getEmbedOrigin } from "./jwt";
|
|
|
27
27
|
export {
|
|
28
28
|
confirmPaymentIntent,
|
|
29
29
|
confirmSetupIntent,
|
|
30
|
-
hasNativeApplePaySession,
|
|
31
30
|
sendConfirmationFailed,
|
|
32
31
|
sendParentReadyMessage,
|
|
33
32
|
updateAmount,
|
|
34
33
|
updateAppearance,
|
|
35
34
|
updateMerchantName,
|
|
36
|
-
updateNativeApplePaySession,
|
|
37
35
|
validateForm,
|
|
38
36
|
} from "./messaging";
|
|
39
37
|
export type {
|
package/src/messaging.ts
CHANGED
|
@@ -70,34 +70,6 @@ export function updateMerchantName({
|
|
|
70
70
|
);
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
-
/**
|
|
74
|
-
* Whether the host page exposes a native `ApplePaySession` (Safari).
|
|
75
|
-
* Non-Safari browsers load Apple's SDK inside the embed iframe instead.
|
|
76
|
-
*/
|
|
77
|
-
export function hasNativeApplePaySession(): boolean {
|
|
78
|
-
return "ApplePaySession" in globalThis;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
/**
|
|
82
|
-
* Tell the Apple Pay iframe whether the parent has a native
|
|
83
|
-
* `ApplePaySession`. Sent during the `IFRAME_READY` handshake.
|
|
84
|
-
*/
|
|
85
|
-
export function updateNativeApplePaySession({
|
|
86
|
-
iframe,
|
|
87
|
-
hasNativeApplePaySession,
|
|
88
|
-
}: {
|
|
89
|
-
iframe: Iframe;
|
|
90
|
-
hasNativeApplePaySession: boolean;
|
|
91
|
-
}): void {
|
|
92
|
-
iframe?.contentWindow?.postMessage(
|
|
93
|
-
createMessage({
|
|
94
|
-
type: "UPDATE_NATIVE_APPLE_PAY_SESSION",
|
|
95
|
-
hasNativeApplePaySession,
|
|
96
|
-
}),
|
|
97
|
-
"*",
|
|
98
|
-
);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
73
|
/**
|
|
102
74
|
* Ask the embedded credit-card or bank-account iframe form to validate
|
|
103
75
|
* its inputs.
|
package/src/types.ts
CHANGED
|
@@ -155,15 +155,6 @@ export type Message =
|
|
|
155
155
|
type: "UPDATE_MERCHANT_NAME";
|
|
156
156
|
merchantName: string;
|
|
157
157
|
}
|
|
158
|
-
| {
|
|
159
|
-
/**
|
|
160
|
-
* Parent → iframe: whether the host page has a native
|
|
161
|
-
* `ApplePaySession` (Safari). When `false`, the iframe should
|
|
162
|
-
* expand for Chrome's in-iframe QR handoff UI.
|
|
163
|
-
*/
|
|
164
|
-
type: "UPDATE_NATIVE_APPLE_PAY_SESSION";
|
|
165
|
-
hasNativeApplePaySession: boolean;
|
|
166
|
-
}
|
|
167
158
|
| {
|
|
168
159
|
type: "UPDATE_APPEARANCE";
|
|
169
160
|
appearance: Appearance;
|
|
@@ -200,18 +191,6 @@ export type Message =
|
|
|
200
191
|
}
|
|
201
192
|
| {
|
|
202
193
|
type: "UPDATED_APPEARANCE";
|
|
203
|
-
}
|
|
204
|
-
| {
|
|
205
|
-
/**
|
|
206
|
-
* Iframe → parent: expand the Apple Pay iframe to a full-viewport
|
|
207
|
-
* overlay so Chrome's QR handoff UI is not clipped by the button
|
|
208
|
-
* height. The Apple Pay session stays on the Amos embed origin.
|
|
209
|
-
*/
|
|
210
|
-
type: "EXPAND_IFRAME";
|
|
211
|
-
}
|
|
212
|
-
| {
|
|
213
|
-
/** Iframe → parent: restore the Apple Pay iframe to its button size. */
|
|
214
|
-
type: "COLLAPSE_IFRAME";
|
|
215
194
|
};
|
|
216
195
|
|
|
217
196
|
/**
|