@ape.swap/bonds-sdk 1.0.206 → 1.0.208
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/dist/components/BondModal/BondModal.js +1 -3
- package/dist/components/BondSingle/BondSingle.js +1 -3
- package/dist/components/Bonds/Bonds.js +4 -6
- package/dist/components/ProgressBar/ProgressBarWrapper.js +1 -4
- package/dist/components/Tooltip/Tooltip.js +1 -2
- package/dist/components/uikit/Input/Input.js +1 -3
- package/dist/components/uikit-sdk/Button/Button.d.ts +4 -0
- package/dist/components/uikit-sdk/Button/Button.js +91 -0
- package/dist/components/uikit-sdk/Button/IconButton.d.ts +4 -0
- package/dist/components/uikit-sdk/Button/IconButton.js +33 -0
- package/dist/components/uikit-sdk/Button/index.d.ts +2 -0
- package/dist/components/uikit-sdk/Button/index.js +2 -0
- package/dist/components/uikit-sdk/Button/styles.d.ts +3 -0
- package/dist/components/uikit-sdk/Button/styles.js +30 -0
- package/dist/components/uikit-sdk/Button/types.d.ts +46 -0
- package/dist/components/uikit-sdk/Button/types.js +37 -0
- package/dist/components/uikit-sdk/index.d.ts +1 -0
- package/dist/components/uikit-sdk/index.js +2 -0
- package/dist/config/constants/chains.d.ts +1 -1
- package/dist/config/constants/chains.js +1 -1
- package/dist/contexts/ModalContext.js +1 -1
- package/package.json +1 -1
|
@@ -17,14 +17,12 @@ import { useWeb3React } from '@web3-react/core';
|
|
|
17
17
|
import { defaultTheme } from '../../theme';
|
|
18
18
|
import '../../scss/BondModal.scss';
|
|
19
19
|
import getTimePeriods from '../../utils/getTimePeriods';
|
|
20
|
-
import { Button } from '../uikit/Button';
|
|
21
|
-
import Svg from '../uikit/Svg';
|
|
22
20
|
import axios from 'axios';
|
|
23
21
|
import { BigNumber } from 'bignumber.js';
|
|
24
22
|
import { getFirstNonZeroDigits } from '../../utils/roundNumber';
|
|
25
23
|
import { useNavigate } from 'react-router-dom';
|
|
26
24
|
import { isNumber } from '../../utils/numbers';
|
|
27
|
-
import TooltipBubble from '../uikit-sdk
|
|
25
|
+
import { TooltipBubble, Button, Svg } from '../uikit-sdk';
|
|
28
26
|
import { TooltipText } from '../../enum/tooltips';
|
|
29
27
|
var BondModal = function (_a) {
|
|
30
28
|
var isOpen = _a.isOpen, onClose = _a.onClose, bondAddress = _a.bondAddress;
|
|
@@ -17,14 +17,12 @@ import { useWeb3React } from '@web3-react/core';
|
|
|
17
17
|
import { defaultTheme } from '../../theme';
|
|
18
18
|
import '../../scss/BondSingle.scss';
|
|
19
19
|
import getTimePeriods from '../../utils/getTimePeriods';
|
|
20
|
-
import { Button } from '../uikit/Button';
|
|
21
|
-
import Svg from '../uikit/Svg';
|
|
22
20
|
import axios from 'axios';
|
|
23
21
|
import { BigNumber } from 'bignumber.js';
|
|
24
22
|
import { getFirstNonZeroDigits } from '../../utils/roundNumber';
|
|
25
23
|
import { useParams } from 'react-router-dom';
|
|
26
24
|
import { isNumber } from '../../utils/numbers';
|
|
27
|
-
import TooltipBubble from '../uikit-sdk
|
|
25
|
+
import { Button, Svg, TooltipBubble } from '../uikit-sdk';
|
|
28
26
|
import { TooltipText } from '../../enum/tooltips';
|
|
29
27
|
var BondSingle = function (_a) {
|
|
30
28
|
var billAddress = useParams().billAddress;
|
|
@@ -55,7 +55,6 @@ import { useWeb3React } from '@web3-react/core';
|
|
|
55
55
|
import { useSearchParams, useNavigate } from 'react-router-dom';
|
|
56
56
|
import getTimePeriods from '../../utils/getTimePeriods';
|
|
57
57
|
import { defaultTheme } from '../../theme';
|
|
58
|
-
import Svg from '../uikit/Svg';
|
|
59
58
|
import '../../scss/Bonds.scss';
|
|
60
59
|
import { BigNumber } from 'bignumber.js';
|
|
61
60
|
import { ChainId } from '../../enum/chains';
|
|
@@ -63,8 +62,7 @@ import ProgressBarWrapper from '../ProgressBar/ProgressBarWrapper';
|
|
|
63
62
|
import ProgressBar from '../ProgressBar/ProgressBar';
|
|
64
63
|
import { formatDollar, formatValue } from '../../utils/formatNumbers';
|
|
65
64
|
import { TooltipText } from '../../enum/tooltips';
|
|
66
|
-
import TooltipBubble from '../uikit-sdk
|
|
67
|
-
import Tooltip from '../Tooltip/Tooltip';
|
|
65
|
+
import { TooltipBubble, Svg } from '../uikit-sdk';
|
|
68
66
|
import { BLOCK_EXPLORER } from '../../config/constants/chains';
|
|
69
67
|
var Bonds = function (_a) {
|
|
70
68
|
var connectionString = _a.connectionString;
|
|
@@ -188,8 +186,8 @@ var Bonds = function (_a) {
|
|
|
188
186
|
return "".concat(explorerLink, "/address/").concat(bond === null || bond === void 0 ? void 0 : bond.billAddress);
|
|
189
187
|
};
|
|
190
188
|
return (_jsxs(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: [isActive && account && _jsx("p", { children: account }), isActive && account && _jsx("button", __assign({ onClick: handleApprove }, { children: "Approve USDT" })), _jsxs(Flex, __assign({ className: "container table-container" }, { children: [_jsxs(Flex, __assign({ className: "container header-container" }, { children: [_jsx(Flex, __assign({ className: "column column-token" }, { children: "Tokens" })), _jsx(Flex, __assign({ className: "column column-discount" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(18%, -4%)" }, { children: ["Discount", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column column-arr" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(8%, -5%)" }, { children: ["ARR", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column column-term" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomRight", transformTip: "translate(11%, -5%)" }, { children: ["Terms", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column column-tokensremaining" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.TokensRemaining }), width: "230px", placement: "bottomRight", transformTip: "translate(12%, -4%)" }, { children: ["Tokens Remaining", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, { className: "column column-hotbond" })] })), sortedBonds.map(function (bond) {
|
|
191
|
-
var _a, _b, _c
|
|
192
|
-
return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bond); } }, { children: [
|
|
189
|
+
var _a, _b, _c;
|
|
190
|
+
return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bond); } }, { children: [_jsx(Flex, __assign({ className: "column column-token" }, { children: bond.showcaseTokenName })), _jsx(Flex, __assign({ className: "column column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: "".concat((_a = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _a === void 0 ? void 0 : _a.toFixed(2), "%") })), _jsx(Flex, __assign({ className: "column column-arr" }, { children: "".concat(((((_b = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _b !== void 0 ? _b : 0) * 365) / vestingTime(bond.vestingTerm).days).toFixed(2), "%") })), _jsx(Flex, __assign({ className: "column column-term" }, { children: vestingTime(bond.vestingTerm).days ? "".concat(vestingTime(bond.vestingTerm).days, " D") : '-' })), _jsx(Flex, __assign({ className: "column column-tokensremaining" }, { children: _jsx(ProgressBarWrapper, { title: '', value: _jsx(ProgressBar, { value: remainingPercentage(bond) }), style: {
|
|
193
191
|
width: '127px',
|
|
194
192
|
height: '25px',
|
|
195
193
|
flexDirection: 'column',
|
|
@@ -198,7 +196,7 @@ var Bonds = function (_a) {
|
|
|
198
196
|
}, showTooltip: true, toolTip: "".concat(remainingTokensFormat(bond), " ").concat(bond.payoutTokenName, " (").concat(formatDollar({
|
|
199
197
|
num: remainingTokensUsd(bond).toNumber(),
|
|
200
198
|
isPrice: true,
|
|
201
|
-
}), ")") }) })), _jsx(Flex, __assign({ className: "column column-hotbond" }, { children: _jsx(Flex, __assign({ className: "column column-icon" }, { children: hotBonds.includes(bond.billAddress.toLowerCase()) && ((
|
|
199
|
+
}), ")") }) })), _jsx(Flex, __assign({ className: "column column-hotbond" }, { children: _jsx(Flex, __assign({ className: "column column-icon" }, { children: hotBonds.includes(bond.billAddress.toLowerCase()) && ((_c = bond.discount) !== null && _c !== void 0 ? _c : 0) > 0 && (_jsx(Svg, { icon: "hot", width: "20px" })) })) }))] }), bond.billAddress));
|
|
202
200
|
})] }))] })));
|
|
203
201
|
};
|
|
204
202
|
export default Bonds;
|
|
@@ -12,10 +12,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
12
12
|
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
13
13
|
import React from 'react';
|
|
14
14
|
import { styles } from './styles';
|
|
15
|
-
import Flex from '../uikit-sdk
|
|
16
|
-
import Text from '../uikit-sdk/Text';
|
|
17
|
-
import TooltipBubble from '../uikit-sdk/TooltipBubble';
|
|
18
|
-
import Skeleton from '../uikit-sdk/Skeleton';
|
|
15
|
+
import { Flex, Text, TooltipBubble, Skeleton } from '../uikit-sdk';
|
|
19
16
|
var ProgressBarWrapper = function (_a) {
|
|
20
17
|
var title = _a.title, value = _a.value, style = _a.style, showTooltip = _a.showTooltip, toolTipPlacement = _a.toolTipPlacement, toolTipTransform = _a.toolTipTransform, toolTip = _a.toolTip;
|
|
21
18
|
return (_jsxs(Flex, __assign({ sx: style }, { children: [_jsx(Flex, __assign({ sx: { alignItems: 'center' } }, { children: _jsx(Text, __assign({ sx: styles.titleText }, { children: "".concat(title) })) })), showTooltip ? (_jsx(Flex, __assign({ sx: { alignItems: 'center', width: '100%' } }, { children: _jsx(TooltipBubble, __assign({ placement: toolTipPlacement, transformTip: toolTipTransform, body: _jsx(Flex, __assign({ sx: { justifyContent: 'center' } }, { children: toolTip })), width: "250px" }, { children: _jsx(Flex, __assign({ sx: { justifyContent: 'center', alignItems: 'center', width: '127px' } }, { children: value ? value : _jsx(Skeleton, { sx: styles.skeleton }) })) })) }))) : (_jsx(Flex, __assign({ sx: { justifyContent: 'center', alignItems: 'center' } }, { children: value ? value : _jsx(Skeleton, { sx: styles.skeleton }) })))] })));
|
|
@@ -14,8 +14,7 @@ import { useTranslation } from '../../contexts/Localization';
|
|
|
14
14
|
import { styles } from './styles';
|
|
15
15
|
import { BLOCK_EXPLORER } from '../../config/constants/chains';
|
|
16
16
|
import ButtonsRow from './ButtonsRow';
|
|
17
|
-
import { Flex, Link, Text } from '../uikit-sdk';
|
|
18
|
-
import { Svg } from '../uikit';
|
|
17
|
+
import { Flex, Link, Text, Svg } from '../uikit-sdk';
|
|
19
18
|
var Tooltip = function (_a) {
|
|
20
19
|
var valueTitle = _a.valueTitle, valueContent = _a.valueContent, value2Title = _a.value2Title, value2Content = _a.value2Content, tokenContract = _a.tokenContract, secondURL = _a.secondURL, secondURLTitle = _a.secondURLTitle, projectLink = _a.projectLink, twitter = _a.twitter, audit = _a.audit, thirdURL = _a.thirdURL, thirdURLTitle = _a.thirdURLTitle, chain = _a.chain;
|
|
21
20
|
var t = useTranslation().t;
|
|
@@ -22,9 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
22
22
|
};
|
|
23
23
|
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
24
24
|
import { Input as ThemeInput, Spinner } from 'theme-ui';
|
|
25
|
-
import { Text } from '../../uikit';
|
|
26
|
-
import Flex from '../Flex';
|
|
27
|
-
import Svg from '../Svg';
|
|
25
|
+
import { Text, Flex, Svg } from '../../uikit';
|
|
28
26
|
var colorScheme = {
|
|
29
27
|
default: 'gray',
|
|
30
28
|
error: 'red',
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
24
|
+
import React from 'react';
|
|
25
|
+
import { Button as ThemeUIButton, Spinner } from 'theme-ui';
|
|
26
|
+
import { variants, buttonFontSizes, buttonPadding, sizes, buttonLineHeight } from './types';
|
|
27
|
+
var Button = function (_a) {
|
|
28
|
+
var _b = _a.variant, variant = _b === void 0 ? variants.PRIMARY : _b, _c = _a.size, size = _c === void 0 ? sizes.MEDIUM : _c, load = _a.load, children = _a.children, startIcon = _a.startIcon, endIcon = _a.endIcon, fullWidth = _a.fullWidth, disabled = _a.disabled, props = __rest(_a, ["variant", "size", "load", "children", "startIcon", "endIcon", "fullWidth", "disabled"]);
|
|
29
|
+
var hoverStyle = {
|
|
30
|
+
'&:hover': {
|
|
31
|
+
'&:not([disabled])': {
|
|
32
|
+
borderColor: 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
33
|
+
background: variant === 'primary' && 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
34
|
+
opacity: 1,
|
|
35
|
+
},
|
|
36
|
+
'&:disabled': {},
|
|
37
|
+
},
|
|
38
|
+
};
|
|
39
|
+
if (variant === 'secondary') {
|
|
40
|
+
hoverStyle = {
|
|
41
|
+
'&:hover': {
|
|
42
|
+
'&:not([disabled])': hoverStyle['&:hover']['&:not([disabled])'],
|
|
43
|
+
'&:disabled': {
|
|
44
|
+
color: 'secondaryButtonDisableColor',
|
|
45
|
+
borderColor: 'secondaryButtonDisable',
|
|
46
|
+
opacity: 0.6,
|
|
47
|
+
},
|
|
48
|
+
},
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
if (variant === 'tertiary') {
|
|
52
|
+
hoverStyle = {
|
|
53
|
+
'&:hover': {
|
|
54
|
+
'&:not([disabled])': {
|
|
55
|
+
borderColor: 'primaryBtnDisable',
|
|
56
|
+
background: 'white4',
|
|
57
|
+
opacity: 1,
|
|
58
|
+
},
|
|
59
|
+
'&:disabled': {},
|
|
60
|
+
},
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
if (variant === 'success') {
|
|
64
|
+
hoverStyle = {
|
|
65
|
+
'&:hover': {
|
|
66
|
+
'&:not([disabled])': {
|
|
67
|
+
borderColor: 'hoveredSuccess',
|
|
68
|
+
background: 'hoveredSuccess',
|
|
69
|
+
opacity: 1,
|
|
70
|
+
},
|
|
71
|
+
'&:disabled': {},
|
|
72
|
+
},
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
if (variant === 'danger') {
|
|
76
|
+
hoverStyle = {
|
|
77
|
+
'&:hover': {
|
|
78
|
+
'&:not([disabled])': {
|
|
79
|
+
borderColor: 'hoveredDanger',
|
|
80
|
+
background: 'hoveredDanger',
|
|
81
|
+
opacity: 1,
|
|
82
|
+
},
|
|
83
|
+
'&:disabled': {},
|
|
84
|
+
},
|
|
85
|
+
};
|
|
86
|
+
}
|
|
87
|
+
return (_jsxs(ThemeUIButton, __assign({ variant: variant, disabled: disabled, sx: __assign(__assign({ variant: "buttons.".concat(variant), textTransform: 'uppercase', fontSize: buttonFontSizes[size], lineHeight: buttonLineHeight[size], px: buttonPadding[size].x, py: buttonPadding[size].y, display: 'flex', justifyContent: 'center', transition: 'all .3s linear', '&:active': {
|
|
88
|
+
transform: 'scale(0.9)',
|
|
89
|
+
} }, hoverStyle), { width: fullWidth ? '100%' : 'max-content' }) }, props, { children: [React.isValidElement(startIcon) && React.cloneElement(startIcon), children, " ", load && _jsx(Spinner, { size: 16, ml: "5px" }), React.isValidElement(endIcon) && React.cloneElement(endIcon)] })));
|
|
90
|
+
};
|
|
91
|
+
export default Button;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
24
|
+
import { Button } from 'theme-ui';
|
|
25
|
+
import Svg from '../Svg';
|
|
26
|
+
import { icons } from '../Svg/types';
|
|
27
|
+
import { iconButtonVariants as variants } from './types';
|
|
28
|
+
import style from './styles';
|
|
29
|
+
var IconButton = function (_a) {
|
|
30
|
+
var _b = _a.icon, icon = _b === void 0 ? icons.DISCORD : _b, _c = _a.color, color = _c === void 0 ? 'white1' : _c, _d = _a.background, background = _d === void 0 ? 'yellow' : _d, _e = _a.variant, variant = _e === void 0 ? variants.PRIMARY : _e, iconWidth = _a.iconWidth, children = _a.children, props = __rest(_a, ["icon", "color", "background", "variant", "iconWidth", "children"]);
|
|
31
|
+
return (_jsx(Button, __assign({}, props, { variant: variant, sx: __assign(__assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', position: 'relative', variant: "buttons.".concat(variant), color: 'primaryBright', background: background }, (variant === variants.PRIMARY ? style.primary : {})), (variant === variants.TRANSPARENT ? style.transparent : {})) }, { children: children || (_jsx("span", __assign({ sx: { height: iconWidth, width: iconWidth } }, { children: _jsx(Svg, __assign({ color: color, icon: icon }, props, { width: iconWidth })) }))) })));
|
|
32
|
+
};
|
|
33
|
+
export default IconButton;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var defaultStyle = {
|
|
13
|
+
cursor: 'pointer',
|
|
14
|
+
color: 'primaryBright',
|
|
15
|
+
border: 'none',
|
|
16
|
+
transition: 'all .3s linear',
|
|
17
|
+
'&:hover': {
|
|
18
|
+
filter: 'brightness(115%)',
|
|
19
|
+
},
|
|
20
|
+
'&:active': {
|
|
21
|
+
transform: 'scale(0.9)',
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
|
+
var styles = {
|
|
25
|
+
primary: __assign({}, defaultStyle),
|
|
26
|
+
transparent: __assign(__assign({}, defaultStyle), { backgroundColor: 'transparent', backgroundRepeat: 'no-repeat', padding: '0px', border: 'none', cursor: 'pointer', svg: {
|
|
27
|
+
background: 'transparent',
|
|
28
|
+
} }),
|
|
29
|
+
};
|
|
30
|
+
export default styles;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { ButtonProps as ThemeUIButtonProps } from 'theme-ui';
|
|
3
|
+
import { iconTypes } from '../Svg/types';
|
|
4
|
+
export declare enum sizes {
|
|
5
|
+
SMALL = "sm",
|
|
6
|
+
MEDIUM = "md",
|
|
7
|
+
LARGE = "lg"
|
|
8
|
+
}
|
|
9
|
+
export declare const buttonFontSizes: Record<sizes | any, string>;
|
|
10
|
+
export declare const buttonLineHeight: Record<sizes | any, string>;
|
|
11
|
+
export declare const buttonPadding: Record<sizes | any, {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
}>;
|
|
15
|
+
export declare enum variants {
|
|
16
|
+
PRIMARY = "primary",
|
|
17
|
+
SECONDARY = "secondary",
|
|
18
|
+
TERTIARY = "tertiary",
|
|
19
|
+
TEXT = "text",
|
|
20
|
+
SUCCESS = "success",
|
|
21
|
+
DANGER = "danger"
|
|
22
|
+
}
|
|
23
|
+
export declare enum iconButtonVariants {
|
|
24
|
+
PRIMARY = "primary",
|
|
25
|
+
TRANSPARENT = "transparent",
|
|
26
|
+
CIRCULAR = "circular"
|
|
27
|
+
}
|
|
28
|
+
export type sizeProps = `${sizes}`;
|
|
29
|
+
export type variantProps = `${variants}`;
|
|
30
|
+
export type iconButtonVariantsProps = `${iconButtonVariants}`;
|
|
31
|
+
export interface ButtonProps extends Omit<ThemeUIButtonProps, 'sx'> {
|
|
32
|
+
variant?: variantProps;
|
|
33
|
+
size?: sizeProps;
|
|
34
|
+
startIcon?: ReactNode;
|
|
35
|
+
endIcon?: ReactNode;
|
|
36
|
+
fullWidth?: boolean;
|
|
37
|
+
load?: boolean;
|
|
38
|
+
[key: string]: any;
|
|
39
|
+
}
|
|
40
|
+
export interface IconButtonProps extends Omit<ButtonProps, 'variant'> {
|
|
41
|
+
variant?: iconButtonVariantsProps;
|
|
42
|
+
color?: string;
|
|
43
|
+
background?: string;
|
|
44
|
+
icon?: iconTypes;
|
|
45
|
+
iconWidth?: number;
|
|
46
|
+
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
var _a, _b, _c;
|
|
2
|
+
export var sizes;
|
|
3
|
+
(function (sizes) {
|
|
4
|
+
sizes["SMALL"] = "sm";
|
|
5
|
+
sizes["MEDIUM"] = "md";
|
|
6
|
+
sizes["LARGE"] = "lg";
|
|
7
|
+
})(sizes || (sizes = {}));
|
|
8
|
+
export var buttonFontSizes = (_a = {},
|
|
9
|
+
_a[sizes.SMALL] = '12px',
|
|
10
|
+
_a[sizes.MEDIUM] = '16px',
|
|
11
|
+
_a[sizes.LARGE] = '18px',
|
|
12
|
+
_a);
|
|
13
|
+
export var buttonLineHeight = (_b = {},
|
|
14
|
+
_b[sizes.SMALL] = '10px',
|
|
15
|
+
_b[sizes.MEDIUM] = '24px',
|
|
16
|
+
_b[sizes.LARGE] = '33px',
|
|
17
|
+
_b);
|
|
18
|
+
export var buttonPadding = (_c = {},
|
|
19
|
+
_c[sizes.SMALL] = { x: 5, y: 2 },
|
|
20
|
+
_c[sizes.MEDIUM] = { x: 7, y: 3 },
|
|
21
|
+
_c[sizes.LARGE] = { x: 10, y: 6 },
|
|
22
|
+
_c);
|
|
23
|
+
export var variants;
|
|
24
|
+
(function (variants) {
|
|
25
|
+
variants["PRIMARY"] = "primary";
|
|
26
|
+
variants["SECONDARY"] = "secondary";
|
|
27
|
+
variants["TERTIARY"] = "tertiary";
|
|
28
|
+
variants["TEXT"] = "text";
|
|
29
|
+
variants["SUCCESS"] = "success";
|
|
30
|
+
variants["DANGER"] = "danger";
|
|
31
|
+
})(variants || (variants = {}));
|
|
32
|
+
export var iconButtonVariants;
|
|
33
|
+
(function (iconButtonVariants) {
|
|
34
|
+
iconButtonVariants["PRIMARY"] = "primary";
|
|
35
|
+
iconButtonVariants["TRANSPARENT"] = "transparent";
|
|
36
|
+
iconButtonVariants["CIRCULAR"] = "circular";
|
|
37
|
+
})(iconButtonVariants || (iconButtonVariants = {}));
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
var _a, _b, _c, _d, _e;
|
|
2
2
|
// Network chain ids
|
|
3
|
-
import { icons } from '../../components/uikit/Svg/types';
|
|
3
|
+
import { icons } from '../../components/uikit-sdk/Svg/types';
|
|
4
4
|
import { APESWAP_LIST_REPO } from './lists';
|
|
5
5
|
export var AVERAGE_L1_BLOCK_TIME = 12000;
|
|
6
6
|
//This is the list of supported EVM chains
|
|
@@ -19,7 +19,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
19
19
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
20
20
|
};
|
|
21
21
|
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
22
|
-
import { Flex } from '../components/uikit';
|
|
22
|
+
import { Flex } from '../components/uikit-sdk';
|
|
23
23
|
import React, { createContext, useState } from 'react';
|
|
24
24
|
export var Context = createContext({
|
|
25
25
|
nodeId: [],
|