usePayPalButtons hook with appswitch

.changeset/fair-panthers-teach.md

@@ -0,0 +1,5 @@
+---
+"@paypal/react-paypal-js": minor
+---
+
+expose appswitch via usePayPalButtons hook

packages/react-paypal-js/.eslintrc.json

@@ -44,6 +44,18 @@
                 ],
                 "newlines-between": "always"
             }
+        ],
+        "@typescript-eslint/no-unused-vars": [
+            "error",
+            {
+                "args": "all",
+                "argsIgnorePattern": "^_",
+                "caughtErrors": "all",
+                "caughtErrorsIgnorePattern": "^_",
+                "destructuredArrayIgnorePattern": "^_",
+                "varsIgnorePattern": "^_",
+                "ignoreRestSiblings": true
+            }
         ]
     },
     "overrides": [

packages/react-paypal-js/src/components/PayPalButtons.tsx

@@ -3,11 +3,11 @@ import React, { useEffect, useRef, useState } from "react";
 import { usePayPalScriptReducer } from "../hooks/scriptProviderHooks";
 import { getPayPalWindowNamespace, generateErrorMessage } from "../utils";
 import { SDK_SETTINGS } from "../constants";
+import { useProxyProps } from "../hooks/useProxyProps";
 
 import type { FunctionComponent } from "react";
 import type { PayPalButtonsComponent, OnInitActions } from "@paypal/paypal-js";
 import type { PayPalButtonsComponentProps } from "../types";
-import { useProxyProps } from "../hooks/useProxyProps";
 
 /**
 This `<PayPalButtons />` component supports rendering [buttons](https://developer.paypal.com/docs/business/javascript-sdk/javascript-sdk-reference/#buttons) for PayPal, Venmo, and alternative payment methods.

packages/react-paypal-js/src/components/braintree/utils.test.ts

@@ -52,7 +52,7 @@ describe("decorateActions", () => {
             createOrder: jest
                 .fn()
                 .mockImplementation(
-                    (data, actions) => actions.braintree.create !== undefined,
+                    (_data, actions) => actions.braintree.create !== undefined,
                 ),
         };
 
@@ -85,7 +85,7 @@ describe("decorateActions", () => {
             createBillingAgreement: jest
                 .fn()
                 .mockImplementation(
-                    (data, actions) =>
+                    (_data, actions) =>
                         actions.braintree.createBillingAgreement !== undefined,
                 ),
         };
@@ -123,7 +123,7 @@ describe("decorateActions", () => {
             onApprove: jest
                 .fn()
                 .mockImplementation(
-                    (data, actions) => actions.braintree.create !== undefined,
+                    (_data, actions) => actions.braintree.create !== undefined,
                 ),
         };
 

packages/react-paypal-js/src/core/buttons/api.ts

@@ -0,0 +1,53 @@
+import { PayPalButtonsComponent } from "@paypal/paypal-js";
+import { ComponentType } from "react";
+
+import { PayPalButtonsComponentProps } from "../../types";
+
+interface Options {
+    handleUpdate?: (options: Options) => void;
+    instance?: PayPalButtonsComponent & {
+        hasReturned: () => boolean;
+        resume: () => void;
+    };
+}
+
+interface IButtonsAPI {
+    Buttons: ComponentType<ButtonsComponentProps>;
+    isEligible?: PayPalButtonsComponent["isEligible"];
+    hasReturned?: PayPalButtonsComponent["hasReturned"];
+    resume?: PayPalButtonsComponent["resume"];
+}
+
+export interface ButtonsComponentProps {
+    disabled?: boolean;
+    className?: string;
+}
+
+export class ButtonsAPI implements IButtonsAPI {
+    Buttons: React.ComponentType<PayPalButtonsComponentProps> = () => null;
+    options: Options;
+
+    constructor(options: Options) {
+        this.options = options;
+    }
+
+    get isEligible(): PayPalButtonsComponent["isEligible"] | undefined {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        return this.options.instance?.isEligible;
+    }
+
+    get hasReturned(): PayPalButtonsComponent["hasReturned"] | undefined {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        return this.options.instance?.hasReturned;
+    }
+
+    get resume(): PayPalButtonsComponent["resume"] | undefined {
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        return this.options.instance?.resume;
+    }
+
+    _update(options: Partial<Options>): void {
+        this.options = { ...this.options, ...options };
+        this.options.handleUpdate?.(this.options);
+    }
+}