@depay/widgets 11.4.0 → 11.4.2

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.
@@ -23218,7 +23218,7 @@ var ButtonPrimaryStyle = (function (style) {
23218
23218
  });
23219
23219
 
23220
23220
  var CardStyle = (function (style) {
23221
- return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border: 1px solid transparent;\n border-radius: 13px;\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: 8px;\n min-height: 76px;\n padding: 16px 10px;\n width: 100%;\n }\n\n .Card:focus {\n border: 1px solid ".concat(style.colors.primary, ";\n }\n\n .Card.center {\n justify-content: center;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 69px;\n padding: 7px 21px;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 19px;\n line-height: 40px;\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 .CardTokenFullName {\n width: 100%;\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: 17px;\n }\n\n .Card.Row .CardImage {\n width: 40px;\n }\n\n .Card.Row .CardImage img {\n height: 30px;\n width: 30px;\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: 8px 8px;\n margin: 0;\n }\n\n .CardImage.small {\n width: 27px;\n }\n\n .CardImage.small img {\n height: 27px;\n width: 27px;\n }\n\n .CardImage.large {\n width: 58px;\n }\n\n .CardImage.large img {\n height: 58px;\n width: 58px;\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 7px;\n }\n\n .CardImage {\n display: inline-flex;\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 58px;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 27px;\n padding-left: 10px;\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: 9999px;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 45px;\n position: relative;\n vertical-align: middle;\n width: 45px;\n }\n\n .CardImage.rounded img {\n border-radius: 8px !important;\n }\n\n .CardImage.square img {\n border-radius: 0;\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: 15px;\n color: rgb(150,150,150);\n line-height: 20px;\n }\n \n .CardText, a .CardText {\n color: ").concat(style.colors.text, ";\n flex: 1;\n font-size: 21px;\n line-height: 26px;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText.small, .CardText.small small {\n font-size: 18px;\n color: rgb(150,150,150);\n line-height: 20px;\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
23221
+ return "\n\n .Card {\n align-items: center;\n background: rgb(255,255,255);\n border: 1px solid transparent;\n border-radius: 13px;\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: 8px;\n min-height: 76px;\n padding: 16px 10px;\n width: 100%;\n }\n\n .Card:focus {\n border: 1px solid ".concat(style.colors.primary, ";\n }\n\n .Card.center {\n justify-content: center;\n }\n\n .Card.Row {\n border-radius: 0;\n margin-bottom: 0;\n box-shadow: none;\n min-height: 69px;\n padding: 7px 21px;\n border-top: 1px solid rgba(0,0,0,0.05);\n }\n\n .Card.Row .CardText {\n font-size: 19px;\n line-height: 40px;\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 .CardTokenFullName {\n width: 100%;\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: 17px;\n }\n\n .Card.Row .CardImage {\n width: 40px;\n }\n\n .Card.Row .CardImage img {\n height: 30px;\n width: 30px;\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: 8px 8px;\n margin: 0;\n }\n\n .CardImage.small {\n width: 27px;\n }\n\n .CardImage.small img {\n height: 27px;\n width: 27px;\n }\n\n .CardImage.large {\n width: 58px;\n }\n\n .CardImage.large img {\n height: 58px;\n width: 58px;\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 7px;\n }\n\n .CardImage {\n display: inline-flex;\n flex-basis: auto;\n flex-grow: 0;\n flex-shrink: 0;\n justify-content: center;\n position: relative;\n width: 58px;\n }\n\n .CardBody {\n flex-basis: auto;\n flex-grow: 1;\n flex-shrink: 1;\n line-height: 27px;\n padding-left: 10px;\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: 9999px;\n border: 1px solid white;\n box-shadow: 0 2px 8px rgb(0 0 0 / 10%);\n height: 45px;\n position: relative;\n vertical-align: middle;\n width: 45px;\n }\n\n .CardImage.rounded img {\n border-radius: 8px !important;\n }\n\n .CardImage.square img {\n border-radius: 0;\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: 15px;\n color: rgb(150,150,150);\n line-height: 20px;\n }\n \n .CardText, a .CardText {\n color: ").concat(style.colors.text, ";\n flex: 1;\n font-size: 21px;\n line-height: 26px;\n }\n\n .CardText strong {\n font-weight: 500;\n }\n\n .CardText.small, .CardText.small small {\n font-size: 17px;\n color: rgb(150,150,150);\n line-height: 20px;\n }\n\n .CardAction {\n opacity: 0.2;\n }\n\n .Card.More {\n display: inline-block;\n text-align: center;\n }\n ");
23222
23222
  });
23223
23223
 
23224
23224
  var DialogStyle = (function (style) {
@@ -27388,7 +27388,7 @@ var SaleOverviewSkeleton = (function (props) {
27388
27388
  className: "PaddingTopS PaddingLeftM PaddingRightM TextLeft"
27389
27389
  }, /*#__PURE__*/React.createElement("h1", {
27390
27390
  className: "LineHeightL FontSizeL"
27391
- }, "Purchase")),
27391
+ }, "Buy")),
27392
27392
  body: /*#__PURE__*/React.createElement("div", {
27393
27393
  className: "PaddingLeftM PaddingRightM PaddingBottomXS"
27394
27394
  }, /*#__PURE__*/React.createElement("div", {
@@ -27472,7 +27472,7 @@ var SaleOverviewDialog = (function (props) {
27472
27472
  className: "PaddingTopS PaddingLeftM PaddingRightM TextLeft"
27473
27473
  }, /*#__PURE__*/React.createElement("h1", {
27474
27474
  className: "LineHeightL FontSizeL"
27475
- }, "Purchase")),
27475
+ }, "Buy")),
27476
27476
  body: /*#__PURE__*/React.createElement("div", {
27477
27477
  className: "PaddingLeftM PaddingRightM PaddingBottomXS"
27478
27478
  }, /*#__PURE__*/React.createElement("div", {
@@ -27509,9 +27509,11 @@ var SaleOverviewDialog = (function (props) {
27509
27509
  className: "TokenSymbolCell"
27510
27510
  }, toToken.symbol), /*#__PURE__*/React.createElement("span", null, "\xA0"), /*#__PURE__*/React.createElement("span", {
27511
27511
  className: "TokenAmountCell"
27512
- }, format(toTokenReadableAmount)))), salePerTokenValue && /*#__PURE__*/React.createElement("h3", {
27513
- className: "CardText small"
27514
- }, /*#__PURE__*/React.createElement("small", null, salePerTokenValue, " per token")))), /*#__PURE__*/React.createElement("div", {
27512
+ }, format(toTokenReadableAmount))), salePerTokenValue && /*#__PURE__*/React.createElement("div", {
27513
+ className: "TokenAmountRow small grey"
27514
+ }, /*#__PURE__*/React.createElement("span", {
27515
+ className: "TokenAmountCell"
27516
+ }, salePerTokenValue, " per token"))))), /*#__PURE__*/React.createElement("div", {
27515
27517
  className: "CardAction"
27516
27518
  }, (!amountConfiguration || !amountConfiguration.fix) && /*#__PURE__*/React.createElement(ChevronRight, null))), /*#__PURE__*/React.createElement("div", {
27517
27519
  className: ["Card", paymentState == 'initialized' ? '' : 'disabled'].join(' '),
@@ -27542,7 +27544,7 @@ var SaleOverviewDialog = (function (props) {
27542
27544
  className: "TokenSymbolCell"
27543
27545
  }, payment.symbol), /*#__PURE__*/React.createElement("span", null, "\xA0"), /*#__PURE__*/React.createElement("span", {
27544
27546
  className: "TokenAmountCell"
27545
- }, format(payment.amount))), amountConfiguration && amountConfiguration.fix && /*#__PURE__*/React.createElement("div", {
27547
+ }, format(payment.amount))), /*#__PURE__*/React.createElement("div", {
27546
27548
  className: "TokenAmountRow small grey"
27547
27549
  }, /*#__PURE__*/React.createElement("span", {
27548
27550
  className: "TokenAmountCell"