From 7e17dfa3a89a79fb097f6495dfe7a45d1580d4f3 Mon Sep 17 00:00:00 2001
From: ctapang <carlos.tapang@rockstable.io>
Date: Mon, 11 Dec 2023 01:49:16 -0800
Subject: [PATCH] Separate button from redirect component

---
 package.json  | 2 +-
 src/index.tsx | 7 +++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 7fe317f..2a9d35b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@sendroks/react-coinbase-commerce",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "A react component to easily embed a Coinbase Commerce Checkout within your application",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
diff --git a/src/index.tsx b/src/index.tsx
index e4de70a..e2edddf 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -83,14 +83,17 @@ export class CoinbaseCommerceButton extends Component<Props & ButtonHTMLAttribut
     }
 
     return (
-      <div style={wrapperStyle} onClick={()=>this.onClick()}>
-        {showModal && (
+      <div style={wrapperStyle}>
+        {showModal ? (
           <Commerce
             {...CommerceProps}
             onModalClose={() => { this.onModalClose() }}
             onError={(data: MessageData) => { this.handleError(data) }}
             customMetadata={customMetadata}
           />
+        )
+        : (
+          <input type="button" onClick={()=>this.onClick()} />
         )}
       </div>
     )