@moonpay/platform-sdk-react-native 1.15.2 → 1.17.0

package/dist/index.js

@@ -51,6 +51,11 @@ var applePaySpec = {
           kind: "challenge",
           payload: msg.payload
         };
+      case "cancelled":
+        return {
+          kind: "cancelled",
+          payload: msg.payload
+        };
       case "error": {
         const payload = msg.payload;
         if (payload.code === "quoteExpired") {
@@ -95,6 +100,11 @@ var googlePaySpec = {
           kind: "challenge",
           payload: msg.payload
         };
+      case "cancelled":
+        return {
+          kind: "cancelled",
+          payload: msg.payload
+        };
       case "error": {
         const payload = msg.payload;
         if (payload.code === "quoteExpired") {
@@ -452,7 +462,13 @@ import { useEffect, useRef } from "react";
 import { View } from "react-native";
 import WebView from "react-native-webview";
 import { jsx } from "react/jsx-runtime";
-function MoonPayFrame({ transport, hidden, style }) {
+var DEFAULT_ORIGIN_WHITELIST = ["https://*", "http://*", "about:srcdoc"];
+function MoonPayFrame({
+  transport,
+  hidden,
+  style,
+  webViewProps
+}) {
   const webViewRef = useRef(null);
   useEffect(() => {
     transport.attachWebView(webViewRef);
@@ -468,13 +484,15 @@ function MoonPayFrame({ transport, hidden, style }) {
   return /* @__PURE__ */ jsx(View, { style: containerStyle, children: /* @__PURE__ */ jsx(
     WebView,
     {
-      ref: webViewRef,
-      source: { uri: url },
-      onMessage: handleMessage,
+      originWhitelist: DEFAULT_ORIGIN_WHITELIST,
       allowsInlineMediaPlayback: true,
       javaScriptEnabled: true,
       domStorageEnabled: true,
-      style: { flex: 1 }
+      style: { flex: 1 },
+      ...webViewProps,
+      ref: webViewRef,
+      source: { uri: url },
+      onMessage: handleMessage
     }
   ) });
 }
@@ -484,7 +502,8 @@ import {
   applyThemeParam,
   buildFrameUrl,
   createFrameOrchestrator,
-  generateKeyPair
+  generateKeyPair,
+  isSecureRandomAvailable
 } from "@moonpay/platform-sdk-core";
 
 // src/webview-transport.ts
@@ -547,6 +566,7 @@ var WebViewTransport = class {
 };
 
 // src/frame-engine.ts
+var CRYPTO_UNAVAILABLE_MESSAGE = "MoonPay SDK: crypto.getRandomValues is unavailable. React Native (Hermes) has no Web Crypto. Install and register a Web Crypto getRandomValues polyfill on the global before using the SDK \u2014 Expo: expo-crypto; bare React Native: react-native-get-random-values. See https://dev.moonpay.com/platform/sdk-reference/react-native/overview.";
 var FrameSessionDisposedError = class extends Error {
   constructor() {
     super("Frame session disposed");
@@ -556,7 +576,11 @@ var FrameSessionDisposedError = class extends Error {
 function createFrameSession(spec, ctx, props, overrides = {}) {
   const generated = `${spec.channelPrefix}-${Date.now()}`;
   const channelId = spec.resolveChannelId ? spec.resolveChannelId(props, generated) : generated;
-  const keyPair = spec.needsKeyPair ? generateKeyPair() : void 0;
+  let keyPair;
+  if (spec.needsKeyPair) {
+    if (!isSecureRandomAvailable()) throw new Error(CRYPTO_UNAVAILABLE_MESSAGE);
+    keyPair = generateKeyPair();
+  }
   const builtUrl = spec.buildUrl ? spec.buildUrl(ctx, props, channelId, keyPair?.publicKey) : buildFrameUrl(
     spec.path,
     { ...spec.buildParams?.(ctx, props, keyPair?.publicKey), channelId },
@@ -1306,7 +1330,8 @@ function MoonPayFrameView({
   props,
   style,
   defaultStyle,
-  onEvent
+  onEvent,
+  webViewProps
 }) {
   const { sessionToken, core, frameBaseUrl, theme } = useMoonPayContext();
   const [transport, setTransport] = useState3(null);
@@ -1374,15 +1399,15 @@ function MoonPayFrameView({
     applyReactiveProps(spec, reactiveKeys, propsRef.current, appliedRef.current, handle);
   }, [liveKey]);
   if (spec.hidden) {
-    return transport ? /* @__PURE__ */ jsx4(MoonPayFrame, { transport, hidden: true }) : null;
+    return transport ? /* @__PURE__ */ jsx4(MoonPayFrame, { transport, hidden: true, webViewProps }) : null;
   }
   const resolvedStyle = { ...defaultStyle, ...style };
-  return /* @__PURE__ */ jsx4(View3, { style: resolvedStyle, children: transport ? /* @__PURE__ */ jsx4(MoonPayFrame, { transport }) : null });
+  return /* @__PURE__ */ jsx4(View3, { style: resolvedStyle, children: transport ? /* @__PURE__ */ jsx4(MoonPayFrame, { transport, webViewProps }) : null });
 }
 
 // src/components/add-card.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
-function MoonPayAddCard({ onEvent, style }) {
+function MoonPayAddCard({ onEvent, style, webViewProps }) {
   return /* @__PURE__ */ jsx5(
     MoonPayFrameView,
     {
@@ -1390,7 +1415,8 @@ function MoonPayAddCard({ onEvent, style }) {
       props: {},
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1401,7 +1427,8 @@ function MoonPayApplePayButton({
   quote,
   externalTransactionId,
   onEvent,
-  style
+  style,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx6(
     MoonPayFrameView,
@@ -1410,14 +1437,15 @@ function MoonPayApplePayButton({
       props: { quote, externalTransactionId },
       style,
       defaultStyle: { height: 48 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
 
 // src/components/auth.tsx
 import { jsx as jsx7 } from "react/jsx-runtime";
-function MoonPayAuth({ onEvent, style }) {
+function MoonPayAuth({ onEvent, style, webViewProps }) {
   return /* @__PURE__ */ jsx7(
     MoonPayFrameView,
     {
@@ -1425,7 +1453,8 @@ function MoonPayAuth({ onEvent, style }) {
       props: {},
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1436,7 +1465,8 @@ function MoonPayBuyButton({
   quote,
   externalTransactionId,
   onEvent,
-  style
+  style,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx8(
     MoonPayFrameView,
@@ -1445,7 +1475,8 @@ function MoonPayBuyButton({
       props: { quote, externalTransactionId },
       style,
       defaultStyle: { height: 48 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1455,7 +1486,8 @@ import { jsx as jsx9 } from "react/jsx-runtime";
 function MoonPayBuyFrame({
   quote,
   externalTransactionId,
-  onEvent
+  onEvent,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx9(
     MoonPayFrameView,
@@ -1463,14 +1495,20 @@ function MoonPayBuyFrame({
       spec: buySpec,
       props: { quote, externalTransactionId },
       defaultStyle: {},
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
 
 // src/components/challenge.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
-function MoonPayChallenge({ url, onEvent, style }) {
+function MoonPayChallenge({
+  url,
+  onEvent,
+  style,
+  webViewProps
+}) {
   return /* @__PURE__ */ jsx10(
     MoonPayFrameView,
     {
@@ -1478,14 +1516,20 @@ function MoonPayChallenge({ url, onEvent, style }) {
       props: { url },
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
 
 // src/components/connect.tsx
 import { jsx as jsx11 } from "react/jsx-runtime";
-function MoonPayConnect({ theme, onEvent, style }) {
+function MoonPayConnect({
+  theme,
+  onEvent,
+  style,
+  webViewProps
+}) {
   return /* @__PURE__ */ jsx11(
     MoonPayFrameView,
     {
@@ -1493,7 +1537,8 @@ function MoonPayConnect({ theme, onEvent, style }) {
       props: { theme },
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1502,7 +1547,8 @@ function MoonPayConnect({ theme, onEvent, style }) {
 import { jsx as jsx12 } from "react/jsx-runtime";
 function MoonPayConnectionCheck({
   skipKyc,
-  onEvent
+  onEvent,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx12(
     MoonPayFrameView,
@@ -1510,20 +1556,37 @@ function MoonPayConnectionCheck({
       spec: connectionCheckSpec,
       props: { skipKyc },
       defaultStyle: {},
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
 
 // src/components/connection-reset.tsx
 import { jsx as jsx13 } from "react/jsx-runtime";
-function MoonPayConnectionReset({ onEvent }) {
-  return /* @__PURE__ */ jsx13(MoonPayFrameView, { spec: connectionResetSpec, props: {}, defaultStyle: {}, onEvent });
+function MoonPayConnectionReset({
+  onEvent,
+  webViewProps
+}) {
+  return /* @__PURE__ */ jsx13(
+    MoonPayFrameView,
+    {
+      spec: connectionResetSpec,
+      props: {},
+      defaultStyle: {},
+      onEvent,
+      webViewProps
+    }
+  );
 }
 
 // src/components/customer-export.tsx
 import { jsx as jsx14 } from "react/jsx-runtime";
-function MoonPayCustomerExport({ onEvent, style }) {
+function MoonPayCustomerExport({
+  onEvent,
+  style,
+  webViewProps
+}) {
   return /* @__PURE__ */ jsx14(
     MoonPayFrameView,
     {
@@ -1531,7 +1594,8 @@ function MoonPayCustomerExport({ onEvent, style }) {
       props: {},
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1542,7 +1606,8 @@ function MoonPayGooglePayButton({
   quote,
   externalTransactionId,
   onEvent,
-  style
+  style,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx15(
     MoonPayFrameView,
@@ -1551,7 +1616,8 @@ function MoonPayGooglePayButton({
       props: { quote, externalTransactionId },
       style,
       defaultStyle: { height: 48 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }
@@ -1562,7 +1628,8 @@ function MoonPayWidget({
   quote,
   externalTransactionId,
   onEvent,
-  style
+  style,
+  webViewProps
 }) {
   return /* @__PURE__ */ jsx16(
     MoonPayFrameView,
@@ -1571,7 +1638,8 @@ function MoonPayWidget({
       props: { quote, externalTransactionId },
       style,
       defaultStyle: { flex: 1 },
-      onEvent
+      onEvent,
+      webViewProps
     }
   );
 }