From b5e64805839e9bcd4fb90a6570de6ebcdeaf31e2 Mon Sep 17 00:00:00 2001
From: Jonathan Wohl <jon@jonwohl.com>
Date: Mon, 21 Mar 2022 10:02:06 -0400
Subject: [PATCH 1/2] Add className pass-thru

Add react 17 as peer dep
---
 README.md                      | 1 +
 package.json                   | 2 +-
 src/components/UploadWidget.js | 2 ++
 src/components/WidgetButton.js | 3 ++-
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 3c50fa5..5a1796f 100644
--- a/README.md
+++ b/README.md
@@ -39,6 +39,7 @@ const Example = () => {
               borderRadius: '4px',
               height: '25px'
             }} // inline styling only or style id='cloudinary_upload_button'
+        className="border-gray-200 border-radius-5" // add classes to the button
         folder={'my_folder'} // set cloudinary folder name to send file
         cropping={false} // set ability to crop images -> default = true
         // https://support.cloudinary.com/hc/en-us/articles/203062071-How-to-crop-images-via-the-Upload-Widget-#:~:text=Click%20on%20the%20%22Edit%22%20link,OK%22%20and%20Save%20the%20changes.
diff --git a/package.json b/package.json
index 8c1e662..4e59ef5 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "deploy": "gh-pages -d example/build"
   },
   "peerDependencies": {
-    "react": "^16.9.0",
+    "react": "^16.9.0 || ^17.0.0",
     "axios": "^0.20.0"
   },
   "devDependencies": {
diff --git a/src/components/UploadWidget.js b/src/components/UploadWidget.js
index ea7e5c2..15a1255 100644
--- a/src/components/UploadWidget.js
+++ b/src/components/UploadWidget.js
@@ -11,6 +11,7 @@ const UploadWidget = ({
   buttonText = null,
   style = null,
   widgetStyles = null,
+  className = '',
   folder = null,
   cropping = true,
   generateSignatureUrl,
@@ -66,6 +67,7 @@ const UploadWidget = ({
       buttonText={buttonText}
       buttonType={buttonType}
       style={style}
+      className={className}
     />
   )
 }
diff --git a/src/components/WidgetButton.js b/src/components/WidgetButton.js
index ad50170..0339980 100644
--- a/src/components/WidgetButton.js
+++ b/src/components/WidgetButton.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const WidgetButton = ({ myWidgetFunction, style, buttonText, buttonType }) => (
+const WidgetButton = ({ myWidgetFunction, style, className = '', buttonText, buttonType }) => (
   <>
     <button
       type={buttonType}
@@ -15,6 +15,7 @@ const WidgetButton = ({ myWidgetFunction, style, buttonText, buttonType }) => (
           height: '25px'
         }
       }
+      className={className}
       onClick={() => myWidgetFunction()}
     >
       {buttonText || 'Upload files'}

From 0ea4c3419f61b05bff2db6dc84942c43667c7fa0 Mon Sep 17 00:00:00 2001
From: Jonathan Wohl <jon@jonwohl.com>
Date: Wed, 30 Mar 2022 09:19:43 -0500
Subject: [PATCH 2/2] Add disabled option to button

---
 src/components/UploadWidget.js | 2 ++
 src/components/WidgetButton.js | 3 ++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/UploadWidget.js b/src/components/UploadWidget.js
index 15a1255..8f645ff 100644
--- a/src/components/UploadWidget.js
+++ b/src/components/UploadWidget.js
@@ -12,6 +12,7 @@ const UploadWidget = ({
   style = null,
   widgetStyles = null,
   className = '',
+  disabled = false,
   folder = null,
   cropping = true,
   generateSignatureUrl,
@@ -68,6 +69,7 @@ const UploadWidget = ({
       buttonType={buttonType}
       style={style}
       className={className}
+      disabled={disabled}
     />
   )
 }
diff --git a/src/components/WidgetButton.js b/src/components/WidgetButton.js
index 0339980..da81598 100644
--- a/src/components/WidgetButton.js
+++ b/src/components/WidgetButton.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-const WidgetButton = ({ myWidgetFunction, style, className = '', buttonText, buttonType }) => (
+const WidgetButton = ({ myWidgetFunction, style, className = '', disabled, buttonText, buttonType }) => (
   <>
     <button
       type={buttonType}
@@ -16,6 +16,7 @@ const WidgetButton = ({ myWidgetFunction, style, className = '', buttonText, but
         }
       }
       className={className}
+      disabled={disabled}
       onClick={() => myWidgetFunction()}
     >
       {buttonText || 'Upload files'}