@depay/widgets 8.0.7 → 8.1.0

package/dist/esm/index.js

@@ -212,14 +212,9 @@ function _regeneratorRuntime() {
     };
   }
   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;
@@ -413,28 +408,33 @@ function _arrayWithHoles(arr) {
 }
 
 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) {
@@ -868,13 +868,29 @@ function _classCallCheck(instance, Constructor) {
   }
 }
 
+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) {
@@ -19093,7 +19109,9 @@ var PaymentProvider = (function (props) {
     wallet = _useContext8.wallet;
   var _useContext9 = useContext(PaymentTrackingContext),
     release = _useContext9.release,
-    tracking = _useContext9.tracking,
+    synchronousTracking = _useContext9.synchronousTracking,
+    asynchronousTracking = _useContext9.asynchronousTracking,
+    trackingInitialized = _useContext9.trackingInitialized,
     initializePaymentTracking = _useContext9.initializeTracking;
   var _useContext10 = useContext(TransactionTrackingContext),
     foundTransaction = _useContext10.foundTransaction,
@@ -19115,7 +19133,7 @@ var PaymentProvider = (function (props) {
     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');
@@ -19124,11 +19142,14 @@ var PaymentProvider = (function (props) {
     }
   };
   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() {
@@ -19216,6 +19237,11 @@ var PaymentProvider = (function (props) {
       setPaymentState('success');
     }
   }, [release]);
+  useEffect(function () {
+    if (asynchronousTracking && trackingInitialized && (paymentState == 'success' || paymentState == 'failed')) {
+      setClosable(true);
+    }
+  }, [trackingInitialized, paymentState]);
   useEffect(function () {
     if (recover) {
       setClosable(false);
@@ -19321,6 +19347,7 @@ var PaymentProvider = (function (props) {
 });
 
 function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value: value,
@@ -20092,7 +20119,9 @@ var Footer = (function () {
     _useContext.amount;
     _useContext.amountsMissing;
   var _useContext2 = useContext(PaymentTrackingContext),
-    tracking = _useContext2.tracking,
+    synchronousTracking = _useContext2.synchronousTracking,
+    asynchronousTracking = _useContext2.asynchronousTracking,
+    trackingInitialized = _useContext2.trackingInitialized,
     release = _useContext2.release,
     forwardTo = _useContext2.forwardTo;
   var _useContext3 = useContext(PaymentContext),
@@ -20114,10 +20143,25 @@ var Footer = (function () {
   var _useContext7 = 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.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "Card transparent small disabled"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "CardImage"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "TextCenter"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "Loading Icon"
+      }))), /*#__PURE__*/React.createElement("div", {
+        className: "CardBody"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "CardBodyWrapper"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "Opacity05"
+      }, "Initializing tracking")))));
+    } else if (release) {
       return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
         className: "Card transparent small disabled"
       }, /*#__PURE__*/React.createElement("div", {
@@ -20175,7 +20219,7 @@ var Footer = (function () {
         className: "PaddingBottomS"
       }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.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"
@@ -20191,7 +20235,7 @@ var Footer = (function () {
         className: "CardBodyWrapper"
       }, /*#__PURE__*/React.createElement("div", {
         className: "Opacity05"
-      }, "Payment confirmed"))))), trackingInfo());
+      }, "Transaction confirmed"))))), trackingInfo());
     }
   };
   var approvalButton = function approvalButton() {
@@ -20257,7 +20301,7 @@ var Footer = (function () {
         rel: "noopener noreferrer"
       }, /*#__PURE__*/React.createElement(LoadingText, null, "Paying"));
     } else if (paymentState == 'success') {
-      if (tracking == true) {
+      if (synchronousTracking == true) {
         if (release) {
           if (forwardTo) {
             return /*#__PURE__*/React.createElement("a", {
@@ -20277,6 +20321,11 @@ var Footer = (function () {
             onClick: function onClick() {}
           }, "Continue");
         }
+      } else if (asynchronousTracking == true && trackingInitialized == false) {
+        return /*#__PURE__*/React.createElement("button", {
+          className: "ButtonPrimary disabled",
+          onClick: function onClick() {}
+        }, "Close");
       } else {
         return /*#__PURE__*/React.createElement("button", {
           className: "ButtonPrimary",
@@ -20400,7 +20449,7 @@ var PaymentFailedDialog = (function () {
       className: "Text PaddingTopS PaddingBottomS PaddingLeftS PaddingRightS"
     }, /*#__PURE__*/React.createElement("strong", {
       className: "FontSizeM"
-    }, "Unfortunately executing your payment failed. You can go back and try again."), transaction && /*#__PURE__*/React.createElement("div", {
+    }, "Unfortunately executing your payment failed, but you can try again."), transaction && /*#__PURE__*/React.createElement("div", {
       className: "PaddingTopS"
     }, /*#__PURE__*/React.createElement("a", {
       className: "Link",
@@ -20528,20 +20577,27 @@ var PaymentTrackingProvider = (function (props) {
     _useState6 = _slicedToArray(_useState5, 2),
     paymentRoute = _useState6[0],
     setPaymentRoute = _useState6[1];
-  var _useState7 = useState(!!(track && (track.endpoint || typeof track.method == 'function') && track.async != true)),
-    _useState8 = _slicedToArray(_useState7, 1),
-    tracking = _useState8[0];
-  var _useState9 = useState(!!(track && track.poll && (track.poll.endpoint || typeof track.poll.method == 'function') && track.async != true)),
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    trackingInitialized = _useState8[0],
+    setTrackingInitialized = _useState8[1];
+  var _useState9 = useState(!!(track && (track.endpoint || typeof track.method == 'function') && track.async != true)),
     _useState10 = _slicedToArray(_useState9, 1),
-    polling = _useState10[0];
-  var _useState11 = useState(false),
-    _useState12 = _slicedToArray(_useState11, 2),
-    release = _useState12[0],
-    setRelease = _useState12[1];
-  var _useState13 = useState(),
-    _useState14 = _slicedToArray(_useState13, 2),
-    forwardTo = _useState14[0],
-    setForwardTo = _useState14[1];
+    synchronousTracking = _useState10[0];
+  var _useState11 = useState(!!(track && track.async == true)),
+    _useState12 = _slicedToArray(_useState11, 1),
+    asynchronousTracking = _useState12[0];
+  var _useState13 = useState(!!(track && track.poll && (track.poll.endpoint || typeof track.poll.method == 'function') && track.async != true)),
+    _useState14 = _slicedToArray(_useState13, 1),
+    polling = _useState14[0];
+  var _useState15 = useState(false),
+    _useState16 = _slicedToArray(_useState15, 2),
+    release = _useState16[0],
+    setRelease = _useState16[1];
+  var _useState17 = useState(),
+    _useState18 = _slicedToArray(_useState17, 2),
+    forwardTo = _useState18[0],
+    setForwardTo = _useState18[1];
   var _useContext3 = useContext(ClosableContext),
     setClosable = _useContext3.setClosable;
   var _useContext4 = useContext(NavigateContext),
@@ -20636,6 +20692,7 @@ var PaymentTrackingProvider = (function (props) {
       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);
@@ -20692,7 +20749,7 @@ var PaymentTrackingProvider = (function (props) {
     if (!polling) {
       return;
     }
-    if (!tracking) {
+    if (!synchronousTracking) {
       return;
     }
     var pollingInterval = setInterval(function () {
@@ -20744,10 +20801,10 @@ var PaymentTrackingProvider = (function (props) {
   };
   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);
@@ -20757,8 +20814,10 @@ var PaymentTrackingProvider = (function (props) {
   };
   return /*#__PURE__*/React.createElement(PaymentTrackingContext.Provider, {
     value: {
-      tracking: tracking,
+      synchronousTracking: synchronousTracking,
+      asynchronousTracking: asynchronousTracking,
       initializeTracking: initializeTracking,
+      trackingInitialized: trackingInitialized,
       continueTryTracking: continueTryTracking,
       release: release,
       forwardTo: forwardTo
@@ -21394,8 +21453,8 @@ var PaymentOverviewDialog = (function (props) {
 var TrackingFailedDialog = (function () {
   var _useContext = useContext(PaymentTrackingContext),
     continueTryTracking = _useContext.continueTryTracking;
-  var _useContext2 = useContext(PaymentContext),
-    transaction = _useContext2.transaction;
+  var _useContext2 = useContext(PaymentContext);
+    _useContext2.transaction;
   var _useContext3 = useContext(NavigateStackContext),
     navigate = _useContext3.navigate;
   var tryAgain = function tryAgain() {
@@ -21422,10 +21481,7 @@ var TrackingFailedDialog = (function () {
       className: "FontSizeM"
     }, "Please ensure you are connected to the internet, then click \"Try again\"."), /*#__PURE__*/React.createElement("div", {
       className: "PaddingTopS"
-    }, /*#__PURE__*/React.createElement("span", null, "If this keeps happening, "), /*#__PURE__*/React.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.createElement("span", null, "If this keeps happening, please report it.")))),
     footer: /*#__PURE__*/React.createElement("div", {
       className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
     }, /*#__PURE__*/React.createElement("button", {