@depay/widgets 6.5.1 → 6.5.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -49476,7 +49476,7 @@ var ButtonPrimaryStyle = (function (style) {
49476
49476
  });
49477
49477
 
49478
49478
  var CardStyle = (function (style) {
49479
- return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
49479
+ return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
49480
49480
  });
49481
49481
 
49482
49482
  var DialogStyle = (function (style) {
@@ -49564,7 +49564,7 @@ var TokenAmountStyle = (function () {
49564
49564
  });
49565
49565
 
49566
49566
  var TokenImageStyle = (function (style) {
49567
- return "\n\n .TokenImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
49567
+ return "\n\n .TokenImage img {\n border-radius: 99rem;\n border: 1px solid white;\n background: white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
49568
49568
  });
49569
49569
 
49570
49570
  var TooltipStyle = (function (style) {
@@ -62371,7 +62371,7 @@ var NoPaymentMethodFoundDialog = (function () {
62371
62371
  className: "Text PaddingTopS PaddingBottomM PaddingLeftM PaddingRightM"
62372
62372
  }, /*#__PURE__*/react.createElement("strong", {
62373
62373
  className: "FontSizeM"
62374
- }, "We were not able to find any asset of value in your wallet. Please top up your account in order to proceed with this payment."))),
62374
+ }, "We were not able to find any asset with enough value in your wallet. Please top up your account in order to proceed with this payment."))),
62375
62375
  footer: /*#__PURE__*/react.createElement("div", {
62376
62376
  className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
62377
62377
  }, /*#__PURE__*/react.createElement("button", {
@@ -71538,27 +71538,30 @@ var SelectTokenDialog = (function (props) {
71538
71538
 
71539
71539
  var searchElement = react.useRef();
71540
71540
  var wallet = getWallet();
71541
- react.useEffect(function () {
71542
- var blockchain;
71543
71541
 
71542
+ var startWithBlockchain = function startWithBlockchain(name) {
71543
+ var blockchain = Blockchain.findByName(name);
71544
+ setBlockchain(blockchain);
71545
+ setSelection(Object.assign(props.selection, {
71546
+ blockchain: blockchain,
71547
+ token: undefined
71548
+ }));
71549
+ setTokens(blockchain.tokens);
71550
+ };
71551
+
71552
+ react.useEffect(function () {
71544
71553
  if (wallet) {
71545
71554
  wallet.connectedTo().then(function (name) {
71546
- blockchain = Blockchain.findByName(name);
71547
- setBlockchain(blockchain);
71548
- setSelection(Object.assign(props.selection, {
71549
- blockchain: blockchain,
71550
- token: undefined
71551
- }));
71552
- setTokens(blockchain.tokens);
71555
+ var blockchain = Blockchain.findByName(name);
71556
+
71557
+ if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
71558
+ startWithBlockchain(name);
71559
+ } else {
71560
+ startWithBlockchain('ethereum');
71561
+ }
71553
71562
  });
71554
71563
  } else {
71555
- blockchain = Blockchain.findByName('ethereum');
71556
- setBlockchain(blockchain);
71557
- setSelection(Object.assign(props.selection, {
71558
- blockchain: blockchain,
71559
- token: undefined
71560
- }));
71561
- setTokens(blockchain.tokens);
71564
+ startWithBlockchain('ethereum');
71562
71565
  }
71563
71566
  }, []);
71564
71567
  react.useEffect(function () {
package/dist/esm/index.js CHANGED
@@ -1677,7 +1677,7 @@ var ButtonPrimaryStyle = (function (style) {
1677
1677
  });
1678
1678
 
1679
1679
  var CardStyle = (function (style) {
1680
- return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
1680
+ return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
1681
1681
  });
1682
1682
 
1683
1683
  var DialogStyle = (function (style) {
@@ -1765,7 +1765,7 @@ var TokenAmountStyle = (function () {
1765
1765
  });
1766
1766
 
1767
1767
  var TokenImageStyle = (function (style) {
1768
- return "\n\n .TokenImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
1768
+ return "\n\n .TokenImage img {\n border-radius: 99rem;\n border: 1px solid white;\n background: white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
1769
1769
  });
1770
1770
 
1771
1771
  var TooltipStyle = (function (style) {
@@ -2218,7 +2218,7 @@ var NoPaymentMethodFoundDialog = (function () {
2218
2218
  className: "Text PaddingTopS PaddingBottomM PaddingLeftM PaddingRightM"
2219
2219
  }, /*#__PURE__*/React.createElement("strong", {
2220
2220
  className: "FontSizeM"
2221
- }, "We were not able to find any asset of value in your wallet. Please top up your account in order to proceed with this payment."))),
2221
+ }, "We were not able to find any asset with enough value in your wallet. Please top up your account in order to proceed with this payment."))),
2222
2222
  footer: /*#__PURE__*/React.createElement("div", {
2223
2223
  className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
2224
2224
  }, /*#__PURE__*/React.createElement("button", {
@@ -4915,27 +4915,30 @@ var SelectTokenDialog = (function (props) {
4915
4915
 
4916
4916
  var searchElement = useRef();
4917
4917
  var wallet = getWallet();
4918
- useEffect(function () {
4919
- var blockchain;
4920
4918
 
4919
+ var startWithBlockchain = function startWithBlockchain(name) {
4920
+ var blockchain = Blockchain.findByName(name);
4921
+ setBlockchain(blockchain);
4922
+ setSelection(Object.assign(props.selection, {
4923
+ blockchain: blockchain,
4924
+ token: undefined
4925
+ }));
4926
+ setTokens(blockchain.tokens);
4927
+ };
4928
+
4929
+ useEffect(function () {
4921
4930
  if (wallet) {
4922
4931
  wallet.connectedTo().then(function (name) {
4923
- blockchain = Blockchain.findByName(name);
4924
- setBlockchain(blockchain);
4925
- setSelection(Object.assign(props.selection, {
4926
- blockchain: blockchain,
4927
- token: undefined
4928
- }));
4929
- setTokens(blockchain.tokens);
4932
+ var blockchain = Blockchain.findByName(name);
4933
+
4934
+ if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
4935
+ startWithBlockchain(name);
4936
+ } else {
4937
+ startWithBlockchain('ethereum');
4938
+ }
4930
4939
  });
4931
4940
  } else {
4932
- blockchain = Blockchain.findByName('ethereum');
4933
- setBlockchain(blockchain);
4934
- setSelection(Object.assign(props.selection, {
4935
- blockchain: blockchain,
4936
- token: undefined
4937
- }));
4938
- setTokens(blockchain.tokens);
4941
+ startWithBlockchain('ethereum');
4939
4942
  }
4940
4943
  }, []);
4941
4944
  useEffect(function () {
@@ -49482,7 +49482,7 @@
49482
49482
  });
49483
49483
 
49484
49484
  var CardStyle = (function (style) {
49485
- return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
49485
+ return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
49486
49486
  });
49487
49487
 
49488
49488
  var DialogStyle = (function (style) {
@@ -49570,7 +49570,7 @@
49570
49570
  });
49571
49571
 
49572
49572
  var TokenImageStyle = (function (style) {
49573
- return "\n\n .TokenImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
49573
+ return "\n\n .TokenImage img {\n border-radius: 99rem;\n border: 1px solid white;\n background: white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
49574
49574
  });
49575
49575
 
49576
49576
  var TooltipStyle = (function (style) {
@@ -62377,7 +62377,7 @@
62377
62377
  className: "Text PaddingTopS PaddingBottomM PaddingLeftM PaddingRightM"
62378
62378
  }, /*#__PURE__*/react.createElement("strong", {
62379
62379
  className: "FontSizeM"
62380
- }, "We were not able to find any asset of value in your wallet. Please top up your account in order to proceed with this payment."))),
62380
+ }, "We were not able to find any asset with enough value in your wallet. Please top up your account in order to proceed with this payment."))),
62381
62381
  footer: /*#__PURE__*/react.createElement("div", {
62382
62382
  className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
62383
62383
  }, /*#__PURE__*/react.createElement("button", {
@@ -71544,27 +71544,30 @@
71544
71544
 
71545
71545
  var searchElement = react.useRef();
71546
71546
  var wallet = getWallet();
71547
- react.useEffect(function () {
71548
- var blockchain;
71549
71547
 
71548
+ var startWithBlockchain = function startWithBlockchain(name) {
71549
+ var blockchain = Blockchain.findByName(name);
71550
+ setBlockchain(blockchain);
71551
+ setSelection(Object.assign(props.selection, {
71552
+ blockchain: blockchain,
71553
+ token: undefined
71554
+ }));
71555
+ setTokens(blockchain.tokens);
71556
+ };
71557
+
71558
+ react.useEffect(function () {
71550
71559
  if (wallet) {
71551
71560
  wallet.connectedTo().then(function (name) {
71552
- blockchain = Blockchain.findByName(name);
71553
- setBlockchain(blockchain);
71554
- setSelection(Object.assign(props.selection, {
71555
- blockchain: blockchain,
71556
- token: undefined
71557
- }));
71558
- setTokens(blockchain.tokens);
71561
+ var blockchain = Blockchain.findByName(name);
71562
+
71563
+ if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
71564
+ startWithBlockchain(name);
71565
+ } else {
71566
+ startWithBlockchain('ethereum');
71567
+ }
71559
71568
  });
71560
71569
  } else {
71561
- blockchain = Blockchain.findByName('ethereum');
71562
- setBlockchain(blockchain);
71563
- setSelection(Object.assign(props.selection, {
71564
- blockchain: blockchain,
71565
- token: undefined
71566
- }));
71567
- setTokens(blockchain.tokens);
71570
+ startWithBlockchain('ethereum');
71568
71571
  }
71569
71572
  }, []);
71570
71573
  react.useEffect(function () {
package/dist/umd/index.js CHANGED
@@ -1672,7 +1672,7 @@
1672
1672
  });
1673
1673
 
1674
1674
  var CardStyle = (function (style) {
1675
- return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
1675
+ return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border-radius: 0.8rem;\n box-shadow: 0 0 8px rgba(0,0,0,0.03);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n margin-bottom: 0.5rem;\n min-height: 4.78rem;\n padding: 1rem 0.6rem;\n width: 100%;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 4.3rem;\n padding: 0.4rem 1.3rem;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 1.2rem;\n }\n\n .CardTokenSymbol {\n width: 40%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .CardTokenName {\n text-align: right;\n opacity: 0.5;\n width: 60%;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n \n .Card.Row .CardTokenName .CardText {\n font-size: 1rem;\n }\n\n .Card.Row .CardImage {\n width: 2.5rem;\n }\n\n .Card.Row .CardImage img {\n height: 1.9rem;\n width: 1.9rem;\n }\n\n a.Card, a.Card * {\n color: inherit;\n text-decoration: none;\n }\n\n .Card.transparent {\n background: none;\n box-shadow: none;\n }\n\n .Card.small {\n min-height: auto;\n padding: 0.5rem 0.5rem;\n margin: 0;\n }\n\n .CardImage.small {\n width: 1.7rem;\n }\n\n .CardImage.small img {\n height: 1.4rem;\n width: 1.4rem;\n }\n\n .Card.disabled {\n cursor: default;\n }\n\n .Card:hover:not(.disabled) {\n background: rgb(240,240,240);\n box-shadow: 0 0 0 rgba(0,0,0,0); \n }\n\n .Card:active:not(.disabled) {\n background: rgb(235,235,235);\n box-shadow: inset 0 0 6px rgba(0,0,0,0.02);\n color: inherit;\n }\n\n .Card:hover:not(.disabled) .CardAction {\n opacity: 0.4;\n }\n\n .CardImage, .CardBody, .CardAction, .CardInfo {\n align-items: center;\n display: flex;\n min-width: 0;\n padding: 0 0.4rem;\n }\n\n .CardImage {\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 3.6rem;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 1.4rem;\n padding-left: 0.6rem;\n text-align: left;\n }\n\n .CardBodyWrapper {\n min-width: 0;\n }\n\n .CardAction {\n flex-basis: auto;\n flex-shrink: 0;\n flex-grow: 0;\n padding-right: 0;\n margin-left: auto;\n }\n\n .Card.disabled .CardAction {\n opacity: 0; \n }\n\n .CardInfo {\n display: flex;\n flex-basis: auto;\n flex-direction: column;\n flex-grow: 0;\n flex-shrink: 1;\n justify-content: center;\n margin-left: auto; \n padding-right: 0;\n }\n\n .CardImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .CardImage img.transparent {\n border: none;\n background: none;\n box-shadow: none;\n }\n \n .CardImage .BlockchainLogo {\n position: absolute;\n bottom: 0;\n right: 0;\n }\n\n .CardTitle {\n font-size: 0.9rem;\n color: rgb(150,150,150);\n }\n \n .CardText, a .CardText {\n color: ".concat(style.colors.text, ";\n flex: 1;\n font-size: 1.3rem;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText small {\n font-size: 1.26rem;\n color: rgb(150,150,150);\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
1676
1676
  });
1677
1677
 
1678
1678
  var DialogStyle = (function (style) {
@@ -1760,7 +1760,7 @@
1760
1760
  });
1761
1761
 
1762
1762
  var TokenImageStyle = (function (style) {
1763
- return "\n\n .TokenImage img {\n background: white;\n border-radius: 99rem;\n border: 1px solid white;\n background: rgba(0,0,0,0.1);\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
1763
+ return "\n\n .TokenImage img {\n border-radius: 99rem;\n border: 1px solid white;\n background: white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 2.8rem;\n position: relative;\n vertical-align: middle;\n width: 2.8rem;\n }\n\n .TokenImage.medium img {\n height: 5.8rem;\n width: 5.8rem;\n }\n ";
1764
1764
  });
1765
1765
 
1766
1766
  var TooltipStyle = (function (style) {
@@ -2213,7 +2213,7 @@
2213
2213
  className: "Text PaddingTopS PaddingBottomM PaddingLeftM PaddingRightM"
2214
2214
  }, /*#__PURE__*/React__default["default"].createElement("strong", {
2215
2215
  className: "FontSizeM"
2216
- }, "We were not able to find any asset of value in your wallet. Please top up your account in order to proceed with this payment."))),
2216
+ }, "We were not able to find any asset with enough value in your wallet. Please top up your account in order to proceed with this payment."))),
2217
2217
  footer: /*#__PURE__*/React__default["default"].createElement("div", {
2218
2218
  className: "PaddingTopXS PaddingRightM PaddingLeftM PaddingBottomM"
2219
2219
  }, /*#__PURE__*/React__default["default"].createElement("button", {
@@ -4910,27 +4910,30 @@
4910
4910
 
4911
4911
  var searchElement = React.useRef();
4912
4912
  var wallet = web3Wallets.getWallet();
4913
- React.useEffect(function () {
4914
- var blockchain;
4915
4913
 
4914
+ var startWithBlockchain = function startWithBlockchain(name) {
4915
+ var blockchain = web3Blockchains.Blockchain.findByName(name);
4916
+ setBlockchain(blockchain);
4917
+ setSelection(Object.assign(props.selection, {
4918
+ blockchain: blockchain,
4919
+ token: undefined
4920
+ }));
4921
+ setTokens(blockchain.tokens);
4922
+ };
4923
+
4924
+ React.useEffect(function () {
4916
4925
  if (wallet) {
4917
4926
  wallet.connectedTo().then(function (name) {
4918
- blockchain = web3Blockchains.Blockchain.findByName(name);
4919
- setBlockchain(blockchain);
4920
- setSelection(Object.assign(props.selection, {
4921
- blockchain: blockchain,
4922
- token: undefined
4923
- }));
4924
- setTokens(blockchain.tokens);
4927
+ var blockchain = web3Blockchains.Blockchain.findByName(name);
4928
+
4929
+ if (name && name.length && blockchain && blockchain.tokens && blockchain.tokens.length) {
4930
+ startWithBlockchain(name);
4931
+ } else {
4932
+ startWithBlockchain('ethereum');
4933
+ }
4925
4934
  });
4926
4935
  } else {
4927
- blockchain = web3Blockchains.Blockchain.findByName('ethereum');
4928
- setBlockchain(blockchain);
4929
- setSelection(Object.assign(props.selection, {
4930
- blockchain: blockchain,
4931
- token: undefined
4932
- }));
4933
- setTokens(blockchain.tokens);
4936
+ startWithBlockchain('ethereum');
4934
4937
  }
4935
4938
  }, []);
4936
4939
  React.useEffect(function () {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@depay/widgets",
3
3
  "moduleName": "DePayWidgets",
4
- "version": "6.5.1",
4
+ "version": "6.5.5",
5
5
  "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.",
6
6
  "main": "./dist/umd/index.js",
7
7
  "module": "./dist/esm/index.js",
@@ -45,7 +45,7 @@
45
45
  "@depay/web3-exchanges": "^8.1.0",
46
46
  "@depay/web3-payments": "^9.1.0",
47
47
  "@depay/web3-tokens": "^8.0.0",
48
- "@depay/web3-wallets": "^8.0.2",
48
+ "@depay/web3-wallets": "^8.1.0",
49
49
  "decimal.js": "^10.3.1",
50
50
  "react-rangeslider": "^2.2.0"
51
51
  },