feat: add Expo config plugin

RNSquareInAppPayments.podspec

@@ -22,8 +22,8 @@ Pod::Spec.new do |s|
     s.dependency 'SquareInAppPaymentsSDK', $sqipVersion
     s.dependency 'SquareBuyerVerificationSDK', $sqipVersion
   else
-    s.dependency 'SquareInAppPaymentsSDK', '1.6.2'
-    s.dependency 'SquareBuyerVerificationSDK', '1.6.2'
+    s.dependency 'SquareInAppPaymentsSDK', '1.6.4'
+    s.dependency 'SquareBuyerVerificationSDK', '1.6.4'
   end
 
 end

android/build.gradle

@@ -12,7 +12,7 @@ buildscript {
 
 apply plugin: 'com.android.library'
 
-def MIN_IAP_SDK_VERSION = '1.6.5'
+def MIN_IAP_SDK_VERSION = '1.6.6'
 
 android {
     compileSdkVersion 33
@@ -47,5 +47,5 @@ dependencies {
     implementation "com.squareup.sdk.in-app-payments:card-entry:$sqipVersion"
     implementation "com.squareup.sdk.in-app-payments:google-pay:$sqipVersion"
     implementation "com.squareup.sdk.in-app-payments:buyer-verification:$sqipVersion"
-    implementation 'com.google.android.gms:play-services-wallet:16.0.1'
+    implementation 'com.google.android.gms:play-services-wallet:17.0.0'
 }

android/src/main/java/sqip/react/CardEntryModule.java

@@ -301,7 +301,8 @@ private BuyerAction getBuyerAction(final String buyerActionString, final Money m
   private long readCardEntryCloseExitAnimationDurationMs() {
     long delayDurationMs = 0;
     Resources.Theme theme = Objects.requireNonNull(getCurrentActivity()).getResources().newTheme();
-    theme.applyStyle(R.style.sqip_Theme_CardEntry, true);
+    // broken with RN 0.73, see: https://github.com/square/in-app-payments-react-native-plugin/issues/229
+    // theme.applyStyle(R.style.sqip_Theme_CardEntry, true);
     int[] attrs = { android.R.attr.activityCloseExitAnimation };
     TypedArray typedArray = theme.obtainStyledAttributes(null, attrs, android.R.attr.windowAnimationStyle, 0);
     int resId = typedArray.getResourceId(0, -1);

app.plugin.js

@@ -0,0 +1 @@
+module.exports = require("./plugin/build");

docs/enable-applepay.md

@@ -4,22 +4,45 @@ This guide walks you through the process of enabling the Apple Pay digital walle
 for an app that uses the **React Native plugin for the Square [In-App Payments SDK]**. See the [React Native plugin Technical Reference](reference.md)
 for more detailed information about the [Apple Pay] methods available.
 
-**Apple Pay** can only be used on iOS devices. You must [set up Apple Pay requirements] and [enable Apple Pay] in the `ios/myRNInAppPaymentsSample` React Native project before using Apple Pay in this app. 
+**Apple Pay** can only be used on iOS devices. You must [set up Apple Pay requirements] and [enable Apple Pay] in the `ios/myRNInAppPaymentsSample` React Native project before using Apple Pay in this app.
+
+Alternatively, if you're using Expo, you can utilize the built-in config plugin to automatically configure the Apple Pay Merchant ID in your iOS project.
+
+Add the following to your `app.json`:
+
+```json
+{
+  "expo": {
+    ...
+    "plugins": [
+      [
+        "react-native-square-in-app-payments",
+        {
+          "merchantIdentifier": string | string [],
+        }
+      ]
+    ],
+  }
+}
+```
 
 ## Before you start
 
-* If you haven't already created a React Native project with In-App Payments SDK, use the [Getting Started with the React Native Plugin for In-App Payments SDK](get-started.md) to 
-set up a React Native project .
+- If you haven't already created a React Native project with In-App Payments SDK, use the [Getting Started with the React Native Plugin for In-App Payments SDK](get-started.md) to
+  set up a React Native project .
 
 ## Process overview
 
-* [Step 1: Upload an Apple Pay certificate to the Square Developer Portal](#step-1-upload-an-apple-pay-certificate-to-the-square-developer-portal)
-* [Step 2: Initialize Apple Pay and verify Apple Pay support](#step-2-initialize-apple-pay-and-verify-apple-pay-support)
-* [Step 3: Authorize payment with Apple Pay and get payment authorization result](#step-3-authorize-payment-with-apple-pay-and-get-payment-authorization-result)
+- [Enable Apple Pay with the React Native Plugin for In-App Payments SDK](#enable-apple-pay-with-the-react-native-plugin-for-in-app-payments-sdk)
+  - [Before you start](#before-you-start)
+  - [Process overview](#process-overview)
+  - [Step 1: Upload an Apple Pay certificate to the Square Developer Portal](#step-1-upload-an-apple-pay-certificate-to-the-square-developer-portal)
+  - [Step 2: Initialize Apple Pay and verify Apple Pay support](#step-2-initialize-apple-pay-and-verify-apple-pay-support)
+  - [Step 3: Authorize payment with Apple Pay and get payment authorization result](#step-3-authorize-payment-with-apple-pay-and-get-payment-authorization-result)
 
 ## Step 1: Upload an Apple Pay certificate to the Square Developer Portal
 
-To [add an Apple Pay payment processing certificate] in the **Apple Developer Portal**, 
+To [add an Apple Pay payment processing certificate] in the **Apple Developer Portal**,
 you must first obtain a Certificate Signing
 Request (CSR) from Square. The [Square Application Dashboard]
 provides a CSR file that can be submitted to Apple:
@@ -31,7 +54,7 @@ provides a CSR file that can be submitted to Apple:
 
 ## Step 2: Initialize Apple Pay and verify Apple Pay support
 
-Add code to initialize Apple Pay in your application State class. 
+Add code to initialize Apple Pay in your application State class.
 
 ```javascript
 import {
@@ -62,9 +85,10 @@ export default class App extends Component {
 }
 ```
 
-* Replace `REPLACE_WITH_APPLE_PAY_MERCHANT_ID` in this example with a valid apple pay merchant ID.
+- Replace `REPLACE_WITH_APPLE_PAY_MERCHANT_ID` in this example with a valid apple pay merchant ID.
 
 ## Step 3: Authorize payment with Apple Pay and get payment authorization result
+
 Open the Apple Pay sheet and request the user's authorization of the payment. On authorization, a
 payment nonce is returned in `onApplePayNonceRequestSuccess`.
 
@@ -160,19 +184,19 @@ export default class App extends Component {
   }
 }
 ```
+
 ---
+
 **Note:** the `chargeCard` method in this example shows a typical REST request on a backend process
 that uses the **Payments API** to take a payment with the supplied nonce.
 See [BackendQuickStart Sample] to learn about building an app that processes payment nonces on a server.
 
-
-
 [//]: # "Link anchor definitions"
-[In-App Payments SDK]: https://developer.squareup.com/docs/in-app-payments-sdk/what-it-does
-[root README]: ../README.md
-[Apple Pay]: https://developer.apple.com/documentation/passkit/apple_pay
-[add an Apple Pay payment processing certificate]: https://help.apple.com/developer-account/#/devb2e62b839?sub=devf31990e3f
-[Square Application Dashboard]: https://connect.squareup.com/apps/
-[set up Apple Pay requirements]: https://developer.apple.com/documentation/passkit/apple_pay/setting_up_apple_pay_requirements
-[enable Apple Pay]: https://help.apple.com/xcode/mac/9.3/#/deva43983eb7?sub=dev44ce8ef13
-[BackendQuickStart Sample]: https://github.com/square/in-app-payments-server-quickstart
+[in-app payments sdk]: https://developer.squareup.com/docs/in-app-payments-sdk/what-it-does
+[root readme]: ../README.md
+[apple pay]: https://developer.apple.com/documentation/passkit/apple_pay
+[add an apple pay payment processing certificate]: https://help.apple.com/developer-account/#/devb2e62b839?sub=devf31990e3f
+[square application dashboard]: https://connect.squareup.com/apps/
+[set up apple pay requirements]: https://developer.apple.com/documentation/passkit/apple_pay/setting_up_apple_pay_requirements
+[enable apple pay]: https://help.apple.com/xcode/mac/9.3/#/deva43983eb7?sub=dev44ce8ef13
+[backendquickstart sample]: https://github.com/square/in-app-payments-server-quickstart

docs/enable-googlepay.md

@@ -8,70 +8,99 @@ for more detailed information about the Google Pay methods available.
 
 ## Before you start
 
-* If you haven't already created a React Native project with In-App Payments SDK, use the [Getting Started with the React Native Plugin for In-App Payments SDK](get-started.md) to 
-set up a React Native project .
-
+- If you haven't already created a React Native project with In-App Payments SDK, use the [Getting Started with the React Native Plugin for In-App Payments SDK](get-started.md) to
+  set up a React Native project .
 
 ## Process overview
 
-* [Step 1: Update the AndroidManifiest](#step-1-update-the-androidmanifiest)
-* [Step 2: Initialize Google Pay](#step-2-initialize-google-pay)
-* [Step 3: Implement the Google Pay flow](#step-3-implement-the-google-pay-flow)
+- [Enable Google Pay with the React Native Plugin for In-App Payments SDK](#enable-google-pay-with-the-react-native-plugin-for-in-app-payments-sdk)
+  - [Before you start](#before-you-start)
+  - [Process overview](#process-overview)
+  - [Step 1: Update the Android Manifiest](#step-1-update-the-android-manifiest)
+  - [Step 1a: Update the Android Manifiest (Expo)](#step-1a-update-the-android-manifiest-expo)
+  - [Step 2: Initialize Google Pay](#step-2-initialize-google-pay)
+  - [Step 3: Implement the Google Pay flow](#step-3-implement-the-google-pay-flow)
 
 ## Step 1: Update the Android Manifiest
 
 1. Open the `myRNInAppPaymentsSample/android/app/src/main/AndroidManifest.xml`
 2. Add the following `meta-data` element inside of the `application` element of the manifest:
 
-    ```xml
-    <meta-data
-        android:name="com.google.android.gms.wallet.api.enabled"
-        android:value="true" />
-    ```
+   ```xml
+   <meta-data
+       android:name="com.google.android.gms.wallet.api.enabled"
+       android:value="true" />
+   ```
 
-## Step 2: Initialize Google Pay
+## Step 1a: Update the Android Manifiest (Expo)
 
-1. Add code to initialize Google Pay in your application State class. 
-    ```javascript
-    import {
-      ...
-      Platform,
-    } from 'react-native';
-    import {
-      SQIPCore,
-      SQIPCardEntry,
-    } from 'react-native-square-in-app-payments';
-
-    export default class App extends Component {
-      ...
-      async componentDidMount() {
-        ...
-        let digitalWalletEnabled = false;
-        if (Platform.OS === 'ios') {
-        ...
-        } else if (Platform.OS === 'android') {
-          await SQIPGooglePay.initializeGooglePay(
-            'REPLACE_WITH_SQUARE_LOCATION_ID',
-            SQIPGooglePay.EnvironmentTest);
-          try {
-            digitalWalletEnabled = await SQIPGooglePay.canUseGooglePay();
-          } catch (ex) {
-            // Handle InAppPaymentsException
-          }
+Alternatively, if you're using Expo, you can utilize the built-in config plugin to automatically configure this for you.
+
+Add the following to your `app.json`:
+
+```json
+{
+  "expo": {
+    ...
+    "plugins": [
+      [
+        "react-native-square-in-app-payments",
+        {
+          "merchantIdentifier": string | string [],
+          "enableGooglePay": boolean
         }
+      ]
+    ],
+  }
+}
+```
 
-        this.setState({
-          canUseDigitalWallet: digitalWalletEnabled,
-        });
-      }
-      ...
-    }
-    ```
-1. Replace `REPLACE_WITH_SQUARE_LOCATION_ID` in this example with a valid Square location ID. 
-The available location IDs for a Square account can be found on the Locations tab 
-of the Square Developer Portal.
+## Step 2: Initialize Google Pay
+
+1. Add code to initialize Google Pay in your application State class.
+
+   ```javascript
+   import {
+     ...
+     Platform,
+   } from 'react-native';
+   import {
+     SQIPCore,
+     SQIPCardEntry,
+   } from 'react-native-square-in-app-payments';
+
+   export default class App extends Component {
+     ...
+     async componentDidMount() {
+       ...
+       let digitalWalletEnabled = false;
+       if (Platform.OS === 'ios') {
+       ...
+       } else if (Platform.OS === 'android') {
+         await SQIPGooglePay.initializeGooglePay(
+           'REPLACE_WITH_SQUARE_LOCATION_ID',
+           SQIPGooglePay.EnvironmentTest);
+         try {
+           digitalWalletEnabled = await SQIPGooglePay.canUseGooglePay();
+         } catch (ex) {
+           // Handle InAppPaymentsException
+         }
+       }
+
+       this.setState({
+         canUseDigitalWallet: digitalWalletEnabled,
+       });
+     }
+     ...
+   }
+   ```
+
+1. Replace `REPLACE_WITH_SQUARE_LOCATION_ID` in this example with a valid Square location ID.
+   The available location IDs for a Square account can be found on the Locations tab
+   of the Square Developer Portal.
 
 ## Step 3: Implement the Google Pay flow
+
 ```javascript
 export default class App extends Component {
   constructor() {
@@ -153,21 +182,23 @@ export default class App extends Component {
   }
 }
 ```
+
 ---
+
 **Note:** the `chargeCard` method in this example shows a typical REST request on a backend process
 that uses the **Payments API** to take a payment with the supplied nonce.
 See [BackendQuickStart Sample] to learn about building an app that processes payment nonces on a server.
 
 [//]: # "Link anchor definitions"
-[In-App Payments SDK]: https://developer.squareup.com/docs/in-app-payments-sdk/what-it-does
-[Square Dashboard]: https://squareup.com/dashboard/
-[Testing Mobile Apps]: https://developer.squareup.com/docs/testing/mobile
+[in-app payments sdk]: https://developer.squareup.com/docs/in-app-payments-sdk/what-it-does
+[square dashboard]: https://squareup.com/dashboard/
+[testing mobile apps]: https://developer.squareup.com/docs/testing/mobile
 [squareup.com/activate]: https://squareup.com/activate
-[Square Application Dashboard]: https://connect.squareup.com/apps/
-[root README]: ../README.md
-[React Native Getting Started]: https://facebook.github.io/react-native/docs/getting-started.html
-[Google Pay]: https://developers.google.com/pay/api/android/overview
-[Google Pay methods]: https://developers.google.com/pay/api/android/reference/client
-[Google Pay objects]: https://developers.google.com/pay/api/android/reference/object 
-[BackendQuickStart Sample]: https://github.com/square/in-app-payments-server-quickstart
+[square application dashboard]: https://connect.squareup.com/apps/
+[root readme]: ../README.md
+[react native getting started]: https://facebook.github.io/react-native/docs/getting-started.html
+[google pay]: https://developers.google.com/pay/api/android/overview
+[google pay methods]: https://developers.google.com/pay/api/android/reference/client
+[google pay objects]: https://developers.google.com/pay/api/android/reference/object
+[backendquickstart sample]: https://github.com/square/in-app-payments-server-quickstart
 [add a card or payment account]: https://support.google.com/pay/answer/7625139?visit_id=636775920124642581-1648826871&rd=1

package.json

@@ -11,7 +11,12 @@
   "scripts": {
     "lint": "eslint ./ --ext .js,.ts",
     "test": "jest",
-    "test-coverage": "jest --collectCoverage"
+    "test-coverage": "jest --collectCoverage",
+    "build": "expo-module build",
+    "clean": "expo-module clean",
+    "prepare": "expo-module prepare",
+    "prepublishOnly": "expo-module prepublishOnly",
+    "expo-module": "expo-module"
   },
   "keywords": [
     "react-native",
@@ -22,11 +27,11 @@
   "author": "Square, Inc.",
   "license": "Apache-2.0",
   "devDependencies": {
+    "@expo/config-types": "^47.0.0",
     "@types/jest": "^26.0.23",
     "@types/node": "^17.0.23",
     "@types/react": "^17.0.11",
     "@types/react-native": "^0.64.10",
-    "@types/react-test-renderer": "^17.0.1",
     "@typescript-eslint/eslint-plugin": "^4.29.2",
     "babel-eslint": "^10.1.0",
     "babel-jest": "27.0.1",
@@ -37,16 +42,23 @@
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.24.0",
     "eslint-plugin-react-native": "^3.11.0",
+    "expo": "^49.0.18",
+    "expo-module-scripts": "3.1.0",
     "jest": "^27.0.6",
     "metro-react-native-babel-preset": "0.56.0",
-    "react": "^17.0.2",
-    "react-native": "0.64.1",
-    "react-test-renderer": "16.9.0",
+    "react": "18.0.0",
+    "react-native": "0.69.2",
     "ts-jest": "^27.0.3",
-    "typescript": "^4.3.5"
+    "typescript": "^5.2.2"
   },
   "peerDependencies": {
-    "react-native": ">= 0.57.8"
+    "expo": ">=47.0.0",
+    "react-native": "*"
+  },
+  "peerDependenciesMeta": {
+    "expo": {
+      "optional": true
+    }
   },
   "jest": {
     "preset": "react-native",