@sumup/react-native-checkout 0.0.0-alpha.1

package/lib/module/components/3DSecureSheet/index.js

@@ -0,0 +1,46 @@
+import React, { useEffect, useRef } from 'react';
+import { useThreeDSecureStore } from '../../contexts/StoreContext';
+import { observer } from 'mobx-react-lite';
+import logger from '../../services/Logger';
+import { WebViewSheet } from '../WebViewSheet';
+export const ThreeDSecureSheet = observer(() => {
+  const wasRedirected = useRef(false);
+  const {
+    currentCheckoutId,
+    threeDSecureModel,
+    handle3DSecure,
+    forceCloseThreeDSecure
+  } = useThreeDSecureStore();
+  const isVisible = !!threeDSecureModel;
+  let inputs = '';
+  for (const key in threeDSecureModel === null || threeDSecureModel === void 0 ? void 0 : threeDSecureModel.payload) {
+    inputs += `<input type="hidden" name="${key}" value="${threeDSecureModel === null || threeDSecureModel === void 0 ? void 0 : threeDSecureModel.payload[key]}" />`;
+  }
+  useEffect(() => {
+    wasRedirected.current = false;
+  }, [threeDSecureModel]);
+  const onClose = () => {
+    logger.log(`[3DSecure Flow] a user closed webview`, {});
+    forceCloseThreeDSecure();
+  };
+  return threeDSecureModel ? /*#__PURE__*/React.createElement(WebViewSheet, {
+    isVisible: isVisible,
+    onClose: onClose,
+    onShouldStartLoadWithRequest: event => {
+      logger.log(`[3DSecure Flow] [WebView]`, {
+        data: {
+          url: event.url
+        }
+      });
+      if (currentCheckoutId && event.url.includes(currentCheckoutId)) {
+        handle3DSecure();
+        return false;
+      }
+      return true;
+    },
+    source: {
+      html: `<form name="autoSubmitForm" action="${threeDSecureModel.url}" method="${threeDSecureModel.method}">${inputs}</form><script type="text/javascript">document.autoSubmitForm.submit();</script>`
+    }
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null);
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/3DSecureSheet/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","useThreeDSecureStore","observer","logger","WebViewSheet","ThreeDSecureSheet","wasRedirected","currentCheckoutId","threeDSecureModel","handle3DSecure","forceCloseThreeDSecure","isVisible","inputs","key","payload","current","onClose","log","createElement","onShouldStartLoadWithRequest","event","data","url","includes","source","html","method","Fragment"],"sourceRoot":"../../../../src","sources":["components/3DSecureSheet/index.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAChD,SAASC,oBAAoB,QAAQ,6BAA6B;AAClE,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,OAAOC,MAAM,MAAM,uBAAuB;AAC1C,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,OAAO,MAAMC,iBAAiB,GAAGH,QAAQ,CAAC,MAAM;EAC9C,MAAMI,aAAa,GAAGN,MAAM,CAAC,KAAK,CAAC;EAEnC,MAAM;IACJO,iBAAiB;IACjBC,iBAAiB;IACjBC,cAAc;IACdC;EACF,CAAC,GAAGT,oBAAoB,CAAC,CAAC;EAE1B,MAAMU,SAAS,GAAG,CAAC,CAACH,iBAAiB;EAErC,IAAII,MAAM,GAAG,EAAE;EACf,KAAK,MAAMC,GAAG,IAAIL,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEM,OAAO,EAAE;IAC5CF,MAAM,IAAK,8BAA6BC,GAAI,YAAWL,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEM,OAAO,CAACD,GAAG,CAAE,MAAK;EAC9F;EAEAd,SAAS,CAAC,MAAM;IACdO,aAAa,CAACS,OAAO,GAAG,KAAK;EAC/B,CAAC,EAAE,CAACP,iBAAiB,CAAC,CAAC;EAEvB,MAAMQ,OAAO,GAAGA,CAAA,KAAM;IACpBb,MAAM,CAACc,GAAG,CAAE,uCAAsC,EAAE,CAAC,CAAC,CAAC;IAEvDP,sBAAsB,CAAC,CAAC;EAC1B,CAAC;EAED,OAAOF,iBAAiB,gBACtBV,KAAA,CAAAoB,aAAA,CAACd,YAAY;IACXO,SAAS,EAAEA,SAAU;IACrBK,OAAO,EAAEA,OAAQ;IACjBG,4BAA4B,EAAGC,KAAK,IAAK;MACvCjB,MAAM,CAACc,GAAG,CAAE,2BAA0B,EAAE;QACtCI,IAAI,EAAE;UAAEC,GAAG,EAAEF,KAAK,CAACE;QAAI;MACzB,CAAC,CAAC;MAEF,IAAIf,iBAAiB,IAAIa,KAAK,CAACE,GAAG,CAACC,QAAQ,CAAChB,iBAAiB,CAAC,EAAE;QAC9DE,cAAc,CAAC,CAAC;QAChB,OAAO,KAAK;MACd;MAEA,OAAO,IAAI;IACb,CAAE;IACFe,MAAM,EAAE;MACNC,IAAI,EAAG,uCAAsCjB,iBAAiB,CAACc,GAAI,aAAYd,iBAAiB,CAACkB,MAAO,KAAId,MAAO;IACrH;EAAE,CACH,CAAC,gBAEFd,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAA6B,QAAA,MAAI,CACL;AACH,CAAC,CAAC"}

package/lib/module/components/AnimatedContainer/index.js

@@ -0,0 +1,66 @@
+import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
+import { Animated, KeyboardAvoidingView, Platform, View, useWindowDimensions } from 'react-native';
+import { useStyles } from './styles';
+import { useSafeArea } from '../../hooks/useSafeArea';
+const TIMEOUT = 300;
+const BACK_OFFSET = -50;
+const KEYBOARD_VERTICAL_OFFET = 80;
+export const AnimatedContainer = /*#__PURE__*/forwardRef((props, ref) => {
+  const insets = useSafeArea();
+  const isShown = useRef(false);
+  const [height, setHeight] = useState();
+  const styles = useStyles(height);
+  const {
+    width
+  } = useWindowDimensions();
+  const left = useRef(new Animated.Value(props.initWithoutAnimation ? 0 : width));
+  useImperativeHandle(ref, () => ({
+    goToBack: () => {
+      isShown.current = false;
+      Animated.timing(left.current, {
+        toValue: BACK_OFFSET,
+        duration: TIMEOUT,
+        useNativeDriver: false
+      }).start();
+    },
+    hide: () => {
+      isShown.current = false;
+      Animated.timing(left.current, {
+        toValue: width,
+        duration: TIMEOUT,
+        useNativeDriver: false
+      }).start();
+    },
+    show: () => {
+      isShown.current = true;
+      Animated.timing(left.current, {
+        toValue: 0,
+        duration: TIMEOUT,
+        useNativeDriver: false
+      }).start();
+    }
+  }));
+  useEffect(() => {
+    if (!isShown.current) {
+      setHeight(props.height);
+    }
+  }, [props.height]);
+  const onLayout = event => {
+    var _props$onHeightChange;
+    (_props$onHeightChange = props.onHeightChanged) === null || _props$onHeightChange === void 0 ? void 0 : _props$onHeightChange.call(props, event.nativeEvent.layout.height);
+  };
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    style: [styles.container, {
+      left: left.current
+    }]
+  }, /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
+    style: styles.keyboardAvoidingView,
+    enabled: true,
+    behavior: Platform.OS === 'android' ? 'height' : 'position',
+    keyboardVerticalOffset: -(insets.bottom + KEYBOARD_VERTICAL_OFFET)
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.content,
+    onLayout: onLayout
+  }, props.children)));
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/AnimatedContainer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","forwardRef","useEffect","useImperativeHandle","useRef","useState","Animated","KeyboardAvoidingView","Platform","View","useWindowDimensions","useStyles","useSafeArea","TIMEOUT","BACK_OFFSET","KEYBOARD_VERTICAL_OFFET","AnimatedContainer","props","ref","insets","isShown","height","setHeight","styles","width","left","Value","initWithoutAnimation","goToBack","current","timing","toValue","duration","useNativeDriver","start","hide","show","onLayout","event","_props$onHeightChange","onHeightChanged","call","nativeEvent","layout","createElement","style","container","keyboardAvoidingView","enabled","behavior","OS","keyboardVerticalOffset","bottom","content","children"],"sourceRoot":"../../../../src","sources":["components/AnimatedContainer/index.tsx"],"mappings":"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"}

package/lib/module/components/AnimatedContainer/styles.js

@@ -0,0 +1,33 @@
+import { StyleSheet, useWindowDimensions } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+export const useStyles = height => {
+  const {
+    colors
+  } = useTheme();
+  const {
+    width
+  } = useWindowDimensions();
+  const styles = StyleSheet.create({
+    container: {
+      position: 'absolute',
+      bottom: 0,
+      top: 0,
+      left: 0,
+      right: 0
+    },
+    content: {
+      backgroundColor: colors.white,
+      width: width,
+      height,
+      borderTopLeftRadius: 8,
+      borderTopRightRadius: 8,
+      paddingHorizontal: 16
+    },
+    keyboardAvoidingView: {
+      flex: 1,
+      justifyContent: 'flex-end'
+    }
+  });
+  return styles;
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/components/AnimatedContainer/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useWindowDimensions","useTheme","useStyles","height","colors","width","styles","create","container","position","bottom","top","left","right","content","backgroundColor","white","borderTopLeftRadius","borderTopRightRadius","paddingHorizontal","keyboardAvoidingView","flex","justifyContent"],"sourceRoot":"../../../../src","sources":["components/AnimatedContainer/styles.tsx"],"mappings":"AAAA,SAASA,UAAU,EAAEC,mBAAmB,QAAQ,cAAc;AAC9D,SAASC,QAAQ,QAAQ,6BAA6B;AAEtD,OAAO,MAAMC,SAAS,GAAIC,MAAe,IAAK;EAC5C,MAAM;IAAEC;EAAO,CAAC,GAAGH,QAAQ,CAAC,CAAC;EAE7B,MAAM;IAAEI;EAAM,CAAC,GAAGL,mBAAmB,CAAC,CAAC;EAEvC,MAAMM,MAAM,GAAGP,UAAU,CAACQ,MAAM,CAAC;IAC/BC,SAAS,EAAE;MACTC,QAAQ,EAAE,UAAU;MACpBC,MAAM,EAAE,CAAC;MACTC,GAAG,EAAE,CAAC;MACNC,IAAI,EAAE,CAAC;MACPC,KAAK,EAAE;IACT,CAAC;IACDC,OAAO,EAAE;MACPC,eAAe,EAAEX,MAAM,CAACY,KAAK;MAC7BX,KAAK,EAAEA,KAAK;MACZF,MAAM;MACNc,mBAAmB,EAAE,CAAC;MACtBC,oBAAoB,EAAE,CAAC;MACvBC,iBAAiB,EAAE;IACrB,CAAC;IACDC,oBAAoB,EAAE;MACpBC,IAAI,EAAE,CAAC;MACPC,cAAc,EAAE;IAClB;EACF,CAAC,CAAC;EAEF,OAAOhB,MAAM;AACf,CAAC"}

package/lib/module/components/ApplePayButton/index.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { TouchableOpacity, Image } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+import { useStyles } from './styles';
+import { useNativePaymentStore } from '../../contexts/StoreContext';
+export const ApplePayButton = props => {
+  const styles = useStyles(props.disabled);
+  const theme = useTheme();
+  const {
+    presentApplePay
+  } = useNativePaymentStore();
+  return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    disabled: props.disabled,
+    style: styles.container,
+    onPress: presentApplePay
+  }, /*#__PURE__*/React.createElement(Image, {
+    style: styles.image,
+    source: theme.images.applePay
+  }));
+};
+//# sourceMappingURL=index.js.map

package/lib/module/components/ApplePayButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","TouchableOpacity","Image","useTheme","useStyles","useNativePaymentStore","ApplePayButton","props","styles","disabled","theme","presentApplePay","createElement","style","container","onPress","image","source","images","applePay"],"sourceRoot":"../../../../src","sources":["components/ApplePayButton/index.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,EAAEC,KAAK,QAAQ,cAAc;AACtD,SAASC,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,SAAS,QAAQ,UAAU;AACpC,SAASC,qBAAqB,QAAQ,6BAA6B;AAMnE,OAAO,MAAMC,cAAc,GAAIC,KAA0B,IAAK;EAC5D,MAAMC,MAAM,GAAGJ,SAAS,CAACG,KAAK,CAACE,QAAQ,CAAC;EACxC,MAAMC,KAAK,GAAGP,QAAQ,CAAC,CAAC;EAExB,MAAM;IAAEQ;EAAgB,CAAC,GAAGN,qBAAqB,CAAC,CAAC;EAEnD,oBACEL,KAAA,CAAAY,aAAA,CAACX,gBAAgB;IACfQ,QAAQ,EAAEF,KAAK,CAACE,QAAS;IACzBI,KAAK,EAAEL,MAAM,CAACM,SAAU;IACxBC,OAAO,EAAEJ;EAAgB,gBAEzBX,KAAA,CAAAY,aAAA,CAACV,KAAK;IAACW,KAAK,EAAEL,MAAM,CAACQ,KAAM;IAACC,MAAM,EAAEP,KAAK,CAACQ,MAAM,CAACC;EAAS,CAAE,CAC5C,CAAC;AAEvB,CAAC"}

package/lib/module/components/ApplePayButton/styles.js

@@ -0,0 +1,24 @@
+import { StyleSheet } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+export const useStyles = disabled => {
+  const {
+    colors
+  } = useTheme();
+  const styles = StyleSheet.create({
+    container: {
+      opacity: disabled ? 0.6 : 1,
+      height: 48,
+      width: '100%',
+      backgroundColor: colors.black,
+      borderRadius: 8,
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
+    image: {
+      width: 42,
+      height: 24
+    }
+  });
+  return styles;
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/components/ApplePayButton/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useTheme","useStyles","disabled","colors","styles","create","container","opacity","height","width","backgroundColor","black","borderRadius","justifyContent","alignItems","image"],"sourceRoot":"../../../../src","sources":["components/ApplePayButton/styles.tsx"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,6BAA6B;AAEtD,OAAO,MAAMC,SAAS,GAAIC,QAAkB,IAAK;EAC/C,MAAM;IAAEC;EAAO,CAAC,GAAGH,QAAQ,CAAC,CAAC;EAE7B,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,SAAS,EAAE;MACTC,OAAO,EAAEL,QAAQ,GAAG,GAAG,GAAG,CAAC;MAC3BM,MAAM,EAAE,EAAE;MACVC,KAAK,EAAE,MAAM;MACbC,eAAe,EAAEP,MAAM,CAACQ,KAAK;MAC7BC,YAAY,EAAE,CAAC;MACfC,cAAc,EAAE,QAAQ;MACxBC,UAAU,EAAE;IACd,CAAC;IACDC,KAAK,EAAE;MACLN,KAAK,EAAE,EAAE;MACTD,MAAM,EAAE;IACV;EACF,CAAC,CAAC;EAEF,OAAOJ,MAAM;AACf,CAAC"}

package/lib/module/components/Button/index.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Text, TouchableOpacity } from 'react-native';
+import { useStyles } from './styles';
+export const Button = props => {
+  const styles = useStyles(props.type);
+  return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    style: styles.container,
+    onPress: props.onPress
+  }, /*#__PURE__*/React.createElement(Text, {
+    style: styles.text
+  }, props.title));
+};
+//# sourceMappingURL=index.js.map

package/lib/module/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Text","TouchableOpacity","useStyles","Button","props","styles","type","createElement","style","container","onPress","text","title"],"sourceRoot":"../../../../src","sources":["components/Button/index.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,gBAAgB,QAAQ,cAAc;AACrD,SAASC,SAAS,QAAQ,UAAU;AAWpC,OAAO,MAAMC,MAAM,GAAIC,KAAkB,IAAK;EAC5C,MAAMC,MAAM,GAAGH,SAAS,CAACE,KAAK,CAACE,IAAI,CAAC;EAEpC,oBACEP,KAAA,CAAAQ,aAAA,CAACN,gBAAgB;IAACO,KAAK,EAAEH,MAAM,CAACI,SAAU;IAACC,OAAO,EAAEN,KAAK,CAACM;EAAQ,gBAChEX,KAAA,CAAAQ,aAAA,CAACP,IAAI;IAACQ,KAAK,EAAEH,MAAM,CAACM;EAAK,GAAEP,KAAK,CAACQ,KAAY,CAC7B,CAAC;AAEvB,CAAC"}

package/lib/module/components/Button/styles.js

@@ -0,0 +1,48 @@
+import { StyleSheet } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+export const useStyles = type => {
+  const {
+    colors,
+    fonts
+  } = useTheme();
+  const textColor = {
+    primary: colors.white,
+    secondary: colors.codGray,
+    tertiary: colors.alizarinCrimson
+  };
+  const backgroundColor = {
+    primary: colors.royalBlue,
+    secondary: colors.transparent,
+    tertiary: colors.transparent
+  };
+  const borderColor = {
+    primary: colors.transparent,
+    secondary: colors.silver,
+    tertiary: colors.transparent
+  };
+  const borderWidth = {
+    primary: 0,
+    secondary: 1,
+    tertiary: 0
+  };
+  const styles = StyleSheet.create({
+    container: {
+      height: 48,
+      borderRadius: 100,
+      width: '100%',
+      justifyContent: 'center',
+      alignItems: 'center',
+      backgroundColor: backgroundColor[type],
+      borderWidth: borderWidth[type],
+      borderColor: borderColor[type]
+    },
+    text: {
+      fontSize: 16,
+      lineHeight: 24,
+      color: textColor[type],
+      fontFamily: fonts.sfProTextBold
+    }
+  });
+  return styles;
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/components/Button/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useTheme","useStyles","type","colors","fonts","textColor","primary","white","secondary","codGray","tertiary","alizarinCrimson","backgroundColor","royalBlue","transparent","borderColor","silver","borderWidth","styles","create","container","height","borderRadius","width","justifyContent","alignItems","text","fontSize","lineHeight","color","fontFamily","sfProTextBold"],"sourceRoot":"../../../../src","sources":["components/Button/styles.tsx"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,6BAA6B;AAGtD,OAAO,MAAMC,SAAS,GAAIC,IAAgB,IAAK;EAC7C,MAAM;IAAEC,MAAM;IAAEC;EAAM,CAAC,GAAGJ,QAAQ,CAAC,CAAC;EAEpC,MAAMK,SAAS,GAAG;IAChBC,OAAO,EAAEH,MAAM,CAACI,KAAK;IACrBC,SAAS,EAAEL,MAAM,CAACM,OAAO;IACzBC,QAAQ,EAAEP,MAAM,CAACQ;EACnB,CAAC;EAED,MAAMC,eAAe,GAAG;IACtBN,OAAO,EAAEH,MAAM,CAACU,SAAS;IACzBL,SAAS,EAAEL,MAAM,CAACW,WAAW;IAC7BJ,QAAQ,EAAEP,MAAM,CAACW;EACnB,CAAC;EAED,MAAMC,WAAW,GAAG;IAClBT,OAAO,EAAEH,MAAM,CAACW,WAAW;IAC3BN,SAAS,EAAEL,MAAM,CAACa,MAAM;IACxBN,QAAQ,EAAEP,MAAM,CAACW;EACnB,CAAC;EAED,MAAMG,WAAW,GAAG;IAClBX,OAAO,EAAE,CAAC;IACVE,SAAS,EAAE,CAAC;IACZE,QAAQ,EAAE;EACZ,CAAC;EAED,MAAMQ,MAAM,GAAGnB,UAAU,CAACoB,MAAM,CAAC;IAC/BC,SAAS,EAAE;MACTC,MAAM,EAAE,EAAE;MACVC,YAAY,EAAE,GAAG;MACjBC,KAAK,EAAE,MAAM;MACbC,cAAc,EAAE,QAAQ;MACxBC,UAAU,EAAE,QAAQ;MACpBb,eAAe,EAAEA,eAAe,CAACV,IAAI,CAAC;MACtCe,WAAW,EAAEA,WAAW,CAACf,IAAI,CAAC;MAC9Ba,WAAW,EAAEA,WAAW,CAACb,IAAI;IAC/B,CAAC;IACDwB,IAAI,EAAE;MACJC,QAAQ,EAAE,EAAE;MACZC,UAAU,EAAE,EAAE;MACdC,KAAK,EAAExB,SAAS,CAACH,IAAI,CAAC;MACtB4B,UAAU,EAAE1B,KAAK,CAAC2B;IACpB;EACF,CAAC,CAAC;EAEF,OAAOb,MAAM;AACf,CAAC"}

package/lib/module/components/CardInformation/index.js

@@ -0,0 +1,78 @@
+import React, { useRef } from 'react';
+import { View } from 'react-native';
+import { useStrings } from '../../contexts/LanguageContext';
+import { CardInputField } from '../InputFields/CardInputField';
+import { CVCInputField } from '../InputFields/CVCInputField';
+import { ExpirationDateInputField } from '../InputFields/ExpirationDateInputField';
+import { useStyles } from './styles';
+import { BaseInputField } from '../InputFields/BaseInputField';
+import { Stack, Queue } from 'react-native-spacing-system';
+import { Switch } from '../Switch';
+import { usePaymentInstrumentsStore } from '../../contexts/StoreContext';
+import { Text } from '../Text';
+import { PrivacyPolicySheet } from '../PrivacyPolicySheet';
+export const CardInformation = props => {
+  const {
+    strings
+  } = useStrings();
+  const styles = useStyles();
+  const {
+    canCardBeSavedForFuturePayments
+  } = usePaymentInstrumentsStore();
+  const privacyPolicySheetRef = useRef(null);
+  const onPrivacyPolicyLinkPress = () => {
+    var _privacyPolicySheetRe;
+    (_privacyPolicySheetRe = privacyPolicySheetRef.current) === null || _privacyPolicySheetRe === void 0 ? void 0 : _privacyPolicySheetRe.show();
+  };
+  const SaveCardCheckbox = canCardBeSavedForFuturePayments && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Stack, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(Switch, {
+    text: props.saveCardTitle,
+    isChecked: props.saveCard,
+    onChangeValue: props.onSaveCardValueChange
+  }));
+  const PrivacyPolicy = (props.showPrivacyPolicyAllTime || props.saveCard) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Stack, {
+    size: 8
+  }), /*#__PURE__*/React.createElement(Text, {
+    style: styles.privacyPolicyText,
+    customTag: {
+      style: styles.privacyPolicyLink
+    },
+    onPress: onPrivacyPolicyLinkPress
+  }, strings.choosePaymentMethod.cardInformation.privacyPolicy));
+  return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(BaseInputField, {
+    title: strings.choosePaymentMethod.cardInformation.cardholderNameTitle,
+    inputModel: props.nameInputModel,
+    placeholder: strings.choosePaymentMethod.cardInformation.namePlaceholder
+  }), /*#__PURE__*/React.createElement(Stack, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(CardInputField, {
+    title: strings.choosePaymentMethod.cardInformation.cardNumberTitle,
+    inputModel: props.cardInputModel,
+    placeholder: strings.choosePaymentMethod.cardInformation.cardNumberInputPlaceholder
+  }), /*#__PURE__*/React.createElement(Stack, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(View, {
+    style: styles.rowContainer
+  }, /*#__PURE__*/React.createElement(ExpirationDateInputField, {
+    title: strings.choosePaymentMethod.cardInformation.expirationDateTitle,
+    inputModel: props.expirationDateInputModel,
+    placeholder: strings.choosePaymentMethod.cardInformation.expirationDateInputPlaceholder,
+    containerStyle: styles.expirationDateInput
+  }), /*#__PURE__*/React.createElement(Queue, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(CVCInputField, {
+    title: strings.choosePaymentMethod.cardInformation.securityCodeTitle,
+    inputModel: props.cvcCodeInputModel,
+    placeholder: strings.choosePaymentMethod.cardInformation.cvcInputPlaceholder,
+    containerStyle: styles.cvcInput
+  })), /*#__PURE__*/React.createElement(Stack, {
+    size: 8
+  }), SaveCardCheckbox, PrivacyPolicy, /*#__PURE__*/React.createElement(Stack, {
+    size: 16
+  }), props.countryCode && /*#__PURE__*/React.createElement(PrivacyPolicySheet, {
+    ref: privacyPolicySheetRef,
+    countryCode: props.countryCode
+  }));
+};
+//# sourceMappingURL=index.js.map

package/lib/module/components/CardInformation/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useRef","View","useStrings","CardInputField","CVCInputField","ExpirationDateInputField","useStyles","BaseInputField","Stack","Queue","Switch","usePaymentInstrumentsStore","Text","PrivacyPolicySheet","CardInformation","props","strings","styles","canCardBeSavedForFuturePayments","privacyPolicySheetRef","onPrivacyPolicyLinkPress","_privacyPolicySheetRe","current","show","SaveCardCheckbox","createElement","Fragment","size","text","saveCardTitle","isChecked","saveCard","onChangeValue","onSaveCardValueChange","PrivacyPolicy","showPrivacyPolicyAllTime","style","privacyPolicyText","customTag","privacyPolicyLink","onPress","choosePaymentMethod","cardInformation","privacyPolicy","title","cardholderNameTitle","inputModel","nameInputModel","placeholder","namePlaceholder","cardNumberTitle","cardInputModel","cardNumberInputPlaceholder","rowContainer","expirationDateTitle","expirationDateInputModel","expirationDateInputPlaceholder","containerStyle","expirationDateInput","securityCodeTitle","cvcCodeInputModel","cvcInputPlaceholder","cvcInput","countryCode","ref"],"sourceRoot":"../../../../src","sources":["components/CardInformation/index.tsx"],"mappings":"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"}

package/lib/module/components/CardInformation/styles.js

@@ -0,0 +1,35 @@
+import { StyleSheet } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+export const useStyles = () => {
+  const {
+    colors
+  } = useTheme();
+  const styles = StyleSheet.create({
+    rowContainer: {
+      flexDirection: 'row',
+      marginTop: -1
+    },
+    expirationDateInput: {
+      flex: 1
+    },
+    cvcInput: {
+      flex: 1,
+      marginLeft: -1,
+      justifyContent: 'flex-start'
+    },
+    title: {
+      fontWeight: '600',
+      fontSize: 14,
+      color: colors.paleSky,
+      marginBottom: 8
+    },
+    privacyPolicyText: {
+      color: colors.doveGray
+    },
+    privacyPolicyLink: {
+      color: colors.royalBlue
+    }
+  });
+  return styles;
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/components/CardInformation/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useTheme","useStyles","colors","styles","create","rowContainer","flexDirection","marginTop","expirationDateInput","flex","cvcInput","marginLeft","justifyContent","title","fontWeight","fontSize","color","paleSky","marginBottom","privacyPolicyText","doveGray","privacyPolicyLink","royalBlue"],"sourceRoot":"../../../../src","sources":["components/CardInformation/styles.tsx"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,6BAA6B;AAEtD,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAM;IAAEC;EAAO,CAAC,GAAGF,QAAQ,CAAC,CAAC;EAE7B,MAAMG,MAAM,GAAGJ,UAAU,CAACK,MAAM,CAAC;IAC/BC,YAAY,EAAE;MACZC,aAAa,EAAE,KAAK;MACpBC,SAAS,EAAE,CAAC;IACd,CAAC;IACDC,mBAAmB,EAAE;MACnBC,IAAI,EAAE;IACR,CAAC;IACDC,QAAQ,EAAE;MACRD,IAAI,EAAE,CAAC;MACPE,UAAU,EAAE,CAAC,CAAC;MACdC,cAAc,EAAE;IAClB,CAAC;IACDC,KAAK,EAAE;MACLC,UAAU,EAAE,KAAK;MACjBC,QAAQ,EAAE,EAAE;MACZC,KAAK,EAAEd,MAAM,CAACe,OAAO;MACrBC,YAAY,EAAE;IAChB,CAAC;IACDC,iBAAiB,EAAE;MACjBH,KAAK,EAAEd,MAAM,CAACkB;IAChB,CAAC;IACDC,iBAAiB,EAAE;MACjBL,KAAK,EAAEd,MAAM,CAACoB;IAChB;EACF,CAAC,CAAC;EAEF,OAAOnB,MAAM;AACf,CAAC"}

package/lib/module/components/CardSheet/index.js

@@ -0,0 +1,130 @@
+import React, { useEffect, useRef } from 'react';
+import { Image, Keyboard, ScrollView, Text, View } from 'react-native';
+import { NativePayButton } from '../NativePayButton';
+import { Stack } from 'react-native-spacing-system';
+import { useStrings } from '../../contexts/LanguageContext';
+import { NoInternetConnection } from '../NoInternetConnection';
+import { PayButton } from '../PayButton';
+import { useCardSheet } from './useCardSheet';
+import { useStyles } from './styles';
+import { observer } from 'mobx-react-lite';
+import { Header } from '../Header';
+import { PaymentMethodsForm } from '../PaymentMethodsForm';
+import { CardInformation } from '../CardInformation';
+import { PaymentMethodFormHeaderOption } from '../PaymentMethodFormHeaderOption';
+import { Queue } from 'react-native-spacing-system';
+import { useTheme } from '../../contexts/ThemeContext';
+import { SavedCard } from '../SavedCard';
+import { ImageButton } from '../ImageButton';
+import { useNativePaymentStore, usePaymentStore } from '../../contexts/StoreContext';
+export const CardSheet = observer(props => {
+  const {
+    strings
+  } = useStrings();
+  const styles = useStyles();
+  const {
+    images
+  } = useTheme();
+  const scrollView = useRef(null);
+  const {
+    countryCode,
+    paymentMethod,
+    selectedPaymentInstrument,
+    nameInputModel,
+    cardInputModel,
+    cvcCodeInputModel,
+    expirationDateInputModel,
+    saveCard,
+    processPayment,
+    setSaveCard,
+    selectPaymentMethod
+  } = useCardSheet();
+  const {
+    canPayWithNativeView
+  } = useNativePaymentStore();
+  const {
+    paymentStatus
+  } = usePaymentStore();
+  const cardInformationProps = {
+    countryCode,
+    saveCardTitle: strings.choosePaymentMethod.cardInformation.saveCard,
+    saveCard,
+    nameInputModel,
+    cardInputModel,
+    cvcCodeInputModel,
+    expirationDateInputModel,
+    onSaveCardValueChange: setSaveCard
+  };
+  const payButtonProps = {
+    canStartPayment: true,
+    onPress: processPayment
+  };
+  const onKeyboardDidShow = () => {
+    var _scrollView$current;
+    (_scrollView$current = scrollView.current) === null || _scrollView$current === void 0 ? void 0 : _scrollView$current.scrollToEnd();
+  };
+  useEffect(() => {
+    const listener = Keyboard.addListener('keyboardWillShow', onKeyboardDidShow);
+    return () => {
+      listener.remove();
+    };
+  }, []);
+  const SavedCards = selectedPaymentInstrument && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PaymentMethodFormHeaderOption, {
+    selected: paymentMethod === 'saved-card',
+    onSelect: () => selectPaymentMethod('saved-card'),
+    title: strings.choosePaymentMethod.paymentMethods.saveCardOption,
+    rightChildren: /*#__PURE__*/React.createElement(ImageButton, {
+      source: images.rightArrow,
+      onPress: props.onCardPress
+    })
+  }), paymentMethod === 'saved-card' && /*#__PURE__*/React.createElement(View, {
+    style: styles.savedCardContainer
+  }, /*#__PURE__*/React.createElement(SavedCard, {
+    paymentInstrument: selectedPaymentInstrument
+  })));
+  const CardPayment = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PaymentMethodFormHeaderOption, {
+    selected: paymentMethod === 'new-card',
+    onSelect: () => selectPaymentMethod('new-card'),
+    title: strings.choosePaymentMethod.paymentMethods.cardOption,
+    rightChildren: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Image, {
+      style: styles.image,
+      source: images.visa
+    }), /*#__PURE__*/React.createElement(Queue, {
+      size: 8
+    }), /*#__PURE__*/React.createElement(Image, {
+      style: styles.image,
+      source: images.mastercard
+    }), /*#__PURE__*/React.createElement(Queue, {
+      size: 8
+    }), /*#__PURE__*/React.createElement(Image, {
+      style: styles.image,
+      source: images.americanExpress
+    }))
+  }), paymentMethod === 'new-card' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Stack, {
+    size: 16
+  }), /*#__PURE__*/React.createElement(CardInformation, cardInformationProps)));
+  const PaymentMethods = /*#__PURE__*/React.createElement(PaymentMethodsForm, {
+    methods: [SavedCards, CardPayment].filter(item => !!item)
+  });
+  const NativePayView = canPayWithNativeView && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(NativePayButton, {
+    disabled: paymentStatus === 'processing' || paymentStatus === 'success'
+  }), /*#__PURE__*/React.createElement(Stack, {
+    size: 20
+  }), /*#__PURE__*/React.createElement(Text, {
+    style: styles.separatorText
+  }, strings.choosePaymentMethod.separatorText), /*#__PURE__*/React.createElement(Stack, {
+    size: 20
+  }));
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.container
+  }, /*#__PURE__*/React.createElement(Header, {
+    title: strings.choosePaymentMethod.title,
+    onCloseButtonPress: props.onClose
+  }), /*#__PURE__*/React.createElement(ScrollView, {
+    ref: scrollView,
+    showsVerticalScrollIndicator: false
+  }, NativePayView, PaymentMethods), /*#__PURE__*/React.createElement(Stack, {
+    size: 32
+  }), /*#__PURE__*/React.createElement(NoInternetConnection, null), /*#__PURE__*/React.createElement(PayButton, payButtonProps));
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/CardSheet/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","Image","Keyboard","ScrollView","Text","View","NativePayButton","Stack","useStrings","NoInternetConnection","PayButton","useCardSheet","useStyles","observer","Header","PaymentMethodsForm","CardInformation","PaymentMethodFormHeaderOption","Queue","useTheme","SavedCard","ImageButton","useNativePaymentStore","usePaymentStore","CardSheet","props","strings","styles","images","scrollView","countryCode","paymentMethod","selectedPaymentInstrument","nameInputModel","cardInputModel","cvcCodeInputModel","expirationDateInputModel","saveCard","processPayment","setSaveCard","selectPaymentMethod","canPayWithNativeView","paymentStatus","cardInformationProps","saveCardTitle","choosePaymentMethod","cardInformation","onSaveCardValueChange","payButtonProps","canStartPayment","onPress","onKeyboardDidShow","_scrollView$current","current","scrollToEnd","listener","addListener","remove","SavedCards","createElement","Fragment","selected","onSelect","title","paymentMethods","saveCardOption","rightChildren","source","rightArrow","onCardPress","style","savedCardContainer","paymentInstrument","CardPayment","cardOption","image","visa","size","mastercard","americanExpress","PaymentMethods","methods","filter","item","NativePayView","disabled","separatorText","container","onCloseButtonPress","onClose","ref","showsVerticalScrollIndicator"],"sourceRoot":"../../../../src","sources":["components/CardSheet/index.tsx"],"mappings":"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"}

package/lib/module/components/CardSheet/styles.js

@@ -0,0 +1,46 @@
+import { StyleSheet, useWindowDimensions } from 'react-native';
+import { useTheme } from '../../contexts/ThemeContext';
+import { useSafeArea } from '../../hooks/useSafeArea';
+export const useStyles = () => {
+  const {
+    colors
+  } = useTheme();
+  const {
+    height
+  } = useWindowDimensions();
+  const insets = useSafeArea();
+  const styles = StyleSheet.create({
+    container: {
+      backgroundColor: colors.white,
+      maxHeight: height - insets.top,
+      paddingBottom: insets.bottom + 16
+    },
+    title: {
+      fontWeight: 'bold',
+      fontSize: 20,
+      marginBottom: 30,
+      color: colors.black
+    },
+    separatorText: {
+      fontSize: 14,
+      lineHeight: 16,
+      color: colors.black,
+      width: '100%',
+      textAlign: 'center'
+    },
+    image: {
+      width: 32,
+      height: 24
+    },
+    savedCardContainer: {
+      marginTop: 16,
+      marginBottom: 18,
+      marginLeft: 40
+    },
+    keyboardView: {
+      // flex: 1,
+    }
+  });
+  return styles;
+};
+//# sourceMappingURL=styles.js.map