@depay/widgets 6.4.0 → 6.5.3

package/dist/esm/index.bundle.js

@@ -71380,11 +71380,11 @@ var ConfirmTokenSelectionDialog = (function (props) {
     setOpen(false);
     props.resolve({
       blockchain: token.blockchain,
-      address: token.external_id,
+      address: token.external_id || token.address,
       symbol: token.symbol,
       name: token.name,
       decimals: token.decimals,
-      logo: token.image
+      logo: token.image || token.logo
     });
     setTimeout(props.unmount, 300);
   };
@@ -71511,15 +71511,15 @@ var SelectTokenDialog = (function (props) {
   var _useContext3 = react.useContext(SelectionContext),
       setSelection = _useContext3.setSelection;
 
-  var _useState = react.useState(Blockchain.findByName('ethereum')),
+  var _useState = react.useState(),
       _useState2 = _slicedToArray(_useState, 2),
-      blockchain = _useState2[0],
-      setBlockchain = _useState2[1];
+      requestController = _useState2[0],
+      setRequestController = _useState2[1];
 
   var _useState3 = react.useState(),
       _useState4 = _slicedToArray(_useState3, 2),
-      requestController = _useState4[0],
-      setRequestController = _useState4[1];
+      blockchain = _useState4[0],
+      setBlockchain = _useState4[1];
 
   var _useState5 = react.useState(false),
       _useState6 = _slicedToArray(_useState5, 2),
@@ -71537,21 +71537,44 @@ var SelectTokenDialog = (function (props) {
       _useState10[1];
 
   var searchElement = react.useRef();
-  react.useEffect(function () {
+  var wallet = getWallet();
+
+  var startWithBlockchain = function startWithBlockchain(name) {
+    var blockchain = Blockchain.findByName(name);
+    setBlockchain(blockchain);
     setSelection(Object.assign(props.selection, {
       blockchain: blockchain,
       token: undefined
     }));
+    setTokens(blockchain.tokens);
+  };
+
+  react.useEffect(function () {
+    if (wallet) {
+      wallet.connectedTo().then(function (name) {
+        var blockchain = Blockchain.findByName(name);
+
+        if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
+          startWithBlockchain(name);
+        } else {
+          startWithBlockchain('ethereum');
+        }
+      });
+    } else {
+      startWithBlockchain('ethereum');
+    }
   }, []);
   react.useEffect(function () {
-    setBlockchain(props.selection.blockchain);
-    setTokens(props.selection.blockchain.tokens);
+    if (props.selection.blockchain) {
+      setBlockchain(props.selection.blockchain);
+      setTokens(props.selection.blockchain.tokens);
 
-    if (searchElement.current) {
-      searchElement.current.value = '';
-      searchElement.current.focus();
+      if (searchElement.current) {
+        searchElement.current.value = '';
+        searchElement.current.focus();
+      }
     }
-  }, [props.selection.blockchain]);
+  }, [props.selection, props.selection.blockchain]);
 
   var onClickChangeBlockchain = function onClickChangeBlockchain() {
     navigate('SelectBlockchain');
@@ -71620,7 +71643,7 @@ var SelectTokenDialog = (function (props) {
         }
       })["catch"](function () {});
     } else {
-      setTokens(props.selection.blockchain.tokens);
+      setTokens(blockchain.tokens);
     }
   };
 
@@ -71677,7 +71700,7 @@ var SelectTokenDialog = (function (props) {
     }, token.name))));
   });
 
-  if (props.selection.blockchain == undefined) {
+  if (blockchain == undefined) {
     return null;
   }
 
@@ -71695,10 +71718,10 @@ var SelectTokenDialog = (function (props) {
       className: "CardImage small"
     }, /*#__PURE__*/react.createElement("img", {
       className: "transparent",
-      src: props.selection.blockchain.logo
+      src: blockchain.logo
     })), /*#__PURE__*/react.createElement("div", {
       className: "CardBody"
-    }, props.selection.blockchain.label), /*#__PURE__*/react.createElement("div", {
+    }, blockchain.label), /*#__PURE__*/react.createElement("div", {
       className: "CardAction"
     }, /*#__PURE__*/react.createElement(ChevronRight, null)))), /*#__PURE__*/react.createElement("div", {
       className: "PaddingTopXS PaddingBottomS"

package/dist/esm/index.js

@@ -4757,11 +4757,11 @@ var ConfirmTokenSelectionDialog = (function (props) {
     setOpen(false);
     props.resolve({
       blockchain: token.blockchain,
-      address: token.external_id,
+      address: token.external_id || token.address,
       symbol: token.symbol,
       name: token.name,
       decimals: token.decimals,
-      logo: token.image
+      logo: token.image || token.logo
     });
     setTimeout(props.unmount, 300);
   };
@@ -4888,15 +4888,15 @@ var SelectTokenDialog = (function (props) {
   var _useContext3 = useContext(SelectionContext),
       setSelection = _useContext3.setSelection;
 
-  var _useState = useState(Blockchain.findByName('ethereum')),
+  var _useState = useState(),
       _useState2 = _slicedToArray(_useState, 2),
-      blockchain = _useState2[0],
-      setBlockchain = _useState2[1];
+      requestController = _useState2[0],
+      setRequestController = _useState2[1];
 
   var _useState3 = useState(),
       _useState4 = _slicedToArray(_useState3, 2),
-      requestController = _useState4[0],
-      setRequestController = _useState4[1];
+      blockchain = _useState4[0],
+      setBlockchain = _useState4[1];
 
   var _useState5 = useState(false),
       _useState6 = _slicedToArray(_useState5, 2),
@@ -4914,21 +4914,44 @@ var SelectTokenDialog = (function (props) {
       _useState10[1];
 
   var searchElement = useRef();
-  useEffect(function () {
+  var wallet = getWallet();
+
+  var startWithBlockchain = function startWithBlockchain(name) {
+    var blockchain = Blockchain.findByName(name);
+    setBlockchain(blockchain);
     setSelection(Object.assign(props.selection, {
       blockchain: blockchain,
       token: undefined
     }));
+    setTokens(blockchain.tokens);
+  };
+
+  useEffect(function () {
+    if (wallet) {
+      wallet.connectedTo().then(function (name) {
+        var blockchain = Blockchain.findByName(name);
+
+        if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
+          startWithBlockchain(name);
+        } else {
+          startWithBlockchain('ethereum');
+        }
+      });
+    } else {
+      startWithBlockchain('ethereum');
+    }
   }, []);
   useEffect(function () {
-    setBlockchain(props.selection.blockchain);
-    setTokens(props.selection.blockchain.tokens);
+    if (props.selection.blockchain) {
+      setBlockchain(props.selection.blockchain);
+      setTokens(props.selection.blockchain.tokens);
 
-    if (searchElement.current) {
-      searchElement.current.value = '';
-      searchElement.current.focus();
+      if (searchElement.current) {
+        searchElement.current.value = '';
+        searchElement.current.focus();
+      }
     }
-  }, [props.selection.blockchain]);
+  }, [props.selection, props.selection.blockchain]);
 
   var onClickChangeBlockchain = function onClickChangeBlockchain() {
     navigate('SelectBlockchain');
@@ -4997,7 +5020,7 @@ var SelectTokenDialog = (function (props) {
         }
       })["catch"](function () {});
     } else {
-      setTokens(props.selection.blockchain.tokens);
+      setTokens(blockchain.tokens);
     }
   };
 
@@ -5054,7 +5077,7 @@ var SelectTokenDialog = (function (props) {
     }, token.name))));
   });
 
-  if (props.selection.blockchain == undefined) {
+  if (blockchain == undefined) {
     return null;
   }
 
@@ -5072,10 +5095,10 @@ var SelectTokenDialog = (function (props) {
       className: "CardImage small"
     }, /*#__PURE__*/React.createElement("img", {
       className: "transparent",
-      src: props.selection.blockchain.logo
+      src: blockchain.logo
     })), /*#__PURE__*/React.createElement("div", {
       className: "CardBody"
-    }, props.selection.blockchain.label), /*#__PURE__*/React.createElement("div", {
+    }, blockchain.label), /*#__PURE__*/React.createElement("div", {
       className: "CardAction"
     }, /*#__PURE__*/React.createElement(ChevronRight, null)))), /*#__PURE__*/React.createElement("div", {
       className: "PaddingTopXS PaddingBottomS"

package/dist/umd/index.bundle.js

@@ -71386,11 +71386,11 @@
       setOpen(false);
       props.resolve({
         blockchain: token.blockchain,
-        address: token.external_id,
+        address: token.external_id || token.address,
         symbol: token.symbol,
         name: token.name,
         decimals: token.decimals,
-        logo: token.image
+        logo: token.image || token.logo
       });
       setTimeout(props.unmount, 300);
     };
@@ -71517,15 +71517,15 @@
     var _useContext3 = react.useContext(SelectionContext),
         setSelection = _useContext3.setSelection;
 
-    var _useState = react.useState(Blockchain.findByName('ethereum')),
+    var _useState = react.useState(),
         _useState2 = _slicedToArray(_useState, 2),
-        blockchain = _useState2[0],
-        setBlockchain = _useState2[1];
+        requestController = _useState2[0],
+        setRequestController = _useState2[1];
 
     var _useState3 = react.useState(),
         _useState4 = _slicedToArray(_useState3, 2),
-        requestController = _useState4[0],
-        setRequestController = _useState4[1];
+        blockchain = _useState4[0],
+        setBlockchain = _useState4[1];
 
     var _useState5 = react.useState(false),
         _useState6 = _slicedToArray(_useState5, 2),
@@ -71543,21 +71543,44 @@
         _useState10[1];
 
     var searchElement = react.useRef();
-    react.useEffect(function () {
+    var wallet = getWallet();
+
+    var startWithBlockchain = function startWithBlockchain(name) {
+      var blockchain = Blockchain.findByName(name);
+      setBlockchain(blockchain);
       setSelection(Object.assign(props.selection, {
         blockchain: blockchain,
         token: undefined
       }));
+      setTokens(blockchain.tokens);
+    };
+
+    react.useEffect(function () {
+      if (wallet) {
+        wallet.connectedTo().then(function (name) {
+          var blockchain = Blockchain.findByName(name);
+
+          if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
+            startWithBlockchain(name);
+          } else {
+            startWithBlockchain('ethereum');
+          }
+        });
+      } else {
+        startWithBlockchain('ethereum');
+      }
     }, []);
     react.useEffect(function () {
-      setBlockchain(props.selection.blockchain);
-      setTokens(props.selection.blockchain.tokens);
+      if (props.selection.blockchain) {
+        setBlockchain(props.selection.blockchain);
+        setTokens(props.selection.blockchain.tokens);
 
-      if (searchElement.current) {
-        searchElement.current.value = '';
-        searchElement.current.focus();
+        if (searchElement.current) {
+          searchElement.current.value = '';
+          searchElement.current.focus();
+        }
       }
-    }, [props.selection.blockchain]);
+    }, [props.selection, props.selection.blockchain]);
 
     var onClickChangeBlockchain = function onClickChangeBlockchain() {
       navigate('SelectBlockchain');
@@ -71626,7 +71649,7 @@
           }
         })["catch"](function () {});
       } else {
-        setTokens(props.selection.blockchain.tokens);
+        setTokens(blockchain.tokens);
       }
     };
 
@@ -71683,7 +71706,7 @@
       }, token.name))));
     });
 
-    if (props.selection.blockchain == undefined) {
+    if (blockchain == undefined) {
       return null;
     }
 
@@ -71701,10 +71724,10 @@
         className: "CardImage small"
       }, /*#__PURE__*/react.createElement("img", {
         className: "transparent",
-        src: props.selection.blockchain.logo
+        src: blockchain.logo
       })), /*#__PURE__*/react.createElement("div", {
         className: "CardBody"
-      }, props.selection.blockchain.label), /*#__PURE__*/react.createElement("div", {
+      }, blockchain.label), /*#__PURE__*/react.createElement("div", {
         className: "CardAction"
       }, /*#__PURE__*/react.createElement(ChevronRight, null)))), /*#__PURE__*/react.createElement("div", {
         className: "PaddingTopXS PaddingBottomS"

package/dist/umd/index.js

@@ -4752,11 +4752,11 @@
       setOpen(false);
       props.resolve({
         blockchain: token.blockchain,
-        address: token.external_id,
+        address: token.external_id || token.address,
         symbol: token.symbol,
         name: token.name,
         decimals: token.decimals,
-        logo: token.image
+        logo: token.image || token.logo
       });
       setTimeout(props.unmount, 300);
     };
@@ -4883,15 +4883,15 @@
     var _useContext3 = React.useContext(SelectionContext),
         setSelection = _useContext3.setSelection;
 
-    var _useState = React.useState(web3Blockchains.Blockchain.findByName('ethereum')),
+    var _useState = React.useState(),
         _useState2 = _slicedToArray(_useState, 2),
-        blockchain = _useState2[0],
-        setBlockchain = _useState2[1];
+        requestController = _useState2[0],
+        setRequestController = _useState2[1];
 
     var _useState3 = React.useState(),
         _useState4 = _slicedToArray(_useState3, 2),
-        requestController = _useState4[0],
-        setRequestController = _useState4[1];
+        blockchain = _useState4[0],
+        setBlockchain = _useState4[1];
 
     var _useState5 = React.useState(false),
         _useState6 = _slicedToArray(_useState5, 2),
@@ -4909,21 +4909,44 @@
         _useState10[1];
 
     var searchElement = React.useRef();
-    React.useEffect(function () {
+    var wallet = web3Wallets.getWallet();
+
+    var startWithBlockchain = function startWithBlockchain(name) {
+      var blockchain = web3Blockchains.Blockchain.findByName(name);
+      setBlockchain(blockchain);
       setSelection(Object.assign(props.selection, {
         blockchain: blockchain,
         token: undefined
       }));
+      setTokens(blockchain.tokens);
+    };
+
+    React.useEffect(function () {
+      if (wallet) {
+        wallet.connectedTo().then(function (name) {
+          var blockchain = web3Blockchains.Blockchain.findByName(name);
+
+          if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
+            startWithBlockchain(name);
+          } else {
+            startWithBlockchain('ethereum');
+          }
+        });
+      } else {
+        startWithBlockchain('ethereum');
+      }
     }, []);
     React.useEffect(function () {
-      setBlockchain(props.selection.blockchain);
-      setTokens(props.selection.blockchain.tokens);
+      if (props.selection.blockchain) {
+        setBlockchain(props.selection.blockchain);
+        setTokens(props.selection.blockchain.tokens);
 
-      if (searchElement.current) {
-        searchElement.current.value = '';
-        searchElement.current.focus();
+        if (searchElement.current) {
+          searchElement.current.value = '';
+          searchElement.current.focus();
+        }
       }
-    }, [props.selection.blockchain]);
+    }, [props.selection, props.selection.blockchain]);
 
     var onClickChangeBlockchain = function onClickChangeBlockchain() {
       navigate('SelectBlockchain');
@@ -4992,7 +5015,7 @@
           }
         })["catch"](function () {});
       } else {
-        setTokens(props.selection.blockchain.tokens);
+        setTokens(blockchain.tokens);
       }
     };
 
@@ -5049,7 +5072,7 @@
       }, token.name))));
     });
 
-    if (props.selection.blockchain == undefined) {
+    if (blockchain == undefined) {
       return null;
     }
 
@@ -5067,10 +5090,10 @@
         className: "CardImage small"
       }, /*#__PURE__*/React__default["default"].createElement("img", {
         className: "transparent",
-        src: props.selection.blockchain.logo
+        src: blockchain.logo
       })), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "CardBody"
-      }, props.selection.blockchain.label), /*#__PURE__*/React__default["default"].createElement("div", {
+      }, blockchain.label), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "CardAction"
       }, /*#__PURE__*/React__default["default"].createElement(ChevronRight, null)))), /*#__PURE__*/React__default["default"].createElement("div", {
         className: "PaddingTopXS PaddingBottomS"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@depay/widgets",
   "moduleName": "DePayWidgets",
-  "version": "6.4.0",
+  "version": "6.5.3",
   "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",
@@ -45,7 +45,7 @@
     "@depay/web3-exchanges": "^8.1.0",
     "@depay/web3-payments": "^9.1.0",
     "@depay/web3-tokens": "^8.0.0",
-    "@depay/web3-wallets": "^8.0.2",
+    "@depay/web3-wallets": "^8.1.0",
     "decimal.js": "^10.3.1",
     "react-rangeslider": "^2.2.0"
   },