@amos.com/amos-js 0.6.0 → 0.6.1

package/dist/index.d.ts

@@ -4,7 +4,7 @@ export { attachApplePayButtonListeners, getApplePayButtonInitialHeight, getApple
 export type { FormattedGooglePayPaymentData, GooglePayButtonController, GooglePayButtonListenerOptions, } from './google-pay';
 export { attachGooglePayButtonListeners, formatGooglePayPaymentData, getGooglePayButtonInitialHeight, getGooglePayButtonSrc, } from './google-pay';
 export { decodeJwt, getEmbedOrigin } from './jwt';
-export { confirmPaymentIntent, confirmSetupIntent, sendConfirmationFailed, sendParentReadyMessage, updateAmount, updateAppearance, updateMerchantName, validateForm, } from './messaging';
+export { confirmPaymentIntent, confirmSetupIntent, hasNativeApplePaySession, sendConfirmationFailed, sendParentReadyMessage, updateAmount, updateAppearance, updateMerchantName, updateNativeApplePaySession, validateForm, } from './messaging';
 export type { AmosApplePayButtonMountController, AmosApplePayButtonOptions, AmosBankAccountPaymentMethodFormOptions, AmosCreditCardPaymentMethodFormOptions, AmosGooglePayButtonMountController, AmosGooglePayButtonOptions, AmosPaymentMethodFormMountController, } from './mount';
 export { mountAmosApplePayButton, mountAmosBankAccountPaymentMethodForm, mountAmosCreditCardPaymentMethodForm, mountAmosGooglePayButton, } from './mount';
 export type { BillingAddressRequirement, CreditCardAdditionalFields, PaymentMethodFormController, PaymentMethodFormListenerOptions, } from './payment-method-form';

package/dist/index.js

@@ -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({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){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 m(e,t){t&&(document.body.style.overflow=t.bodyOverflow,e.style.cssText=t.cssText)}function h(e,t){let n={...t},s=null;function l(){a({iframe:e,amount:n.amount})}function d(){o({iframe:e,merchantName:n.merchantName})}function f(t){if(t.source===e.contentWindow)switch(t.data.type){case`IFRAME_READY`:r(e),i({iframe:e,appearance:n.appearance}),l(),d();break;case`UPDATE_HEIGHT`:s||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`:s||=p(e);break;case`COLLAPSE_IFRAME`:m(e,s),s=null;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`,f),{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&&l(),o&&d()},destroy(){window.removeEventListener(`message`,f),m(e,s),s=null}}}function g(e){return`${t(e)}/iframe/google-pay?token=${e}`}function _(){return`40px`}function v(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 y({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 b={country:212,full:452},x=80,S={country:400,full:640};function C(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 w(e,n=`country`){let r=new URLSearchParams({token:e,billingAddressRequirement:n});return`${t(e)}/iframe/bank?${r}`}function T(e={cardholderName:!1},t=`country`){return`${(b[t]??b.country)+(e.cardholderName?x:0)}px`}function E(e=`country`){return`${S[e]??S.country}px`}function D(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 O(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 k={width:`calc(100% + 8px)`,transition:`opacity 150ms ease-in, height 200ms ease-in-out`,margin:`0 -4px`,opacity:`0`,border:`0`};function A({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,k,{height:r}),a}function j(e,t){let n=O(e),{renderToken:r,additionalFields:i={cardholderName:!1},billingAddressRequirement:a=`country`,...o}=t,s=A({src:C(r,i,a),title:`Secure credit card payment method form powered by Amos`,name:`amos-credit-card-payment-method-form`,height:T(i,a)});n.appendChild(s);let c=D(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 M(e,t){let n=O(e),{renderToken:r,billingAddressRequirement:i=`country`,...a}=t,o=A({src:w(r,i),title:`Secure bank account payment method form powered by Amos`,name:`amos-bank-account-payment-method-form`,height:E(i)});n.appendChild(o);let s=D(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 N(e,t){let n=O(e),{renderToken:r,...i}=t,a=A({src:g(r),title:`Secure Google Pay button powered by Amos`,name:`amos-google-pay-button`,height:_(),allow:`payment`});n.appendChild(a);let o=v(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 P(e,t){let n=O(e),{renderToken:r,...i}=t,a=A({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=h(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=h,exports.attachGooglePayButtonListeners=v,exports.attachPaymentMethodFormListeners=D,exports.confirmPaymentIntent=c,exports.confirmSetupIntent=l,exports.createMessage=n,exports.decodeJwt=e,exports.formatGooglePayPaymentData=y,exports.getApplePayButtonInitialHeight=f,exports.getApplePayButtonSrc=d,exports.getBankAccountFormInitialHeight=E,exports.getBankAccountFormSrc=w,exports.getCreditCardFormInitialHeight=T,exports.getCreditCardFormSrc=C,exports.getEmbedOrigin=t,exports.getGooglePayButtonInitialHeight=_,exports.getGooglePayButtonSrc=g,exports.mountAmosApplePayButton=P,exports.mountAmosBankAccountPaymentMethodForm=M,exports.mountAmosCreditCardPaymentMethodForm=j,exports.mountAmosGooglePayButton=N,exports.sendConfirmationFailed=u,exports.sendParentReadyMessage=r,exports.updateAmount=a,exports.updateAppearance=i,exports.updateMerchantName=o,exports.validateForm=s;
+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;

package/dist/index.mjs

@@ -43,7 +43,16 @@ function o({ iframe: e, merchantName: t }) {
 		merchantName: t
 	}), "*");
 }
-function s({ iframe: e }) {
+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({
@@ -59,7 +68,7 @@ function s({ iframe: e }) {
 		window.addEventListener("message", a);
 	});
 }
-function c({ iframe: t, token: r }) {
+function u({ iframe: t, token: r }) {
 	let { payment_intent_id: i } = e(r).payload;
 	t?.contentWindow?.postMessage(n({
 		type: "CONFIRM_PAYMENT_INTENT",
@@ -67,7 +76,7 @@ function c({ iframe: t, token: r }) {
 		id: i ?? void 0
 	}), "*");
 }
-function l({ iframe: t, token: r }) {
+function d({ iframe: t, token: r }) {
 	let { setup_intent_id: i } = e(r).payload;
 	t?.contentWindow?.postMessage(n({
 		type: "CONFIRM_SETUP_INTENT",
@@ -75,7 +84,7 @@ function l({ iframe: t, token: r }) {
 		id: i ?? void 0
 	}), "*");
 }
-function u({ iframe: e, errorMessage: t }) {
+function f({ iframe: e, errorMessage: t }) {
 	e?.contentWindow?.postMessage(n({
 		type: "CONFIRMATION_FAILED",
 		errorMessage: t
@@ -83,13 +92,13 @@ function u({ iframe: e, errorMessage: t }) {
 }
 //#endregion
 //#region src/apple-pay.ts
-function d(e) {
+function p(e) {
 	return `${t(e)}/iframe/apple-pay?token=${e}`;
 }
-function f() {
+function m() {
 	return "40px";
 }
-function p(e) {
+function h(e) {
 	let t = {
 		cssText: e.style.cssText,
 		bodyOverflow: document.body.style.overflow
@@ -108,33 +117,39 @@ function p(e) {
 		background: "#ffffff"
 	}), t;
 }
-function m(e, t) {
+function g(e, t) {
 	t && (document.body.style.overflow = t.bodyOverflow, e.style.cssText = t.cssText);
 }
-function h(e, t) {
-	let n = { ...t }, s = null;
-	function l() {
+function _(e, t) {
+	let n = { ...t }, l = null;
+	function d() {
 		a({
 			iframe: e,
 			amount: n.amount
 		});
 	}
-	function d() {
+	function p() {
 		o({
 			iframe: e,
 			merchantName: n.merchantName
 		});
 	}
-	function f(t) {
+	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
-				}), l(), d();
+				}), m(), d(), p();
 				break;
 			case "UPDATE_HEIGHT":
-				s || n.onHeightChange?.(t.data.height);
+				l || n.onHeightChange?.(t.data.height);
 				break;
 			case "UPDATE_APPEARANCE":
 				i({
@@ -146,22 +161,22 @@ function h(e, t) {
 				n.onAppearanceReady?.();
 				break;
 			case "EXPAND_IFRAME":
-				s ||= p(e);
+				l ||= h(e);
 				break;
 			case "COLLAPSE_IFRAME":
-				m(e, s), s = null;
+				g(e, l), l = null;
 				break;
 			case "CREATE_PAYMENT_INTENT":
 				n.onInitiatePaymentIntentRequest({
 					paymentIntentCreateAttributes: t.data.paymentIntentCreateAttributes,
 					customerCreateAttributes: t.data.customerCreateAttributes
 				}).then((t) => {
-					c({
+					u({
 						iframe: e,
 						token: t
 					});
 				}).catch((t) => {
-					u({
+					f({
 						iframe: e,
 						errorMessage: t instanceof Error ? t.message : "Unknown error"
 					});
@@ -175,7 +190,7 @@ function h(e, t) {
 				break;
 		}
 	}
-	return window.addEventListener("message", f), {
+	return window.addEventListener("message", _), {
 		update(t) {
 			let r = "appearance" in t, a = "amount" in t, o = "merchantName" in t;
 			n = {
@@ -184,22 +199,22 @@ function h(e, t) {
 			}, r && i({
 				iframe: e,
 				appearance: n.appearance
-			}), a && l(), o && d();
+			}), a && d(), o && p();
 		},
 		destroy() {
-			window.removeEventListener("message", f), m(e, s), s = null;
+			window.removeEventListener("message", _), g(e, l), l = null;
 		}
 	};
 }
 //#endregion
 //#region src/google-pay.ts
-function g(e) {
+function v(e) {
 	return `${t(e)}/iframe/google-pay?token=${e}`;
 }
-function _() {
+function y() {
 	return "40px";
 }
-function v(e, t) {
+function b(e, t) {
 	let n = { ...t };
 	function s() {
 		a({
@@ -207,19 +222,19 @@ function v(e, t) {
 			amount: n.amount
 		});
 	}
-	function l() {
+	function c() {
 		o({
 			iframe: e,
 			merchantName: n.merchantName
 		});
 	}
-	function d(t) {
+	function l(t) {
 		switch (t.data.type) {
 			case "IFRAME_READY":
 				r(e), i({
 					iframe: e,
 					appearance: n.appearance
-				}), s(), l();
+				}), s(), c();
 				break;
 			case "UPDATE_HEIGHT":
 				n.onHeightChange?.(t.data.height);
@@ -238,12 +253,12 @@ function v(e, t) {
 					paymentIntentCreateAttributes: t.data.paymentIntentCreateAttributes,
 					customerCreateAttributes: t.data.customerCreateAttributes
 				}).then((t) => {
-					c({
+					u({
 						iframe: e,
 						token: t
 					});
 				}).catch((t) => {
-					u({
+					f({
 						iframe: e,
 						errorMessage: t instanceof Error ? t.message : "Unknown error"
 					});
@@ -257,7 +272,7 @@ function v(e, t) {
 				break;
 		}
 	}
-	return window.addEventListener("message", d), {
+	return window.addEventListener("message", l), {
 		update(t) {
 			let r = "appearance" in t, a = "amount" in t, o = "merchantName" in t;
 			n = {
@@ -266,14 +281,14 @@ function v(e, t) {
 			}, r && i({
 				iframe: e,
 				appearance: n.appearance
-			}), a && s(), o && l();
+			}), a && s(), o && c();
 		},
 		destroy() {
-			window.removeEventListener("message", d);
+			window.removeEventListener("message", l);
 		}
 	};
 }
-function y({ paymentData: e }) {
+function x({ paymentData: e }) {
 	return { paymentMethod: {
 		type: "googlepay",
 		billing_address_attributes: {
@@ -305,14 +320,14 @@ function y({ paymentData: e }) {
 }
 //#endregion
 //#region src/payment-method-form.ts
-var b = {
+var S = {
 	country: 212,
 	full: 452
-}, x = 80, S = {
+}, C = 80, w = {
 	country: 400,
 	full: 640
 };
-function C(e, n = { cardholderName: !1 }, r = "country") {
+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,
@@ -320,20 +335,20 @@ function C(e, n = { cardholderName: !1 }, r = "country") {
 	});
 	return `${t(e)}/iframe/card?${a}`;
 }
-function w(e, n = "country") {
+function E(e, n = "country") {
 	let r = new URLSearchParams({
 		token: e,
 		billingAddressRequirement: n
 	});
 	return `${t(e)}/iframe/bank?${r}`;
 }
-function T(e = { cardholderName: !1 }, t = "country") {
-	return `${(b[t] ?? b.country) + (e.cardholderName ? x : 0)}px`;
+function D(e = { cardholderName: !1 }, t = "country") {
+	return `${(S[t] ?? S.country) + (e.cardholderName ? C : 0)}px`;
 }
-function E(e = "country") {
-	return `${S[e] ?? S.country}px`;
+function O(e = "country") {
+	return `${w[e] ?? w.country}px`;
 }
-function D(e, t) {
+function k(e, t) {
 	let n = { ...t };
 	function a(t) {
 		switch (t.data.type) {
@@ -384,7 +399,7 @@ function D(e, t) {
 }
 //#endregion
 //#region src/mount.ts
-function O(e) {
+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.`);
@@ -392,26 +407,26 @@ function O(e) {
 	}
 	return e;
 }
-var k = {
+var j = {
 	width: "calc(100% + 8px)",
 	transition: "opacity 150ms ease-in, height 200ms ease-in-out",
 	margin: "0 -4px",
 	opacity: "0",
 	border: "0"
 };
-function A({ src: e, title: t, name: n, height: r, allow: i }) {
+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, k, { height: r }), a;
+	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 j(e, t) {
-	let n = O(e), { renderToken: r, additionalFields: i = { cardholderName: !1 }, billingAddressRequirement: a = "country", ...o } = t, s = A({
-		src: C(r, i, 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: T(i, a)
+		height: D(i, a)
 	});
 	n.appendChild(s);
-	let c = D(s, {
+	let c = k(s, {
 		...o,
 		onHeightChange: (e) => {
 			s.style.height = e, o.onHeightChange?.(e);
@@ -428,15 +443,15 @@ function j(e, t) {
 		}
 	};
 }
-function M(e, t) {
-	let n = O(e), { renderToken: r, billingAddressRequirement: i = "country", ...a } = t, o = A({
-		src: w(r, i),
+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: E(i)
+		height: O(i)
 	});
 	n.appendChild(o);
-	let s = D(o, {
+	let s = k(o, {
 		...a,
 		onHeightChange: (e) => {
 			o.style.height = e, a.onHeightChange?.(e);
@@ -453,16 +468,16 @@ function M(e, t) {
 		}
 	};
 }
-function N(e, t) {
-	let n = O(e), { renderToken: r, ...i } = t, a = A({
-		src: g(r),
+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: _(),
+		height: y(),
 		allow: "payment"
 	});
 	n.appendChild(a);
-	let o = v(a, {
+	let o = b(a, {
 		...i,
 		onHeightChange: (e) => {
 			a.style.height = e, i.onHeightChange?.(e);
@@ -479,16 +494,16 @@ function N(e, t) {
 		}
 	};
 }
-function P(e, t) {
-	let n = O(e), { renderToken: r, ...i } = t, a = A({
-		src: d(r),
+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: f(),
+		height: m(),
 		allow: "payment"
 	});
 	n.appendChild(a);
-	let o = h(a, {
+	let o = _(a, {
 		...i,
 		onHeightChange: (e) => {
 			a.style.height = e, i.onHeightChange?.(e);
@@ -506,4 +521,4 @@ function P(e, t) {
 	};
 }
 //#endregion
-export { h as attachApplePayButtonListeners, v as attachGooglePayButtonListeners, D as attachPaymentMethodFormListeners, c as confirmPaymentIntent, l as confirmSetupIntent, n as createMessage, e as decodeJwt, y as formatGooglePayPaymentData, f as getApplePayButtonInitialHeight, d as getApplePayButtonSrc, E as getBankAccountFormInitialHeight, w as getBankAccountFormSrc, T as getCreditCardFormInitialHeight, C as getCreditCardFormSrc, t as getEmbedOrigin, _ as getGooglePayButtonInitialHeight, g as getGooglePayButtonSrc, P as mountAmosApplePayButton, M as mountAmosBankAccountPaymentMethodForm, j as mountAmosCreditCardPaymentMethodForm, N as mountAmosGooglePayButton, u as sendConfirmationFailed, r as sendParentReadyMessage, a as updateAmount, i as updateAppearance, o as updateMerchantName, s as validateForm };
+export { _ as attachApplePayButtonListeners, b as attachGooglePayButtonListeners, k as attachPaymentMethodFormListeners, u as confirmPaymentIntent, d as confirmSetupIntent, n as createMessage, e as decodeJwt, x as formatGooglePayPaymentData, m as getApplePayButtonInitialHeight, p as getApplePayButtonSrc, O as getBankAccountFormInitialHeight, E as getBankAccountFormSrc, D as getCreditCardFormInitialHeight, T as getCreditCardFormSrc, t as getEmbedOrigin, y as getGooglePayButtonInitialHeight, v as getGooglePayButtonSrc, s as hasNativeApplePaySession, I as mountAmosApplePayButton, P as mountAmosBankAccountPaymentMethodForm, N as mountAmosCreditCardPaymentMethodForm, F as mountAmosGooglePayButton, f as sendConfirmationFailed, r as sendParentReadyMessage, a as updateAmount, i as updateAppearance, o as updateMerchantName, c as updateNativeApplePaySession, l as validateForm };

package/dist/messaging.d.ts

@@ -34,6 +34,19 @@ export declare function updateMerchantName({ iframe, merchantName, }: {
     iframe: Iframe;
     merchantName: string;
 }): void;
+/**
+ * Whether the host page exposes a native `ApplePaySession` (Safari).
+ * Non-Safari browsers load Apple's SDK inside the embed iframe instead.
+ */
+export declare function hasNativeApplePaySession(): boolean;
+/**
+ * Tell the Apple Pay iframe whether the parent has a native
+ * `ApplePaySession`. Sent during the `IFRAME_READY` handshake.
+ */
+export declare function updateNativeApplePaySession({ iframe, hasNativeApplePaySession, }: {
+    iframe: Iframe;
+    hasNativeApplePaySession: boolean;
+}): void;
 /**
  * Ask the embedded credit-card or bank-account iframe form to validate
  * its inputs.

package/dist/types.d.ts

@@ -42,6 +42,14 @@ export type Message = {
 } | {
     type: "UPDATE_MERCHANT_NAME";
     merchantName: string;
+} | {
+    /**
+     * Parent → iframe: whether the host page has a native
+     * `ApplePaySession` (Safari). When `false`, the iframe should
+     * expand for Chrome's in-iframe QR handoff UI.
+     */
+    type: "UPDATE_NATIVE_APPLE_PAY_SESSION";
+    hasNativeApplePaySession: boolean;
 } | {
     type: "UPDATE_APPEARANCE";
     appearance: Appearance;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amos.com/amos-js",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "main": "dist/index.js",
   "repository": {
     "type": "git",
@@ -44,7 +44,7 @@
     "vite-plugin-dts": "5.0.3"
   },
   "dependencies": {
-    "@amos.com/node": "0.1.31",
+    "@amos.com/node": "0.1.32",
     "@types/googlepay": "0.7.11"
   }
 }

package/src/apple-pay.ts

@@ -2,11 +2,13 @@ import type { components } from "@amos.com/node";
 import { getEmbedOrigin } from "./jwt";
 import {
   confirmPaymentIntent,
+  hasNativeApplePaySession,
   sendConfirmationFailed,
   sendParentReadyMessage,
   updateAmount as sendUpdateAmount,
   updateAppearance as sendUpdateAppearance,
   updateMerchantName as sendUpdateMerchantName,
+  updateNativeApplePaySession as sendUpdateNativeApplePaySession,
 } from "./messaging";
 import type { Appearance, Message } from "./types";
 
@@ -159,6 +161,13 @@ export function attachApplePayButtonListeners(
     sendUpdateMerchantName({ iframe, merchantName: current.merchantName });
   }
 
+  function pushNativeApplePaySession() {
+    sendUpdateNativeApplePaySession({
+      iframe,
+      hasNativeApplePaySession: hasNativeApplePaySession(),
+    });
+  }
+
   function handleMessage(event: MessageEvent<Message>) {
     // Ignore messages from other frames / windows.
     if (event.source !== iframe.contentWindow) {
@@ -169,6 +178,7 @@ export function attachApplePayButtonListeners(
       case "IFRAME_READY":
         sendParentReadyMessage(iframe);
         sendUpdateAppearance({ iframe, appearance: current.appearance });
+        pushNativeApplePaySession();
         pushAmount();
         pushMerchantName();
         break;

package/src/index.ts

@@ -27,11 +27,13 @@ export { decodeJwt, getEmbedOrigin } from "./jwt";
 export {
   confirmPaymentIntent,
   confirmSetupIntent,
+  hasNativeApplePaySession,
   sendConfirmationFailed,
   sendParentReadyMessage,
   updateAmount,
   updateAppearance,
   updateMerchantName,
+  updateNativeApplePaySession,
   validateForm,
 } from "./messaging";
 export type {

package/src/messaging.ts

@@ -70,6 +70,34 @@ export function updateMerchantName({
   );
 }
 
+/**
+ * Whether the host page exposes a native `ApplePaySession` (Safari).
+ * Non-Safari browsers load Apple's SDK inside the embed iframe instead.
+ */
+export function hasNativeApplePaySession(): boolean {
+  return "ApplePaySession" in globalThis;
+}
+
+/**
+ * Tell the Apple Pay iframe whether the parent has a native
+ * `ApplePaySession`. Sent during the `IFRAME_READY` handshake.
+ */
+export function updateNativeApplePaySession({
+  iframe,
+  hasNativeApplePaySession,
+}: {
+  iframe: Iframe;
+  hasNativeApplePaySession: boolean;
+}): void {
+  iframe?.contentWindow?.postMessage(
+    createMessage({
+      type: "UPDATE_NATIVE_APPLE_PAY_SESSION",
+      hasNativeApplePaySession,
+    }),
+    "*",
+  );
+}
+
 /**
  * Ask the embedded credit-card or bank-account iframe form to validate
  * its inputs.

package/src/types.ts

@@ -155,6 +155,15 @@ export type Message =
       type: "UPDATE_MERCHANT_NAME";
       merchantName: string;
     }
+  | {
+      /**
+       * Parent → iframe: whether the host page has a native
+       * `ApplePaySession` (Safari). When `false`, the iframe should
+       * expand for Chrome's in-iframe QR handoff UI.
+       */
+      type: "UPDATE_NATIVE_APPLE_PAY_SESSION";
+      hasNativeApplePaySession: boolean;
+    }
   | {
       type: "UPDATE_APPEARANCE";
       appearance: Appearance;