@depay/widgets 7.14.4 → 7.15.2

package/dist/umd/index.js

@@ -18879,7 +18879,7 @@
     };
 
     var _useContext = React.useContext(ConfigurationContext),
-        amountConfiguration = _useContext.amount;
+        configuredAmount = _useContext.amount;
         _useContext.toAmount;
         var recover = _useContext.recover;
 
@@ -18903,21 +18903,21 @@
         acceptWithAmount = _useState4[0],
         setAcceptWithAmount = _useState4[1];
 
-    var _useState5 = React.useState(_typeof(amountConfiguration) == 'object' && amountConfiguration.fix && amountConfiguration.currency ? amountConfiguration.fix : null),
+    var _useState5 = React.useState(_typeof(configuredAmount) == 'object' && configuredAmount.fix && configuredAmount.currency ? configuredAmount.fix : null),
         _useState6 = _slicedToArray(_useState5, 1),
         fixedAmount = _useState6[0];
 
-    var _useState7 = React.useState(_typeof(amountConfiguration) == 'object' && amountConfiguration.fix && amountConfiguration.currency ? amountConfiguration.currency : null),
+    var _useState7 = React.useState(_typeof(configuredAmount) == 'object' && configuredAmount.fix && configuredAmount.currency ? configuredAmount.currency : null),
         _useState8 = _slicedToArray(_useState7, 1),
         fixedCurrency = _useState8[0];
 
     var startAmount;
 
     if (amountsMissing) {
-      if (_typeof(amountConfiguration) == "object" && amountConfiguration.start && amountConfiguration.start) {
-        startAmount = amountConfiguration.start;
-      } else if (_typeof(amountConfiguration) == "object" && amountConfiguration.fix) {
-        startAmount = amountConfiguration.fix;
+      if (_typeof(configuredAmount) == "object" && configuredAmount.start && configuredAmount.start) {
+        startAmount = configuredAmount.start;
+      } else if (_typeof(configuredAmount) == "object" && configuredAmount.fix) {
+        startAmount = configuredAmount.fix;
       } else {
         startAmount = 1;
       }
@@ -18951,7 +18951,7 @@
           conversionRate = _ref.conversionRate,
           fixedCurrencyConversionRate = _ref.fixedCurrencyConversionRate;
       return new Promise(function (resolve, reject) {
-        if (amountConfiguration && amountConfiguration.token) {
+        if (configuredAmount && configuredAmount.token) {
           resolve(props.accept.map(function () {
             return amount;
           }));
@@ -19046,7 +19046,7 @@
     React.useEffect(function () {
       if (amountsMissing && maxRoute) {
         maxRoute.fromToken.readable(maxRoute.fromBalance).then(function (readableMaxAmount) {
-          if (amountConfiguration && amountConfiguration.token) {
+          if (configuredAmount && configuredAmount.token) {
             web3Exchanges.route({
               blockchain: maxRoute.blockchain,
               tokenIn: maxRoute.fromToken.address,
@@ -20131,8 +20131,15 @@
     var _useContext3 = React.useContext(UpdatableContext),
         updatable = _useContext3.updatable;
 
-    var _useContext4 = React.useContext(PaymentContext),
-        payment = _useContext4.payment;
+    var _useContext4 = React.useContext(ConfigurationContext),
+        configuredAmount = _useContext4.amount,
+        currencyCode = _useContext4.currencyCode;
+
+    var _useContext5 = React.useContext(ChangableAmountContext),
+        amount = _useContext5.amount;
+
+    var _useContext6 = React.useContext(PaymentContext),
+        payment = _useContext6.payment;
 
     var _useState = React.useState(),
         _useState2 = _slicedToArray(_useState, 2),
@@ -20141,16 +20148,21 @@
 
     var _useState3 = React.useState(),
         _useState4 = _slicedToArray(_useState3, 2),
-        paymentValueLoss = _useState4[0],
-        setPaymentValueLoss = _useState4[1];
+        displayedPaymentValue = _useState4[0],
+        setDisplayedPaymentValue = _useState4[1];
 
-    var _useContext5 = React.useContext(ConfigurationContext),
-        currency = _useContext5.currency;
-
-    var _useState5 = React.useState(0),
+    var _useState5 = React.useState(),
         _useState6 = _slicedToArray(_useState5, 2),
-        reloadCount = _useState6[0],
-        setReloadCount = _useState6[1];
+        paymentValueLoss = _useState6[0],
+        setPaymentValueLoss = _useState6[1];
+
+    var _useContext7 = React.useContext(ConfigurationContext),
+        currency = _useContext7.currency;
+
+    var _useState7 = React.useState(0),
+        _useState8 = _slicedToArray(_useState7, 2),
+        reloadCount = _useState8[0],
+        setReloadCount = _useState8[1];
 
     var updatePaymentValue = function updatePaymentValue(_ref) {
       var updatable = _ref.updatable,
@@ -20217,6 +20229,20 @@
       })["catch"](setError);
     };
 
+    React.useEffect(function () {
+      if (paymentValue && amount && configuredAmount && configuredAmount.currency && configuredAmount.fix) {
+        setDisplayedPaymentValue(paymentValue.toString());
+      } else if (amount && (configuredAmount == undefined || (configuredAmount === null || configuredAmount === void 0 ? void 0 : configuredAmount.token) != true)) {
+        setDisplayedPaymentValue(new localCurrency.Currency({
+          amount: amount.toFixed(2),
+          code: currencyCode
+        }).toString());
+      } else if (paymentValue && paymentValue.toString().length && (configuredAmount === null || configuredAmount === void 0 ? void 0 : configuredAmount.token) != true) {
+        setDisplayedPaymentValue(paymentValue.toString());
+      } else if (payment) {
+        setDisplayedPaymentValue("".concat(payment.symbol, " ").concat(payment.amount));
+      }
+    }, [paymentValue, payment, amount, configuredAmount]);
     React.useEffect(function () {
       if (account && payment) {
         updatePaymentValue({
@@ -20239,7 +20265,8 @@
     return /*#__PURE__*/React__default["default"].createElement(PaymentValueContext.Provider, {
       value: {
         paymentValue: paymentValue,
-        paymentValueLoss: paymentValueLoss
+        paymentValueLoss: paymentValueLoss,
+        displayedPaymentValue: displayedPaymentValue
       }
     }, props.children);
   });
@@ -20251,12 +20278,14 @@
 
     var _useContext2 = React.useContext(ConfigurationContext),
         blacklist = _useContext2.blacklist,
+        whitelist = _useContext2.whitelist,
         fee = _useContext2.fee;
 
     return /*#__PURE__*/React__default["default"].createElement(DonationRoutingContext.Provider, {
       value: {}
     }, /*#__PURE__*/React__default["default"].createElement(PaymentRoutingProvider, {
       accept: acceptWithAmount,
+      whitelist: whitelist,
       blacklist: blacklist,
       setMaxRoute: setMaxRoute,
       fee: fee
@@ -20294,18 +20323,21 @@
         setAmount = _useContext4.setAmount,
         maxAmount = _useContext4.maxAmount;
 
+    var _useContext5 = React.useContext(PaymentValueContext);
+        _useContext5.displayedPaymentValue;
+
     var _useState = React.useState(amount),
         _useState2 = _slicedToArray(_useState, 2),
         inputAmount = _useState2[0],
         setInputAmount = _useState2[1];
 
-    var _useContext5 = React.useContext(ConfigurationContext),
-        currencyCode = _useContext5.currencyCode,
-        amountConfiguration = _useContext5.amount;
+    var _useContext6 = React.useContext(ConfigurationContext),
+        currencyCode = _useContext6.currencyCode,
+        amountConfiguration = _useContext6.amount;
 
-    var _useContext6 = React.useContext(PaymentRoutingContext);
-        _useContext6.allRoutes;
-        var setSelectedRoute = _useContext6.setSelectedRoute;
+    var _useContext7 = React.useContext(PaymentRoutingContext);
+        _useContext7.allRoutes;
+        var setSelectedRoute = _useContext7.setSelectedRoute;
 
     var min = _typeof(amountConfiguration) == "object" && amountConfiguration.min ? amountConfiguration.min : 1;
     var step = _typeof(amountConfiguration) == "object" && amountConfiguration.step ? amountConfiguration.step : 1;
@@ -20442,8 +20474,9 @@
         allRoutes = _useContext2.allRoutes,
         setSelectedRoute = _useContext2.setSelectedRoute;
 
-    var _useContext3 = React.useContext(PaymentValueContext),
-        paymentValue = _useContext3.paymentValue;
+    var _useContext3 = React.useContext(PaymentValueContext);
+        _useContext3.paymentValue;
+        var displayedPaymentValue = _useContext3.displayedPaymentValue;
 
     var _useContext4 = React.useContext(reactDialogStack.NavigateStackContext),
         navigate = _useContext4.navigate;
@@ -20528,9 +20561,9 @@
         className: "PaddingTopS PaddingLeftM PaddingRightM PaddingBottomS"
       }, /*#__PURE__*/React__default["default"].createElement("h1", {
         className: "LineHeightL FontSizeL TextCenter"
-      }, "Change Payment"), paymentValue != undefined && /*#__PURE__*/React__default["default"].createElement("div", {
+      }, "Change Payment"), displayedPaymentValue != undefined && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "FontSizeL TextCenter FontWeightBold"
-      }, /*#__PURE__*/React__default["default"].createElement("strong", null, paymentValue.toString()))),
+      }, /*#__PURE__*/React__default["default"].createElement("strong", null, displayedPaymentValue.toString()))),
       body: /*#__PURE__*/React__default["default"].createElement("div", {
         className: "MaxHeight PaddingTopXS"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -20653,41 +20686,38 @@
   });
 
   var Footer = (function () {
-    var _useContext = React.useContext(ConfigurationContext),
-        currencyCode = _useContext.currencyCode,
-        configuredAmount = _useContext.amount;
-
-    var _useContext2 = React.useContext(ChangableAmountContext),
-        amount = _useContext2.amount;
-        _useContext2.amountsMissing;
+    var _useContext = React.useContext(ChangableAmountContext);
+        _useContext.amount;
+        _useContext.amountsMissing;
 
-    var _useContext3 = React.useContext(PaymentTrackingContext),
-        tracking = _useContext3.tracking,
-        release = _useContext3.release,
-        forwardTo = _useContext3.forwardTo,
-        trackingFailed = _useContext3.trackingFailed;
+    var _useContext2 = React.useContext(PaymentTrackingContext),
+        tracking = _useContext2.tracking,
+        release = _useContext2.release,
+        forwardTo = _useContext2.forwardTo,
+        trackingFailed = _useContext2.trackingFailed;
 
-    var _useContext4 = React.useContext(PaymentContext),
-        payment = _useContext4.payment,
-        paymentState = _useContext4.paymentState,
-        pay = _useContext4.pay,
-        transaction = _useContext4.transaction,
-        approve = _useContext4.approve,
-        approvalTransaction = _useContext4.approvalTransaction;
+    var _useContext3 = React.useContext(PaymentContext),
+        payment = _useContext3.payment,
+        paymentState = _useContext3.paymentState,
+        pay = _useContext3.pay,
+        transaction = _useContext3.transaction,
+        approve = _useContext3.approve,
+        approvalTransaction = _useContext3.approvalTransaction;
 
-    var _useContext5 = React.useContext(PaymentValueContext),
-        paymentValue = _useContext5.paymentValue,
-        paymentValueLoss = _useContext5.paymentValueLoss;
+    var _useContext4 = React.useContext(PaymentValueContext);
+        _useContext4.paymentValue;
+        var displayedPaymentValue = _useContext4.displayedPaymentValue,
+        paymentValueLoss = _useContext4.paymentValueLoss;
 
-    var _useContext6 = React.useContext(PaymentRoutingContext),
-        updatedRouteWithNewPrice = _useContext6.updatedRouteWithNewPrice,
-        updateRouteWithNewPrice = _useContext6.updateRouteWithNewPrice;
+    var _useContext5 = React.useContext(PaymentRoutingContext),
+        updatedRouteWithNewPrice = _useContext5.updatedRouteWithNewPrice,
+        updateRouteWithNewPrice = _useContext5.updateRouteWithNewPrice;
 
-    var _useContext7 = React.useContext(reactDialogStack.NavigateStackContext);
-        _useContext7.navigate;
+    var _useContext6 = React.useContext(reactDialogStack.NavigateStackContext);
+        _useContext6.navigate;
 
-    var _useContext8 = React.useContext(ClosableContext),
-        close = _useContext8.close;
+    var _useContext7 = React.useContext(ClosableContext),
+        close = _useContext7.close;
 
     var trackingInfo = function trackingInfo() {
       if (tracking != true) {
@@ -20814,21 +20844,6 @@
     };
 
     var mainAction = function mainAction() {
-      var displayedAmount;
-
-      if (amount && configuredAmount && configuredAmount.currency && configuredAmount.fix) {
-        displayedAmount = paymentValue.toString();
-      } else if (amount && (configuredAmount == undefined || (configuredAmount === null || configuredAmount === void 0 ? void 0 : configuredAmount.token) != true)) {
-        displayedAmount = new localCurrency.Currency({
-          amount: amount.toFixed(2),
-          code: currencyCode
-        }).toString();
-      } else if (paymentValue && paymentValue.toString().length && (configuredAmount === null || configuredAmount === void 0 ? void 0 : configuredAmount.token) != true) {
-        displayedAmount = paymentValue.toString();
-      } else {
-        displayedAmount = "".concat(payment.symbol, " ").concat(payment.amount);
-      }
-
       if (updatedRouteWithNewPrice) {
         return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "PaddingBottomXS"
@@ -20848,7 +20863,7 @@
         }, /*#__PURE__*/React__default["default"].createElement("strong", null, "Payment token would lose ", paymentValueLoss, "% of it's value!"))), /*#__PURE__*/React__default["default"].createElement("button", {
           className: "ButtonPrimary disabled",
           onClick: function onClick() {}
-        }, "Pay ", displayedAmount));
+        }, "Pay ", displayedPaymentValue));
       } else if ((paymentState == 'initialized' || paymentState == 'approving') && payment.route) {
         return /*#__PURE__*/React__default["default"].createElement("button", {
           className: ["ButtonPrimary", payment.route.approvalRequired && !payment.route.directTransfer ? 'disabled' : ''].join(' '),
@@ -20859,7 +20874,7 @@
 
             pay();
           }
-        }, "Pay ", displayedAmount);
+        }, "Pay ", displayedPaymentValue);
       } else if (paymentState == 'paying') {
         return /*#__PURE__*/React__default["default"].createElement("a", {
           className: "ButtonPrimary",
@@ -20902,19 +20917,22 @@
   });
 
   var DonationOverviewDialog = (function (props) {
-    var _useContext = React.useContext(ConfigurationContext),
-        currencyCode = _useContext.currencyCode,
-        title = _useContext.title;
+    var _useContext = React.useContext(ConfigurationContext);
+        _useContext.currencyCode;
+        var title = _useContext.title;
 
-    var _useContext2 = React.useContext(ChangableAmountContext),
-        amount = _useContext2.amount;
+    var _useContext2 = React.useContext(ChangableAmountContext);
+        _useContext2.amount;
 
     var _useContext3 = React.useContext(PaymentContext),
         payment = _useContext3.payment,
         paymentState = _useContext3.paymentState;
 
-    var _useContext4 = React.useContext(reactDialogStack.NavigateStackContext),
-        navigate = _useContext4.navigate;
+    var _useContext4 = React.useContext(PaymentValueContext),
+        displayedPaymentValue = _useContext4.displayedPaymentValue;
+
+    var _useContext5 = React.useContext(reactDialogStack.NavigateStackContext),
+        navigate = _useContext5.navigate;
 
     if (payment == undefined) {
       return /*#__PURE__*/React__default["default"].createElement(DonationOverviewSkeleton, null);
@@ -20949,10 +20967,7 @@
         className: "CardText"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: "TokenAmountRow"
-      }, new localCurrency.Currency({
-        amount: amount.toFixed(2),
-        code: currencyCode
-      }).toString())))), /*#__PURE__*/React__default["default"].createElement("div", {
+      }, displayedPaymentValue)))), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "CardAction"
       }, /*#__PURE__*/React__default["default"].createElement(ChevronRight, null))), /*#__PURE__*/React__default["default"].createElement("div", {
         className: ["Card", paymentState == 'initialized' ? '' : 'disabled'].join(' '),
@@ -21691,12 +21706,12 @@
 
   var Donation = /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(_ref3) {
-      var amount, accept, event, sent, confirmed, validated, failed, error, critical, style, blacklist, providers, currency, connected, closed, track, fee, closable, integration, link, container, title, document, unmount;
+      var amount, accept, event, sent, confirmed, validated, failed, error, critical, style, whitelist, blacklist, providers, currency, connected, closed, track, fee, closable, integration, link, container, title, document, unmount;
       return regenerator.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              amount = _ref3.amount, accept = _ref3.accept, event = _ref3.event, sent = _ref3.sent, confirmed = _ref3.confirmed, validated = _ref3.validated, failed = _ref3.failed, error = _ref3.error, critical = _ref3.critical, style = _ref3.style, blacklist = _ref3.blacklist, providers = _ref3.providers, currency = _ref3.currency, connected = _ref3.connected, closed = _ref3.closed, track = _ref3.track, fee = _ref3.fee, closable = _ref3.closable, integration = _ref3.integration, link = _ref3.link, container = _ref3.container, title = _ref3.title, document = _ref3.document;
+              amount = _ref3.amount, accept = _ref3.accept, event = _ref3.event, sent = _ref3.sent, confirmed = _ref3.confirmed, validated = _ref3.validated, failed = _ref3.failed, error = _ref3.error, critical = _ref3.critical, style = _ref3.style, whitelist = _ref3.whitelist, blacklist = _ref3.blacklist, providers = _ref3.providers, currency = _ref3.currency, connected = _ref3.connected, closed = _ref3.closed, track = _ref3.track, fee = _ref3.fee, closable = _ref3.closable, integration = _ref3.integration, link = _ref3.link, container = _ref3.container, title = _ref3.title, document = _ref3.document;
               requireReactVersion();
               _context2.prev = 2;
               _context2.next = 5;
@@ -21730,6 +21745,7 @@
                       validated: validated,
                       failed: failed,
                       blacklist: blacklist,
+                      whitelist: whitelist,
                       providers: providers,
                       integration: integration,
                       link: link,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@depay/widgets",
   "moduleName": "DePayWidgets",
-  "version": "7.14.4",
+  "version": "7.15.2",
   "description": "Web3 Payments with any token. DePay simplifies and improves Web3 Payments with the power of DeFi. Accept any token with on-the-fly conversion.",
   "main": "./dist/umd/index.js",
   "module": "./dist/esm/index.js",