@depay/widgets 8.0.7 → 8.1.0

package/dist/umd/index.js

@@ -207,14 +207,9 @@
       };
     }
     function maybeInvokeDelegate(delegate, context) {
-      var method = delegate.iterator[context.method];
-      if (undefined === method) {
-        if (context.delegate = null, "throw" === context.method) {
-          if (delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel;
-          context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method");
-        }
-        return ContinueSentinel;
-      }
+      var methodName = context.method,
+        method = delegate.iterator[methodName];
+      if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel;
       var record = tryCatch(method, delegate.iterator, context.arg);
       if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
       var info = record.arg;
@@ -408,28 +403,33 @@
   }
 
   function _iterableToArrayLimit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-        _arr.push(_s.value);
-        if (i && _arr.length === i) break;
-      }
-    } catch (err) {
-      _d = true;
-      _e = err;
-    } finally {
+    var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+    if (null != _i) {
+      var _s,
+        _e,
+        _x,
+        _r,
+        _arr = [],
+        _n = !0,
+        _d = !1;
       try {
-        if (!_n && _i["return"] != null) _i["return"]();
+        if (_x = (_i = _i.call(arr)).next, 0 === i) {
+          if (Object(_i) !== _i) return;
+          _n = !1;
+        } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
+          ;
+        }
+      } catch (err) {
+        _d = !0, _e = err;
       } finally {
-        if (_d) throw _e;
+        try {
+          if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+        } finally {
+          if (_d) throw _e;
+        }
       }
+      return _arr;
     }
-    return _arr;
   }
 
   function _arrayLikeToArray(arr, len) {
@@ -863,13 +863,29 @@
     }
   }
 
+  function _toPrimitive(input, hint) {
+    if (_typeof(input) !== "object" || input === null) return input;
+    var prim = input[Symbol.toPrimitive];
+    if (prim !== undefined) {
+      var res = prim.call(input, hint || "default");
+      if (_typeof(res) !== "object") return res;
+      throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return (hint === "string" ? String : Number)(input);
+  }
+
+  function _toPropertyKey(arg) {
+    var key = _toPrimitive(arg, "string");
+    return _typeof(key) === "symbol" ? key : String(key);
+  }
+
   function _defineProperties(target, props) {
     for (var i = 0; i < props.length; i++) {
       var descriptor = props[i];
       descriptor.enumerable = descriptor.enumerable || false;
       descriptor.configurable = true;
       if ("value" in descriptor) descriptor.writable = true;
-      Object.defineProperty(target, descriptor.key, descriptor);
+      Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
     }
   }
   function _createClass(Constructor, protoProps, staticProps) {
@@ -19088,7 +19104,9 @@
       wallet = _useContext8.wallet;
     var _useContext9 = React.useContext(PaymentTrackingContext),
       release = _useContext9.release,
-      tracking = _useContext9.tracking,
+      synchronousTracking = _useContext9.synchronousTracking,
+      asynchronousTracking = _useContext9.asynchronousTracking,
+      trackingInitialized = _useContext9.trackingInitialized,
       initializePaymentTracking = _useContext9.initializeTracking;
     var _useContext10 = React.useContext(TransactionTrackingContext),
       foundTransaction = _useContext10.foundTransaction,
@@ -19110,7 +19128,7 @@
       paymentState = _useState8[0],
       setPaymentState = _useState8[1];
     var paymentSucceeded = function paymentSucceeded(transaction) {
-      if (tracking != true) {
+      if (synchronousTracking == false && (asynchronousTracking == false || trackingInitialized == true)) {
         setClosable(true);
       }
       setPaymentState('success');
@@ -19119,11 +19137,14 @@
       }
     };
     var paymentFailed = function paymentFailed(transaction, error) {
+      if (asynchronousTracking == false || trackingInitialized == true) {
+        setClosable(true);
+      }
+      set(['PaymentFailed']);
+      setPaymentState('failed');
       if (failed) {
         failed(transaction, error);
       }
-      setClosable(true);
-      set(['PaymentFailed']);
     };
     var pay = /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() {
@@ -19211,6 +19232,11 @@
         setPaymentState('success');
       }
     }, [release]);
+    React.useEffect(function () {
+      if (asynchronousTracking && trackingInitialized && (paymentState == 'success' || paymentState == 'failed')) {
+        setClosable(true);
+      }
+    }, [trackingInitialized, paymentState]);
     React.useEffect(function () {
       if (recover) {
         setClosable(false);
@@ -19316,6 +19342,7 @@
   });
 
   function _defineProperty(obj, key, value) {
+    key = _toPropertyKey(key);
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value: value,
@@ -20087,7 +20114,9 @@
       _useContext.amount;
       _useContext.amountsMissing;
     var _useContext2 = React.useContext(PaymentTrackingContext),
-      tracking = _useContext2.tracking,
+      synchronousTracking = _useContext2.synchronousTracking,
+      asynchronousTracking = _useContext2.asynchronousTracking,
+      trackingInitialized = _useContext2.trackingInitialized,
       release = _useContext2.release,
       forwardTo = _useContext2.forwardTo;
     var _useContext3 = React.useContext(PaymentContext),
@@ -20109,10 +20138,25 @@
     var _useContext7 = React.useContext(ClosableContext),
       close = _useContext7.close;
     var trackingInfo = function trackingInfo() {
-      if (tracking != true) {
+      if (synchronousTracking == false && asynchronousTracking == false || asynchronousTracking && trackingInitialized) {
         return null;
-      }
-      if (release) {
+      } else if (asynchronousTracking && trackingInitialized == false) {
+        return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "Card transparent small disabled"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "CardImage"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "TextCenter"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "Loading Icon"
+        }))), /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "CardBody"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "CardBodyWrapper"
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "Opacity05"
+        }, "Initializing tracking")))));
+      } else if (release) {
         return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "Card transparent small disabled"
         }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -20170,7 +20214,7 @@
           className: "PaddingBottomS"
         }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("a", {
           className: "Card transparent small",
-          title: "Payment has been confirmed by the network",
+          title: "Transaction has been confirmed by the network",
           href: transaction === null || transaction === void 0 ? void 0 : transaction.url,
           target: "_blank",
           rel: "noopener noreferrer"
@@ -20186,7 +20230,7 @@
           className: "CardBodyWrapper"
         }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "Opacity05"
-        }, "Payment confirmed"))))), trackingInfo());
+        }, "Transaction confirmed"))))), trackingInfo());
       }
     };
     var approvalButton = function approvalButton() {
@@ -20252,7 +20296,7 @@
           rel: "noopener noreferrer"
         }, /*#__PURE__*/React__default["default"].createElement(LoadingText, null, "Paying"));
       } else if (paymentState == 'success') {
-        if (tracking == true) {
+        if (synchronousTracking == true) {
           if (release) {
             if (forwardTo) {
               return /*#__PURE__*/React__default["default"].createElement("a", {
@@ -20272,6 +20316,11 @@
               onClick: function onClick() {}
             }, "Continue");
           }
+        } else if (asynchronousTracking == true && trackingInitialized == false) {
+          return /*#__PURE__*/React__default["default"].createElement("button", {
+            className: "ButtonPrimary disabled",
+            onClick: function onClick() {}
+          }, "Close");
         } else {
           return /*#__PURE__*/React__default["default"].createElement("button", {
             className: "ButtonPrimary",
@@ -20395,7 +20444,7 @@
         className: "Text PaddingTopS PaddingBottomS PaddingLeftS PaddingRightS"
       }, /*#__PURE__*/React__default["default"].createElement("strong", {
         className: "FontSizeM"
-      }, "Unfortunately executing your payment failed. You can go back and try again."), transaction && /*#__PURE__*/React__default["default"].createElement("div", {
+      }, "Unfortunately executing your payment failed, but you can try again."), transaction && /*#__PURE__*/React__default["default"].createElement("div", {
         className: "PaddingTopS"
       }, /*#__PURE__*/React__default["default"].createElement("a", {
         className: "Link",
@@ -20523,20 +20572,27 @@
       _useState6 = _slicedToArray(_useState5, 2),
       paymentRoute = _useState6[0],
       setPaymentRoute = _useState6[1];
-    var _useState7 = React.useState(!!(track && (track.endpoint || typeof track.method == 'function') && track.async != true)),
-      _useState8 = _slicedToArray(_useState7, 1),
-      tracking = _useState8[0];
-    var _useState9 = React.useState(!!(track && track.poll && (track.poll.endpoint || typeof track.poll.method == 'function') && track.async != true)),
+    var _useState7 = React.useState(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      trackingInitialized = _useState8[0],
+      setTrackingInitialized = _useState8[1];
+    var _useState9 = React.useState(!!(track && (track.endpoint || typeof track.method == 'function') && track.async != true)),
       _useState10 = _slicedToArray(_useState9, 1),
-      polling = _useState10[0];
-    var _useState11 = React.useState(false),
-      _useState12 = _slicedToArray(_useState11, 2),
-      release = _useState12[0],
-      setRelease = _useState12[1];
-    var _useState13 = React.useState(),
-      _useState14 = _slicedToArray(_useState13, 2),
-      forwardTo = _useState14[0],
-      setForwardTo = _useState14[1];
+      synchronousTracking = _useState10[0];
+    var _useState11 = React.useState(!!(track && track.async == true)),
+      _useState12 = _slicedToArray(_useState11, 1),
+      asynchronousTracking = _useState12[0];
+    var _useState13 = React.useState(!!(track && track.poll && (track.poll.endpoint || typeof track.poll.method == 'function') && track.async != true)),
+      _useState14 = _slicedToArray(_useState13, 1),
+      polling = _useState14[0];
+    var _useState15 = React.useState(false),
+      _useState16 = _slicedToArray(_useState15, 2),
+      release = _useState16[0],
+      setRelease = _useState16[1];
+    var _useState17 = React.useState(),
+      _useState18 = _slicedToArray(_useState17, 2),
+      forwardTo = _useState18[0],
+      setForwardTo = _useState18[1];
     var _useContext3 = React.useContext(ClosableContext),
       setClosable = _useContext3.setClosable;
     var _useContext4 = React.useContext(NavigateContext),
@@ -20631,6 +20687,7 @@
         to_decimals: paymentRoute.toDecimals,
         fee_amount: paymentRoute === null || paymentRoute === void 0 ? void 0 : (_paymentRoute$feeAmou = paymentRoute.feeAmount) === null || _paymentRoute$feeAmou === void 0 ? void 0 : _paymentRoute$feeAmou.toString()
       }).then(function (response) {
+        setTrackingInitialized(true);
         console.log('PAYMENT TRACKING INITIALIZED');
       })["catch"](function (error) {
         console.log('PAYMENT TRACKING FAILED', error);
@@ -20687,7 +20744,7 @@
       if (!polling) {
         return;
       }
-      if (!tracking) {
+      if (!synchronousTracking) {
         return;
       }
       var pollingInterval = setInterval(function () {
@@ -20739,10 +20796,10 @@
     };
     var initializeTracking = function initializeTracking(transaction, afterBlock, paymentRoute) {
       storePayment(transaction, afterBlock, paymentRoute);
-      if (tracking || track && track.async == true) {
+      if (synchronousTracking || track && track.async == true) {
         startTracking(transaction, afterBlock, paymentRoute);
       }
-      if (tracking == false) {
+      if (synchronousTracking == false) {
         return;
       }
       setTransaction(transaction);
@@ -20752,8 +20809,10 @@
     };
     return /*#__PURE__*/React__default["default"].createElement(PaymentTrackingContext.Provider, {
       value: {
-        tracking: tracking,
+        synchronousTracking: synchronousTracking,
+        asynchronousTracking: asynchronousTracking,
         initializeTracking: initializeTracking,
+        trackingInitialized: trackingInitialized,
         continueTryTracking: continueTryTracking,
         release: release,
         forwardTo: forwardTo
@@ -21389,8 +21448,8 @@
   var TrackingFailedDialog = (function () {
     var _useContext = React.useContext(PaymentTrackingContext),
       continueTryTracking = _useContext.continueTryTracking;
-    var _useContext2 = React.useContext(PaymentContext),
-      transaction = _useContext2.transaction;
+    var _useContext2 = React.useContext(PaymentContext);
+      _useContext2.transaction;
     var _useContext3 = React.useContext(reactDialogStack.NavigateStackContext),
       navigate = _useContext3.navigate;
     var tryAgain = function tryAgain() {
@@ -21417,10 +21476,7 @@
         className: "FontSizeM"
       }, "Please ensure you are connected to the internet, then click \"Try again\"."), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "PaddingTopS"
-      }, /*#__PURE__*/React__default["default"].createElement("span", null, "If this keeps happening, "), /*#__PURE__*/React__default["default"].createElement("a", {
-        className: "Link",
-        href: "mailto:support@depay.com?subject=Payment%20tracking%20failed&body=Tracking%20my%20payment%20failed%0A%0ATransaction:%20".concat(transaction.url)
-      }, "please report it"), "."))),
+      }, /*#__PURE__*/React__default["default"].createElement("span", null, "If this keeps happening, please report it.")))),
       footer: /*#__PURE__*/React__default["default"].createElement("div", {
         className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
       }, /*#__PURE__*/React__default["default"].createElement("button", {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@depay/widgets",
   "moduleName": "DePayWidgets",
-  "version": "8.0.7",
+  "version": "8.1.0",
   "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",
@@ -43,7 +43,7 @@
     "@depay/walletconnect-v1": "^1.7.10",
     "@depay/web3-assets": "^6.6.1",
     "@depay/web3-blockchains": "^6.2.3",
-    "@depay/web3-client": "^10.1.23",
+    "@depay/web3-client": "^10.2.0",
     "@depay/web3-constants": "^6.3.2",
     "@depay/web3-exchanges": "^11.2.4",
     "@depay/web3-payments": "^10.8.4",