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..8f645ff 100644 --- a/src/components/UploadWidget.js +++ b/src/components/UploadWidget.js @@ -11,6 +11,8 @@ const UploadWidget = ({ buttonText = null, style = null, widgetStyles = null, + className = '', + disabled = false, folder = null, cropping = true, generateSignatureUrl, @@ -66,6 +68,8 @@ const UploadWidget = ({ buttonText={buttonText} buttonType={buttonType} style={style} + className={className} + disabled={disabled} /> ) } diff --git a/src/components/WidgetButton.js b/src/components/WidgetButton.js index ad50170..da81598 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 = '', disabled, buttonText, buttonType }) => ( <>