react-paystack - npm Package Compare versions

Comparing version 2.0.0 to 2.0.1

distribution/paystack.min.js

@@ -39,9 +39,3 @@ "use strict";
       class: _this.props.class || _this.props.className || "",
-      metadata: _this.props.metadata || {},
       currency: _this.props.currency || "NGN",
-      plan: _this.props.plan || "",
-      quantity: _this.props.quantity || "",
-      subaccount: _this.props.subaccount || "",
-      transaction_charge: _this.props.transaction_charge || 0,
-      bearer: _this.props.bearer || "",
       disabled: _this.props.disabled || false
@@ -101,3 +95,3 @@ };
           ref: _this3.props.reference,
-          metadata: _this3.state.metadata,
+          metadata: _this3.props.metadata || {},
           callback: function callback(response) {
@@ -110,7 +104,7 @@ _this3.props.callback(response);
           currency: _this3.state.currency,
-          plan: _this3.state.plan,
-          quantity: _this3.state.quantity,
-          subaccount: _this3.state.subaccount,
-          transaction_charge: _this3.state.transaction_charge,
-          bearer: _this3.state.bearer
+          plan: _this3.props.plan || "",
+          quantity: _this3.props.quantity || "",
+          subaccount: _this3.props.subaccount || "",
+          transaction_charge: _this3.props.transaction_charge || 0,
+          bearer: _this3.props.bearer || ""
         };
@@ -129,9 +123,10 @@ if (_this3.props.embed) {
     value: function render() {
+      var CustomTag = "" + this.props.tag;
+
       return this.props.embed ? _react2.default.createElement("div", { id: "paystackEmbedContainer" }) : _react2.default.createElement(
-        "span",
+        _react.Fragment,
         null,
         _react2.default.createElement(
-          "button",
+          CustomTag,
           {
-            type: "button",
             className: this.state.class,
@@ -167,7 +162,12 @@ onClick: this.payWithPaystack,
   close: _propTypes2.default.func.isRequired,
-  disabled: _propTypes2.default.bool
+  disabled: _propTypes2.default.bool,
+  tag: _propTypes2.default.oneOf(['button', 'a', 'input'])
 };
 
+PayStack.defaultProps = {
+  tag: 'button'
+};
+
 exports.default = PayStack;
 
 //# sourceMappingURL=paystack.min.js.map

package.json

 {
   "name": "react-paystack",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "This is an reactJS library for implementing paystack payment gateway",
@@ -5,0 +5,0 @@ "main": "distribution/paystack.min.js",

README.md

@@ -15,3 +15,3 @@ # react-paystack
 ```
-npm install react-paystack --save 
+npm install react-paystack --save
 ```
@@ -25,5 +25,5 @@
     import PaystackButton from 'react-paystack';
-    
+
     class App extends Component {
-    
+
     	state = {
@@ -34,22 +34,22 @@ key: "pk_test_########################################", //PAYSTACK PUBLIC KEY
     	}
-    
+
     	callback = (response) => {
     		console.log(response); // card charged successfully, get reference here
     	}
-    
+
     	close = () => {
     		console.log("Payment closed");
     	}
-    
+
     	getReference = () => {
     		//you can put any unique reference implementation code here
     		let text = "";
-    		let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-.=";
-    
+        let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-.=";
+
     		for( let i=0; i < 15; i++ )
     			text += possible.charAt(Math.floor(Math.random() * possible.length));
-    
+
     		return text;
     	}
-    
+
       render() {
@@ -70,2 +70,3 @@ return (
                 paystackkey={this.state.key}
+                tag="button"{/*it can be button or a or input tag */}
               />
@@ -77,3 +78,3 @@ </p>
     }
-    
+
     export default App;
@@ -80,0 +81,0 @@ ```

src/PayStack.js

@@ -1,2 +0,2 @@
-import React, { Component } from "react";
+import React, { Component, Fragment } from "react";
 import PropTypes from "prop-types";
@@ -13,9 +13,3 @@
       class: this.props.class || this.props.className || "",
-      metadata: this.props.metadata || {},
       currency: this.props.currency || "NGN",
-      plan: this.props.plan || "",
-      quantity: this.props.quantity || "",
-      subaccount: this.props.subaccount || "",
-      transaction_charge: this.props.transaction_charge || 0,
-      bearer: this.props.bearer || "",
       disabled: this.props.disabled || false
@@ -73,3 +67,3 @@ };
           ref: this.props.reference,
-          metadata: this.state.metadata,
+          metadata: this.props.metadata || {},
           callback: response => {
@@ -82,7 +76,7 @@ this.props.callback(response);
           currency: this.state.currency,
-          plan: this.state.plan,
-          quantity: this.state.quantity,
-          subaccount: this.state.subaccount,
-          transaction_charge: this.state.transaction_charge,
-          bearer: this.state.bearer
+          plan: this.props.plan || "",
+          quantity: this.props.quantity || "",
+          subaccount: this.props.subaccount || "",
+          transaction_charge: this.props.transaction_charge || 0,
+          bearer: this.props.bearer || "",
         };
@@ -100,8 +94,9 @@ if (this.props.embed) {
   render() {
+    const CustomTag = `${this.props.tag}`;
+
     return this.props.embed ? (
       <div id="paystackEmbedContainer" />
     ) : (
-      <span>
-        <button
-          type="button"
+      <Fragment>
+        <CustomTag
           className={this.state.class}
@@ -112,4 +107,4 @@ onClick={this.payWithPaystack}
           {this.state.text}
-        </button>
-      </span>
+        </CustomTag>
+      </Fragment>
     );
@@ -136,5 +131,10 @@ }
   close: PropTypes.func.isRequired,
-  disabled: PropTypes.bool
+  disabled: PropTypes.bool,
+  tag: PropTypes.oneOf(['button', 'a', 'input']),
 };
 
+PayStack.defaultProps = {
+  tag: 'button',
+};
+
 export default PayStack;

test/components/Paystack.spec.js

@@ -19,16 +19,2 @@ import React from "react";
 describe("Paystack Component", () => {
-  it("Paystack component renders span", () => {
-    const PaystackWrapper = mount(
-      <Paystack
-        reference={reference}
-        email={email}
-        amount={amount}
-        close={close}
-        text={btnText}
-        callback={callback}
-        paystackkey={key}
-      />
-    );
-    expect(PaystackWrapper.find("span")).to.have.length(1);
-  });
 
@@ -45,2 +31,3 @@ it("Paystack renders button", () => {
         paystackkey={key}
+        tag="button"
       />
@@ -61,2 +48,3 @@ );
         paystackkey={key}
+        tag="button"
       />
@@ -67,3 +55,3 @@ );
 
-  it("should have an initial text, currency, transaction_charge and disabled state", () => {
+  it("should have an initial text, currency and disabled state", () => {
     const PaystackWrapper = mount(
@@ -75,17 +63,15 @@ <Paystack
         close={close}
-        text={btnText}
         callback={callback}
         paystackkey={key}
+        tag="button"
       />
     );
     const {
-      plan,
       currency,
       disabled,
-      transaction_charge
+      text
     } = PaystackWrapper.state();
-    expect(plan).to.be.empty;
     expect(currency).to.equal("NGN");
+    expect(text).to.equal("Make Payment");
     expect(disabled).to.be.false;
-    expect(transaction_charge).to.equal(0);
   });
@@ -103,2 +89,3 @@
         paystackkey={key}
+        tag="button"
       />
@@ -105,0 +92,0 @@ );

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

101

increased by1%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

375325

decreased by-0.18%

Lines of code

450

decreased by-3.64%

No dependency changes