@depay/widgets 6.16.2 → 6.17.0
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.
- package/README.md +4 -0
- package/dist/esm/index.bundle.js +45 -41
- package/dist/esm/index.js +15 -21
- package/dist/umd/index.bundle.js +45 -41
- package/dist/umd/index.js +15 -21
- package/package.json +4 -4
package/README.md
CHANGED
package/dist/esm/index.bundle.js
CHANGED
|
@@ -1536,29 +1536,25 @@ function ReactDialogStyle (styles) {
|
|
|
1536
1536
|
return `
|
|
1537
1537
|
.ReactDialog {
|
|
1538
1538
|
bottom: 0;
|
|
1539
|
-
display:
|
|
1539
|
+
display: flex;
|
|
1540
1540
|
height: 100%;
|
|
1541
|
+
height: 100vh;
|
|
1541
1542
|
left: 0;
|
|
1543
|
+
min-height: 100%;
|
|
1544
|
+
min-height: 100vh;
|
|
1542
1545
|
overflow: hidden;
|
|
1543
|
-
position:
|
|
1546
|
+
position: fixed;
|
|
1544
1547
|
right: 0;
|
|
1545
1548
|
top: 0;
|
|
1546
|
-
user-select: none;
|
|
1547
1549
|
width: 100%;
|
|
1550
|
+
width: 100vw;
|
|
1548
1551
|
}
|
|
1549
1552
|
|
|
1550
|
-
.
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
.ReactDialogCell {
|
|
1557
|
-
display: table-cell;
|
|
1558
|
-
height: 100%;
|
|
1559
|
-
vertical-align: middle;
|
|
1560
|
-
width: 100%;
|
|
1561
|
-
text-align: center;
|
|
1553
|
+
.ReactDialogInner {
|
|
1554
|
+
align-items: center;
|
|
1555
|
+
display: flex;
|
|
1556
|
+
flex: 1;
|
|
1557
|
+
justify-content: center;
|
|
1562
1558
|
}
|
|
1563
1559
|
|
|
1564
1560
|
.ReactDialogBackground {
|
|
@@ -1647,11 +1643,9 @@ class Dialog$1 extends react.Component {
|
|
|
1647
1643
|
return (
|
|
1648
1644
|
react.createElement('div', { className: classNames.join(' '), __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 56}}
|
|
1649
1645
|
, react.createElement('style', {__self: this, __source: {fileName: _jsxFileName$2, lineNumber: 57}}, style)
|
|
1650
|
-
, react.createElement('div', { className: "
|
|
1651
|
-
, react.createElement('div', { className: "
|
|
1652
|
-
|
|
1653
|
-
, this.props.children
|
|
1654
|
-
)
|
|
1646
|
+
, react.createElement('div', { className: "ReactDialogInner", __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 58}}
|
|
1647
|
+
, react.createElement('div', { className: "ReactDialogBackground", onClick: this.onClickBackground.bind(this), __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 59}} )
|
|
1648
|
+
, this.props.children
|
|
1655
1649
|
)
|
|
1656
1650
|
)
|
|
1657
1651
|
)
|
|
@@ -1708,9 +1702,12 @@ function ReactDialogStackStyle () {
|
|
|
1708
1702
|
return `
|
|
1709
1703
|
|
|
1710
1704
|
.ReactDialogStack {
|
|
1705
|
+
align-items: center;
|
|
1711
1706
|
bottom: 0;
|
|
1712
|
-
display:
|
|
1707
|
+
display: flex;
|
|
1708
|
+
flex: 1;
|
|
1713
1709
|
height: 100%;
|
|
1710
|
+
justify-content: center;
|
|
1714
1711
|
position: absolute;
|
|
1715
1712
|
top: 0;
|
|
1716
1713
|
transition: left 0.1s ease, opacity 0.2s ease;
|
|
@@ -1887,17 +1884,17 @@ class ReactDialogStack extends react.Component {
|
|
|
1887
1884
|
this.classForDirection(),
|
|
1888
1885
|
];
|
|
1889
1886
|
return (
|
|
1890
|
-
react.createElement('div', {
|
|
1891
|
-
|
|
1892
|
-
|
|
1893
|
-
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
)
|
|
1887
|
+
react.createElement('div', {
|
|
1888
|
+
key: index,
|
|
1889
|
+
className: ['ReactDialogStack'].concat(stackState).join(' '),
|
|
1890
|
+
onClick: this.onClick.bind(this), __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 131}}
|
|
1891
|
+
|
|
1892
|
+
, react.createElement(NavigateStackContext.Provider, {
|
|
1893
|
+
value: { navigate: this.navigate.bind(this), set: this.set.bind(this) }, __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 136}}
|
|
1894
|
+
|
|
1895
|
+
, react.createElement(CloseStackContext.Provider, { value: this.close.bind(this), __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 139}}
|
|
1896
|
+
, react.createElement(StackContext.Provider, { value: this.state.stack, __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 140}}
|
|
1897
|
+
, react.createElement('div', { className: "ReactDialogAnimation", __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 141}}, this.props.dialogs[route])
|
|
1901
1898
|
)
|
|
1902
1899
|
)
|
|
1903
1900
|
)
|
|
@@ -1912,7 +1909,7 @@ class ReactDialogStack extends react.Component {
|
|
|
1912
1909
|
event.target &&
|
|
1913
1910
|
event.target.className &&
|
|
1914
1911
|
event.target.className.match &&
|
|
1915
|
-
event.target.className.match('
|
|
1912
|
+
event.target.className.match('ReactDialogStack') // clicked background
|
|
1916
1913
|
) {
|
|
1917
1914
|
if (this.state.stack.length > 1) {
|
|
1918
1915
|
this.unstack();
|
|
@@ -48841,10 +48838,12 @@ const submitSimpleTransfer = ({ transaction, wallet })=>{
|
|
|
48841
48838
|
};
|
|
48842
48839
|
|
|
48843
48840
|
function _optionalChain$6(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
48844
|
-
|
|
48841
|
+
const setConnectedInstance = (value)=>{
|
|
48842
|
+
window._connectedWalletConnectInstance = value;
|
|
48843
|
+
};
|
|
48845
48844
|
|
|
48846
48845
|
const getConnectedInstance = ()=>{
|
|
48847
|
-
return
|
|
48846
|
+
return window._connectedWalletConnectInstance
|
|
48848
48847
|
};
|
|
48849
48848
|
|
|
48850
48849
|
class WalletConnectWallet {
|
|
@@ -48895,12 +48894,12 @@ class WalletConnectWallet {
|
|
|
48895
48894
|
});
|
|
48896
48895
|
|
|
48897
48896
|
instance.on("disconnect", (error, payload) => {
|
|
48898
|
-
|
|
48897
|
+
setConnectedInstance(undefined);
|
|
48899
48898
|
if (error) { throw error }
|
|
48900
48899
|
});
|
|
48901
48900
|
|
|
48902
48901
|
instance.on("modal_closed", ()=>{
|
|
48903
|
-
|
|
48902
|
+
setConnectedInstance(undefined);
|
|
48904
48903
|
this.connector = undefined;
|
|
48905
48904
|
});
|
|
48906
48905
|
|
|
@@ -48919,23 +48918,28 @@ class WalletConnectWallet {
|
|
|
48919
48918
|
|
|
48920
48919
|
async connect(options) {
|
|
48921
48920
|
try {
|
|
48921
|
+
if(this.connector == undefined){
|
|
48922
|
+
this.connector = this.newWalletConnectInstance();
|
|
48923
|
+
}
|
|
48924
|
+
|
|
48922
48925
|
if(this.connector.connected) {
|
|
48923
48926
|
await this.connector.killSession();
|
|
48924
|
-
|
|
48927
|
+
setConnectedInstance(undefined);
|
|
48925
48928
|
this.connector = this.newWalletConnectInstance();
|
|
48926
48929
|
}
|
|
48927
48930
|
|
|
48928
48931
|
const { accounts, chainId } = await this.connector.connect({ chainId: _optionalChain$6([options, 'optionalAccess', _ => _.chainId]) });
|
|
48929
48932
|
|
|
48930
48933
|
if(accounts instanceof Array && accounts.length) {
|
|
48931
|
-
|
|
48934
|
+
setConnectedInstance(this);
|
|
48932
48935
|
}
|
|
48933
48936
|
|
|
48934
48937
|
this.connectedAccounts = accounts;
|
|
48935
48938
|
this.connectedChainId = chainId;
|
|
48936
48939
|
|
|
48937
48940
|
return accounts
|
|
48938
|
-
} catch (
|
|
48941
|
+
} catch (error) {
|
|
48942
|
+
console.log('WALLETCONNECT ERROR', error);
|
|
48939
48943
|
return []
|
|
48940
48944
|
}
|
|
48941
48945
|
}
|
|
@@ -49488,7 +49492,7 @@ var CardStyle = (function (style) {
|
|
|
49488
49492
|
});
|
|
49489
49493
|
|
|
49490
49494
|
var DialogStyle = (function (style) {
|
|
49491
|
-
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n
|
|
49495
|
+
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n .Dialog, .ReactDialogAnimation {\n width: 100%;\n }\n }\n\n @media (orientation: portrait) and (max-width: 900px) {\n\n .ReactDialog {\n height: 100%;\n min-height: 100%;\n }\n\n .ReactDialogStack {\n align-items: flex-end;\n }\n\n .Dialog {\n align-content: stretch;\n display: flex;\n flex-direction: column;\n }\n\n .DialogBody {\n flex: 1;\n align-items: flex-end;\n }\n\n .DialogFooter {\n padding-bottom: 20px;\n }\n\n .ReactDialogAnimation {\n margin-bottom: -100px !important;\n top: inherit !important;\n position: relative;\n transition: opacity 0.4s ease, margin-bottom 0.4s ease;\n }\n\n .ReactDialog.ReactDialogOpen .ReactDialogAnimation {\n margin-bottom: 0px !important;\n }\n\n .DialogHeader {\n border-top-left-radius: 0 !important;\n border-top-right-radius: 0 !important;\n }\n\n .DialogFooter {\n border-bottom-left-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n }\n\n .ReactShadowDOMInsideContainer > .ReactDialog {\n align-items: flex-end;\n }\n }\n\n .DialogBody {\n background: rgb(248,248,248);\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n .DialogBody.ScrollHeight {\n height: 30vh !important;\n max-height: 30vh !important;\n }\n\n .DialogHeader {\n background: rgb(248,248,248);\n border-top-left-radius: 0.8rem;\n border-top-right-radius: 0.8rem;\n min-height: 3.4rem;\n position: relative;\n width: 100%;\n }\n\n .DialogHeaderActionRight {\n position: absolute;\n top: 0;\n right: 0;\n height: 3rem;\n }\n\n .DialogHeaderActionLeft {\n position: absolute;\n top: 0;\n left: 0;\n height: 3rem;\n }\n\n .DialogFooter {\n background: rgb(248,248,248);\n border-bottom-left-radius: 0.8rem;\n border-bottom-right-radius: 0.8rem;\n line-height: 1.5rem;\n min-height: 2rem;\n position: relative;\n text-align: center;\n }\n\n ";
|
|
49492
49496
|
});
|
|
49493
49497
|
|
|
49494
49498
|
var FontStyle = (function (style) {
|
package/dist/esm/index.js
CHANGED
|
@@ -1394,29 +1394,25 @@ function ReactDialogStyle (styles) {
|
|
|
1394
1394
|
return `
|
|
1395
1395
|
.ReactDialog {
|
|
1396
1396
|
bottom: 0;
|
|
1397
|
-
display:
|
|
1397
|
+
display: flex;
|
|
1398
1398
|
height: 100%;
|
|
1399
|
+
height: 100vh;
|
|
1399
1400
|
left: 0;
|
|
1401
|
+
min-height: 100%;
|
|
1402
|
+
min-height: 100vh;
|
|
1400
1403
|
overflow: hidden;
|
|
1401
|
-
position:
|
|
1404
|
+
position: fixed;
|
|
1402
1405
|
right: 0;
|
|
1403
1406
|
top: 0;
|
|
1404
|
-
user-select: none;
|
|
1405
|
-
width: 100%;
|
|
1406
|
-
}
|
|
1407
|
-
|
|
1408
|
-
.ReactDialogRow {
|
|
1409
|
-
display: table-row;
|
|
1410
|
-
height: 100%;
|
|
1411
1407
|
width: 100%;
|
|
1408
|
+
width: 100vw;
|
|
1412
1409
|
}
|
|
1413
1410
|
|
|
1414
|
-
.
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
text-align: center;
|
|
1411
|
+
.ReactDialogInner {
|
|
1412
|
+
align-items: center;
|
|
1413
|
+
display: flex;
|
|
1414
|
+
flex: 1;
|
|
1415
|
+
justify-content: center;
|
|
1420
1416
|
}
|
|
1421
1417
|
|
|
1422
1418
|
.ReactDialogBackground {
|
|
@@ -1505,11 +1501,9 @@ class Dialog extends React.Component {
|
|
|
1505
1501
|
return (
|
|
1506
1502
|
React.createElement('div', { className: classNames.join(' '), __self: this, __source: {fileName: _jsxFileName, lineNumber: 56}}
|
|
1507
1503
|
, React.createElement('style', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 57}}, style)
|
|
1508
|
-
, React.createElement('div', { className: "
|
|
1509
|
-
, React.createElement('div', { className: "
|
|
1510
|
-
|
|
1511
|
-
, this.props.children
|
|
1512
|
-
)
|
|
1504
|
+
, React.createElement('div', { className: "ReactDialogInner", __self: this, __source: {fileName: _jsxFileName, lineNumber: 58}}
|
|
1505
|
+
, React.createElement('div', { className: "ReactDialogBackground", onClick: this.onClickBackground.bind(this), __self: this, __source: {fileName: _jsxFileName, lineNumber: 59}} )
|
|
1506
|
+
, this.props.children
|
|
1513
1507
|
)
|
|
1514
1508
|
)
|
|
1515
1509
|
)
|
|
@@ -1684,7 +1678,7 @@ var CardStyle = (function (style) {
|
|
|
1684
1678
|
});
|
|
1685
1679
|
|
|
1686
1680
|
var DialogStyle = (function (style) {
|
|
1687
|
-
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n
|
|
1681
|
+
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n .Dialog, .ReactDialogAnimation {\n width: 100%;\n }\n }\n\n @media (orientation: portrait) and (max-width: 900px) {\n\n .ReactDialog {\n height: 100%;\n min-height: 100%;\n }\n\n .ReactDialogStack {\n align-items: flex-end;\n }\n\n .Dialog {\n align-content: stretch;\n display: flex;\n flex-direction: column;\n }\n\n .DialogBody {\n flex: 1;\n align-items: flex-end;\n }\n\n .DialogFooter {\n padding-bottom: 20px;\n }\n\n .ReactDialogAnimation {\n margin-bottom: -100px !important;\n top: inherit !important;\n position: relative;\n transition: opacity 0.4s ease, margin-bottom 0.4s ease;\n }\n\n .ReactDialog.ReactDialogOpen .ReactDialogAnimation {\n margin-bottom: 0px !important;\n }\n\n .DialogHeader {\n border-top-left-radius: 0 !important;\n border-top-right-radius: 0 !important;\n }\n\n .DialogFooter {\n border-bottom-left-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n }\n\n .ReactShadowDOMInsideContainer > .ReactDialog {\n align-items: flex-end;\n }\n }\n\n .DialogBody {\n background: rgb(248,248,248);\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n .DialogBody.ScrollHeight {\n height: 30vh !important;\n max-height: 30vh !important;\n }\n\n .DialogHeader {\n background: rgb(248,248,248);\n border-top-left-radius: 0.8rem;\n border-top-right-radius: 0.8rem;\n min-height: 3.4rem;\n position: relative;\n width: 100%;\n }\n\n .DialogHeaderActionRight {\n position: absolute;\n top: 0;\n right: 0;\n height: 3rem;\n }\n\n .DialogHeaderActionLeft {\n position: absolute;\n top: 0;\n left: 0;\n height: 3rem;\n }\n\n .DialogFooter {\n background: rgb(248,248,248);\n border-bottom-left-radius: 0.8rem;\n border-bottom-right-radius: 0.8rem;\n line-height: 1.5rem;\n min-height: 2rem;\n position: relative;\n text-align: center;\n }\n\n ";
|
|
1688
1682
|
});
|
|
1689
1683
|
|
|
1690
1684
|
var FontStyle = (function (style) {
|
package/dist/umd/index.bundle.js
CHANGED
|
@@ -1542,29 +1542,25 @@
|
|
|
1542
1542
|
return `
|
|
1543
1543
|
.ReactDialog {
|
|
1544
1544
|
bottom: 0;
|
|
1545
|
-
display:
|
|
1545
|
+
display: flex;
|
|
1546
1546
|
height: 100%;
|
|
1547
|
+
height: 100vh;
|
|
1547
1548
|
left: 0;
|
|
1549
|
+
min-height: 100%;
|
|
1550
|
+
min-height: 100vh;
|
|
1548
1551
|
overflow: hidden;
|
|
1549
|
-
position:
|
|
1552
|
+
position: fixed;
|
|
1550
1553
|
right: 0;
|
|
1551
1554
|
top: 0;
|
|
1552
|
-
user-select: none;
|
|
1553
1555
|
width: 100%;
|
|
1556
|
+
width: 100vw;
|
|
1554
1557
|
}
|
|
1555
1558
|
|
|
1556
|
-
.
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
.ReactDialogCell {
|
|
1563
|
-
display: table-cell;
|
|
1564
|
-
height: 100%;
|
|
1565
|
-
vertical-align: middle;
|
|
1566
|
-
width: 100%;
|
|
1567
|
-
text-align: center;
|
|
1559
|
+
.ReactDialogInner {
|
|
1560
|
+
align-items: center;
|
|
1561
|
+
display: flex;
|
|
1562
|
+
flex: 1;
|
|
1563
|
+
justify-content: center;
|
|
1568
1564
|
}
|
|
1569
1565
|
|
|
1570
1566
|
.ReactDialogBackground {
|
|
@@ -1653,11 +1649,9 @@
|
|
|
1653
1649
|
return (
|
|
1654
1650
|
react.createElement('div', { className: classNames.join(' '), __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 56}}
|
|
1655
1651
|
, react.createElement('style', {__self: this, __source: {fileName: _jsxFileName$2, lineNumber: 57}}, style)
|
|
1656
|
-
, react.createElement('div', { className: "
|
|
1657
|
-
, react.createElement('div', { className: "
|
|
1658
|
-
|
|
1659
|
-
, this.props.children
|
|
1660
|
-
)
|
|
1652
|
+
, react.createElement('div', { className: "ReactDialogInner", __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 58}}
|
|
1653
|
+
, react.createElement('div', { className: "ReactDialogBackground", onClick: this.onClickBackground.bind(this), __self: this, __source: {fileName: _jsxFileName$2, lineNumber: 59}} )
|
|
1654
|
+
, this.props.children
|
|
1661
1655
|
)
|
|
1662
1656
|
)
|
|
1663
1657
|
)
|
|
@@ -1714,9 +1708,12 @@
|
|
|
1714
1708
|
return `
|
|
1715
1709
|
|
|
1716
1710
|
.ReactDialogStack {
|
|
1711
|
+
align-items: center;
|
|
1717
1712
|
bottom: 0;
|
|
1718
|
-
display:
|
|
1713
|
+
display: flex;
|
|
1714
|
+
flex: 1;
|
|
1719
1715
|
height: 100%;
|
|
1716
|
+
justify-content: center;
|
|
1720
1717
|
position: absolute;
|
|
1721
1718
|
top: 0;
|
|
1722
1719
|
transition: left 0.1s ease, opacity 0.2s ease;
|
|
@@ -1893,17 +1890,17 @@
|
|
|
1893
1890
|
this.classForDirection(),
|
|
1894
1891
|
];
|
|
1895
1892
|
return (
|
|
1896
|
-
react.createElement('div', {
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
|
|
1906
|
-
)
|
|
1893
|
+
react.createElement('div', {
|
|
1894
|
+
key: index,
|
|
1895
|
+
className: ['ReactDialogStack'].concat(stackState).join(' '),
|
|
1896
|
+
onClick: this.onClick.bind(this), __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 131}}
|
|
1897
|
+
|
|
1898
|
+
, react.createElement(NavigateStackContext.Provider, {
|
|
1899
|
+
value: { navigate: this.navigate.bind(this), set: this.set.bind(this) }, __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 136}}
|
|
1900
|
+
|
|
1901
|
+
, react.createElement(CloseStackContext.Provider, { value: this.close.bind(this), __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 139}}
|
|
1902
|
+
, react.createElement(StackContext.Provider, { value: this.state.stack, __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 140}}
|
|
1903
|
+
, react.createElement('div', { className: "ReactDialogAnimation", __self: this, __source: {fileName: _jsxFileName$1, lineNumber: 141}}, this.props.dialogs[route])
|
|
1907
1904
|
)
|
|
1908
1905
|
)
|
|
1909
1906
|
)
|
|
@@ -1918,7 +1915,7 @@
|
|
|
1918
1915
|
event.target &&
|
|
1919
1916
|
event.target.className &&
|
|
1920
1917
|
event.target.className.match &&
|
|
1921
|
-
event.target.className.match('
|
|
1918
|
+
event.target.className.match('ReactDialogStack') // clicked background
|
|
1922
1919
|
) {
|
|
1923
1920
|
if (this.state.stack.length > 1) {
|
|
1924
1921
|
this.unstack();
|
|
@@ -48847,10 +48844,12 @@
|
|
|
48847
48844
|
};
|
|
48848
48845
|
|
|
48849
48846
|
function _optionalChain$6(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
48850
|
-
|
|
48847
|
+
const setConnectedInstance = (value)=>{
|
|
48848
|
+
window._connectedWalletConnectInstance = value;
|
|
48849
|
+
};
|
|
48851
48850
|
|
|
48852
48851
|
const getConnectedInstance = ()=>{
|
|
48853
|
-
return
|
|
48852
|
+
return window._connectedWalletConnectInstance
|
|
48854
48853
|
};
|
|
48855
48854
|
|
|
48856
48855
|
class WalletConnectWallet {
|
|
@@ -48901,12 +48900,12 @@
|
|
|
48901
48900
|
});
|
|
48902
48901
|
|
|
48903
48902
|
instance.on("disconnect", (error, payload) => {
|
|
48904
|
-
|
|
48903
|
+
setConnectedInstance(undefined);
|
|
48905
48904
|
if (error) { throw error }
|
|
48906
48905
|
});
|
|
48907
48906
|
|
|
48908
48907
|
instance.on("modal_closed", ()=>{
|
|
48909
|
-
|
|
48908
|
+
setConnectedInstance(undefined);
|
|
48910
48909
|
this.connector = undefined;
|
|
48911
48910
|
});
|
|
48912
48911
|
|
|
@@ -48925,23 +48924,28 @@
|
|
|
48925
48924
|
|
|
48926
48925
|
async connect(options) {
|
|
48927
48926
|
try {
|
|
48927
|
+
if(this.connector == undefined){
|
|
48928
|
+
this.connector = this.newWalletConnectInstance();
|
|
48929
|
+
}
|
|
48930
|
+
|
|
48928
48931
|
if(this.connector.connected) {
|
|
48929
48932
|
await this.connector.killSession();
|
|
48930
|
-
|
|
48933
|
+
setConnectedInstance(undefined);
|
|
48931
48934
|
this.connector = this.newWalletConnectInstance();
|
|
48932
48935
|
}
|
|
48933
48936
|
|
|
48934
48937
|
const { accounts, chainId } = await this.connector.connect({ chainId: _optionalChain$6([options, 'optionalAccess', _ => _.chainId]) });
|
|
48935
48938
|
|
|
48936
48939
|
if(accounts instanceof Array && accounts.length) {
|
|
48937
|
-
|
|
48940
|
+
setConnectedInstance(this);
|
|
48938
48941
|
}
|
|
48939
48942
|
|
|
48940
48943
|
this.connectedAccounts = accounts;
|
|
48941
48944
|
this.connectedChainId = chainId;
|
|
48942
48945
|
|
|
48943
48946
|
return accounts
|
|
48944
|
-
} catch (
|
|
48947
|
+
} catch (error) {
|
|
48948
|
+
console.log('WALLETCONNECT ERROR', error);
|
|
48945
48949
|
return []
|
|
48946
48950
|
}
|
|
48947
48951
|
}
|
|
@@ -49494,7 +49498,7 @@
|
|
|
49494
49498
|
});
|
|
49495
49499
|
|
|
49496
49500
|
var DialogStyle = (function (style) {
|
|
49497
|
-
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n
|
|
49501
|
+
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n .Dialog, .ReactDialogAnimation {\n width: 100%;\n }\n }\n\n @media (orientation: portrait) and (max-width: 900px) {\n\n .ReactDialog {\n height: 100%;\n min-height: 100%;\n }\n\n .ReactDialogStack {\n align-items: flex-end;\n }\n\n .Dialog {\n align-content: stretch;\n display: flex;\n flex-direction: column;\n }\n\n .DialogBody {\n flex: 1;\n align-items: flex-end;\n }\n\n .DialogFooter {\n padding-bottom: 20px;\n }\n\n .ReactDialogAnimation {\n margin-bottom: -100px !important;\n top: inherit !important;\n position: relative;\n transition: opacity 0.4s ease, margin-bottom 0.4s ease;\n }\n\n .ReactDialog.ReactDialogOpen .ReactDialogAnimation {\n margin-bottom: 0px !important;\n }\n\n .DialogHeader {\n border-top-left-radius: 0 !important;\n border-top-right-radius: 0 !important;\n }\n\n .DialogFooter {\n border-bottom-left-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n }\n\n .ReactShadowDOMInsideContainer > .ReactDialog {\n align-items: flex-end;\n }\n }\n\n .DialogBody {\n background: rgb(248,248,248);\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n .DialogBody.ScrollHeight {\n height: 30vh !important;\n max-height: 30vh !important;\n }\n\n .DialogHeader {\n background: rgb(248,248,248);\n border-top-left-radius: 0.8rem;\n border-top-right-radius: 0.8rem;\n min-height: 3.4rem;\n position: relative;\n width: 100%;\n }\n\n .DialogHeaderActionRight {\n position: absolute;\n top: 0;\n right: 0;\n height: 3rem;\n }\n\n .DialogHeaderActionLeft {\n position: absolute;\n top: 0;\n left: 0;\n height: 3rem;\n }\n\n .DialogFooter {\n background: rgb(248,248,248);\n border-bottom-left-radius: 0.8rem;\n border-bottom-right-radius: 0.8rem;\n line-height: 1.5rem;\n min-height: 2rem;\n position: relative;\n text-align: center;\n }\n\n ";
|
|
49498
49502
|
});
|
|
49499
49503
|
|
|
49500
49504
|
var FontStyle = (function (style) {
|
package/dist/umd/index.js
CHANGED
|
@@ -1389,29 +1389,25 @@
|
|
|
1389
1389
|
return `
|
|
1390
1390
|
.ReactDialog {
|
|
1391
1391
|
bottom: 0;
|
|
1392
|
-
display:
|
|
1392
|
+
display: flex;
|
|
1393
1393
|
height: 100%;
|
|
1394
|
+
height: 100vh;
|
|
1394
1395
|
left: 0;
|
|
1396
|
+
min-height: 100%;
|
|
1397
|
+
min-height: 100vh;
|
|
1395
1398
|
overflow: hidden;
|
|
1396
|
-
position:
|
|
1399
|
+
position: fixed;
|
|
1397
1400
|
right: 0;
|
|
1398
1401
|
top: 0;
|
|
1399
|
-
user-select: none;
|
|
1400
|
-
width: 100%;
|
|
1401
|
-
}
|
|
1402
|
-
|
|
1403
|
-
.ReactDialogRow {
|
|
1404
|
-
display: table-row;
|
|
1405
|
-
height: 100%;
|
|
1406
1402
|
width: 100%;
|
|
1403
|
+
width: 100vw;
|
|
1407
1404
|
}
|
|
1408
1405
|
|
|
1409
|
-
.
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
text-align: center;
|
|
1406
|
+
.ReactDialogInner {
|
|
1407
|
+
align-items: center;
|
|
1408
|
+
display: flex;
|
|
1409
|
+
flex: 1;
|
|
1410
|
+
justify-content: center;
|
|
1415
1411
|
}
|
|
1416
1412
|
|
|
1417
1413
|
.ReactDialogBackground {
|
|
@@ -1500,11 +1496,9 @@
|
|
|
1500
1496
|
return (
|
|
1501
1497
|
React__default["default"].createElement('div', { className: classNames.join(' '), __self: this, __source: {fileName: _jsxFileName, lineNumber: 56}}
|
|
1502
1498
|
, React__default["default"].createElement('style', {__self: this, __source: {fileName: _jsxFileName, lineNumber: 57}}, style)
|
|
1503
|
-
, React__default["default"].createElement('div', { className: "
|
|
1504
|
-
, React__default["default"].createElement('div', { className: "
|
|
1505
|
-
|
|
1506
|
-
, this.props.children
|
|
1507
|
-
)
|
|
1499
|
+
, React__default["default"].createElement('div', { className: "ReactDialogInner", __self: this, __source: {fileName: _jsxFileName, lineNumber: 58}}
|
|
1500
|
+
, React__default["default"].createElement('div', { className: "ReactDialogBackground", onClick: this.onClickBackground.bind(this), __self: this, __source: {fileName: _jsxFileName, lineNumber: 59}} )
|
|
1501
|
+
, this.props.children
|
|
1508
1502
|
)
|
|
1509
1503
|
)
|
|
1510
1504
|
)
|
|
@@ -1679,7 +1673,7 @@
|
|
|
1679
1673
|
});
|
|
1680
1674
|
|
|
1681
1675
|
var DialogStyle = (function (style) {
|
|
1682
|
-
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n
|
|
1676
|
+
return "\n\n .ReactDialogBackground {\n backdrop-filter: blur(5px);\n background: rgba(0,0,0,0.7);\n }\n\n .Dialog {\n margin: 0 auto;\n position: relative;\n width: 420px;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n border-radius: 0.8rem;\n background: rgb(248,248,248);\n }\n\n @media screen and (max-width: 450px) {\n .Dialog, .ReactDialogAnimation {\n width: 100%;\n }\n }\n\n @media (orientation: portrait) and (max-width: 900px) {\n\n .ReactDialog {\n height: 100%;\n min-height: 100%;\n }\n\n .ReactDialogStack {\n align-items: flex-end;\n }\n\n .Dialog {\n align-content: stretch;\n display: flex;\n flex-direction: column;\n }\n\n .DialogBody {\n flex: 1;\n align-items: flex-end;\n }\n\n .DialogFooter {\n padding-bottom: 20px;\n }\n\n .ReactDialogAnimation {\n margin-bottom: -100px !important;\n top: inherit !important;\n position: relative;\n transition: opacity 0.4s ease, margin-bottom 0.4s ease;\n }\n\n .ReactDialog.ReactDialogOpen .ReactDialogAnimation {\n margin-bottom: 0px !important;\n }\n\n .DialogHeader {\n border-top-left-radius: 0 !important;\n border-top-right-radius: 0 !important;\n }\n\n .DialogFooter {\n border-bottom-left-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n }\n\n .ReactShadowDOMInsideContainer > .ReactDialog {\n align-items: flex-end;\n }\n }\n\n .DialogBody {\n background: rgb(248,248,248);\n overflow-x: hidden;\n overflow-y: auto;\n }\n\n .DialogBody.ScrollHeight {\n height: 30vh !important;\n max-height: 30vh !important;\n }\n\n .DialogHeader {\n background: rgb(248,248,248);\n border-top-left-radius: 0.8rem;\n border-top-right-radius: 0.8rem;\n min-height: 3.4rem;\n position: relative;\n width: 100%;\n }\n\n .DialogHeaderActionRight {\n position: absolute;\n top: 0;\n right: 0;\n height: 3rem;\n }\n\n .DialogHeaderActionLeft {\n position: absolute;\n top: 0;\n left: 0;\n height: 3rem;\n }\n\n .DialogFooter {\n background: rgb(248,248,248);\n border-bottom-left-radius: 0.8rem;\n border-bottom-right-radius: 0.8rem;\n line-height: 1.5rem;\n min-height: 2rem;\n position: relative;\n text-align: center;\n }\n\n ";
|
|
1683
1677
|
});
|
|
1684
1678
|
|
|
1685
1679
|
var FontStyle = (function (style) {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@depay/widgets",
|
|
3
3
|
"moduleName": "DePayWidgets",
|
|
4
|
-
"version": "6.
|
|
4
|
+
"version": "6.17.0",
|
|
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",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"@depay/local-currency": "^3.0.0",
|
|
37
|
-
"@depay/react-dialog-stack": "^
|
|
37
|
+
"@depay/react-dialog-stack": "^5.0.1",
|
|
38
38
|
"@depay/react-shadow-dom": "^4.0.0",
|
|
39
39
|
"@depay/react-token-image": "^3.0.0",
|
|
40
|
-
"@depay/walletconnect-v1": "^1.0
|
|
40
|
+
"@depay/walletconnect-v1": "^1.1.0",
|
|
41
41
|
"@depay/web3-assets": "^5.2.0",
|
|
42
42
|
"@depay/web3-blockchains": "^4.2.0",
|
|
43
43
|
"@depay/web3-client": "^8.0.0",
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
"@depay/web3-exchanges": "^8.1.0",
|
|
46
46
|
"@depay/web3-payments": "^9.3.3",
|
|
47
47
|
"@depay/web3-tokens": "^8.0.1",
|
|
48
|
-
"@depay/web3-wallets": "^9.0
|
|
48
|
+
"@depay/web3-wallets": "^9.1.0",
|
|
49
49
|
"decimal.js": "^10.3.1",
|
|
50
50
|
"react-rangeslider": "^2.2.0"
|
|
51
51
|
},
|