@ape.swap/bonds-sdk 1.0.61 → 1.0.62
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/uikit/Button/Button.d.ts +4 -0
- package/dist/components/uikit/Button/Button.js +91 -0
- package/dist/components/uikit/Button/IconButton.d.ts +4 -0
- package/dist/components/uikit/Button/IconButton.js +33 -0
- package/dist/components/uikit/Button/index.d.ts +2 -0
- package/dist/components/uikit/Button/index.js +2 -0
- package/dist/components/uikit/Button/styles.d.ts +3 -0
- package/dist/components/uikit/Button/styles.js +30 -0
- package/dist/components/uikit/Button/types.d.ts +46 -0
- package/dist/components/uikit/Button/types.js +37 -0
- package/dist/components/uikit/Checkbox/index.d.ts +4 -0
- package/dist/components/uikit/Checkbox/index.js +46 -0
- package/dist/components/uikit/Checkbox/types.d.ts +11 -0
- package/dist/components/uikit/Checkbox/types.js +5 -0
- package/dist/components/uikit/Dropdown/Dropdown.d.ts +4 -0
- package/dist/components/uikit/Dropdown/Dropdown.js +58 -0
- package/dist/components/uikit/Dropdown/DropdownItem.d.ts +4 -0
- package/dist/components/uikit/Dropdown/DropdownItem.js +47 -0
- package/dist/components/uikit/Dropdown/index.d.ts +3 -0
- package/dist/components/uikit/Dropdown/index.js +2 -0
- package/dist/components/uikit/Dropdown/styles.d.ts +4 -0
- package/dist/components/uikit/Dropdown/styles.js +16 -0
- package/dist/components/uikit/Dropdown/types.d.ts +58 -0
- package/dist/components/uikit/Dropdown/types.js +22 -0
- package/dist/components/uikit/Flex/index.d.ts +3 -0
- package/dist/components/uikit/Flex/index.js +29 -0
- package/dist/components/uikit/Input/Input.d.ts +4 -0
- package/dist/components/uikit/Input/Input.js +72 -0
- package/dist/components/uikit/Input/NumericInput.d.ts +10 -0
- package/dist/components/uikit/Input/NumericInput.js +35 -0
- package/dist/components/uikit/Input/StyledInput.d.ts +11 -0
- package/dist/components/uikit/Input/StyledInput.js +37 -0
- package/dist/components/uikit/Input/index.d.ts +3 -0
- package/dist/components/uikit/Input/index.js +3 -0
- package/dist/components/uikit/Link/index.d.ts +9 -0
- package/dist/components/uikit/Link/index.js +29 -0
- package/dist/components/uikit/Modal/ModalFooter.d.ts +4 -0
- package/dist/components/uikit/Modal/ModalFooter.js +32 -0
- package/dist/components/uikit/Modal/ModalHeader.d.ts +4 -0
- package/dist/components/uikit/Modal/ModalHeader.js +31 -0
- package/dist/components/uikit/Modal/index.d.ts +4 -0
- package/dist/components/uikit/Modal/index.js +55 -0
- package/dist/components/uikit/Modal/styles.d.ts +3 -0
- package/dist/components/uikit/Modal/styles.js +62 -0
- package/dist/components/uikit/Modal/types.d.ts +17 -0
- package/dist/components/uikit/Modal/types.js +1 -0
- package/dist/components/uikit/Select/Select.d.ts +4 -0
- package/dist/components/uikit/Select/Select.js +61 -0
- package/dist/components/uikit/Select/SelectItem.d.ts +4 -0
- package/dist/components/uikit/Select/SelectItem.js +40 -0
- package/dist/components/uikit/Select/index.d.ts +2 -0
- package/dist/components/uikit/Select/index.js +2 -0
- package/dist/components/uikit/Select/styles.d.ts +4 -0
- package/dist/components/uikit/Select/styles.js +50 -0
- package/dist/components/uikit/Select/types.d.ts +55 -0
- package/dist/components/uikit/Select/types.js +37 -0
- package/dist/components/uikit/Skeleton/index.d.ts +4 -0
- package/dist/components/uikit/Skeleton/index.js +31 -0
- package/dist/components/uikit/Skeleton/styles.d.ts +5 -0
- package/dist/components/uikit/Skeleton/styles.js +40 -0
- package/dist/components/uikit/Skeleton/types.d.ts +18 -0
- package/dist/components/uikit/Skeleton/types.js +10 -0
- package/dist/components/uikit/Spinner/apeSpinner.json +2764 -0
- package/dist/components/uikit/Spinner/index.d.ts +5 -0
- package/dist/components/uikit/Spinner/index.js +20 -0
- package/dist/components/uikit/SwiperDots/index.d.ts +6 -0
- package/dist/components/uikit/SwiperDots/index.js +14 -0
- package/dist/components/uikit/Tabs/Tab.d.ts +4 -0
- package/dist/components/uikit/Tabs/Tab.js +34 -0
- package/dist/components/uikit/Tabs/TabPanel.d.ts +4 -0
- package/dist/components/uikit/Tabs/TabPanel.js +29 -0
- package/dist/components/uikit/Tabs/Tabs.d.ts +4 -0
- package/dist/components/uikit/Tabs/Tabs.js +67 -0
- package/dist/components/uikit/Tabs/index.d.ts +2 -0
- package/dist/components/uikit/Tabs/index.js +2 -0
- package/dist/components/uikit/Tabs/styles.d.ts +3 -0
- package/dist/components/uikit/Tabs/styles.js +40 -0
- package/dist/components/uikit/Tabs/types.d.ts +54 -0
- package/dist/components/uikit/Tabs/types.js +22 -0
- package/dist/components/uikit/Tag/ListTag.d.ts +4 -0
- package/dist/components/uikit/Tag/ListTag.js +20 -0
- package/dist/components/uikit/Tag/Tag.d.ts +4 -0
- package/dist/components/uikit/Tag/Tag.js +42 -0
- package/dist/components/uikit/Tag/index.d.ts +3 -0
- package/dist/components/uikit/Tag/index.js +2 -0
- package/dist/components/uikit/Tag/styles.d.ts +5 -0
- package/dist/components/uikit/Tag/styles.js +44 -0
- package/dist/components/uikit/Tag/types.d.ts +48 -0
- package/dist/components/uikit/Tag/types.js +34 -0
- package/dist/components/uikit/Text/index.d.ts +4 -0
- package/dist/components/uikit/Text/index.js +35 -0
- package/dist/components/uikit/Text/types.d.ts +23 -0
- package/dist/components/uikit/Text/types.js +13 -0
- package/dist/components/uikit/Toggle/index.d.ts +4 -0
- package/dist/components/uikit/Toggle/index.js +63 -0
- package/dist/components/uikit/Toggle/styles.d.ts +3 -0
- package/dist/components/uikit/Toggle/styles.js +39 -0
- package/dist/components/uikit/Toggle/types.d.ts +31 -0
- package/dist/components/uikit/Toggle/types.js +17 -0
- package/dist/components/uikit/Tooltip/index.d.ts +4 -0
- package/dist/components/uikit/Tooltip/index.js +66 -0
- package/dist/components/uikit/Tooltip/styles.d.ts +4 -0
- package/dist/components/uikit/Tooltip/styles.js +60 -0
- package/dist/components/uikit/Tooltip/types.d.ts +17 -0
- package/dist/components/uikit/Tooltip/types.js +8 -0
- package/dist/components/uikit/TutorialModal/index.d.ts +4 -0
- package/dist/components/uikit/TutorialModal/index.js +52 -0
- package/dist/components/uikit/TutorialModal/styles.d.ts +8 -0
- package/dist/components/uikit/TutorialModal/styles.js +86 -0
- package/dist/components/uikit/TutorialModal/types.d.ts +22 -0
- package/dist/components/uikit/TutorialModal/types.js +1 -0
- package/dist/components/uikit/TutorialModal/useTutorialModal.d.ts +6 -0
- package/dist/components/uikit/TutorialModal/useTutorialModal.js +20 -0
- package/dist/components/uikit/index.d.ts +18 -0
- package/dist/components/uikit/index.js +20 -0
- package/dist/contexts/ModalContext.d.ts +14 -0
- package/dist/contexts/ModalContext.js +78 -0
- package/dist/hooks/useIsAbond.d.ts +3 -0
- package/dist/hooks/useIsAbond.js +10 -0
- package/dist/hooks/useModal.d.ts +3 -0
- package/dist/hooks/useModal.js +39 -0
- package/dist/utils/numbers.d.ts +5 -0
- package/dist/utils/numbers.js +111 -0
- package/package.json +7 -1
|
@@ -0,0 +1,20 @@
|
|
|
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
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
13
|
+
import Lottie from 'lottie-react';
|
|
14
|
+
import Flex from '../Flex';
|
|
15
|
+
import apeSpinner from './apeSpinner.json';
|
|
16
|
+
var Spinner = function (_a) {
|
|
17
|
+
var size = _a.size;
|
|
18
|
+
return (_jsx(Flex, __assign({ sx: { width: size, height: size } }, { children: _jsx(Lottie, { animationData: apeSpinner, loop: true }) })));
|
|
19
|
+
};
|
|
20
|
+
export default Spinner;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
2
|
+
import Flex from '../Flex';
|
|
3
|
+
var SwiperDots = function (_a) {
|
|
4
|
+
var isActive = _a.isActive, onClick = _a.onClick;
|
|
5
|
+
return (_jsx(Flex, { sx: {
|
|
6
|
+
background: isActive ? 'home.title' : 'white4',
|
|
7
|
+
height: '14px',
|
|
8
|
+
width: '14px',
|
|
9
|
+
borderRadius: '50px',
|
|
10
|
+
margin: '0px 2.5px 0px 2.5px',
|
|
11
|
+
cursor: 'pointer',
|
|
12
|
+
}, onClick: onClick }));
|
|
13
|
+
};
|
|
14
|
+
export default SwiperDots;
|
|
@@ -0,0 +1,34 @@
|
|
|
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 React from 'react';
|
|
25
|
+
import { Box } from 'theme-ui';
|
|
26
|
+
import Text from '../Text';
|
|
27
|
+
import { sizes, variants, tabPadding, fontSizes } from './types';
|
|
28
|
+
import styles from './styles';
|
|
29
|
+
// eslint-disable-next-line react/display-name
|
|
30
|
+
var Tab = React.forwardRef(function (_a, ref) {
|
|
31
|
+
var onClick = _a.onClick, index = _a.index, label = _a.label, _b = _a.size, size = _b === void 0 ? sizes.MEDIUM : _b, _c = _a.variant, variant = _c === void 0 ? variants.CENTERED : _c, props = __rest(_a, ["onClick", "index", "label", "size", "variant"]);
|
|
32
|
+
return (_jsx(Box, __assign({ ref: ref }, props, { sx: __assign(__assign({}, styles.tab), { flex: variant === variants.FULLWIDTH ? 1 : undefined, px: tabPadding[size].x, py: tabPadding[size].y, cursor: (props === null || props === void 0 ? void 0 : props.disabled) ? 'not-allowed' : 'pointer' }), onClick: function () { return (props === null || props === void 0 ? void 0 : props.disabled) || onClick(index); } }, { children: _jsx(Text, __assign({ sx: { fontSize: fontSizes[size] }, weight: "bold" }, { children: label })) })));
|
|
33
|
+
});
|
|
34
|
+
export default Tab;
|
|
@@ -0,0 +1,29 @@
|
|
|
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 { Box } from 'theme-ui';
|
|
25
|
+
var TabPanel = function (_a) {
|
|
26
|
+
var children = _a.children, index = _a.index, activeTab = _a.activeTab, props = __rest(_a, ["children", "index", "activeTab"]);
|
|
27
|
+
return activeTab === index ? (_jsx(Box, __assign({}, props, { sx: { pt: 8 } }, { children: children }))) : null;
|
|
28
|
+
};
|
|
29
|
+
export default TabPanel;
|
|
@@ -0,0 +1,67 @@
|
|
|
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, { useEffect, useRef, useState, useCallback } from 'react';
|
|
25
|
+
import { Box } from 'theme-ui';
|
|
26
|
+
import { Button } from '../Button';
|
|
27
|
+
import { variants, tabPadding, sizes, fontSizes } from './types';
|
|
28
|
+
import styles from './styles';
|
|
29
|
+
var isBrowser = typeof window === 'object';
|
|
30
|
+
var Tabs = function (_a) {
|
|
31
|
+
var _b = _a.activeTab, activeTab = _b === void 0 ? 0 : _b, children = _a.children, _c = _a.variant, variant = _c === void 0 ? variants.CENTERED : _c, _d = _a.size, size = _d === void 0 ? sizes.MEDIUM : _d, props = __rest(_a, ["activeTab", "children", "variant", "size"]);
|
|
32
|
+
var _e = useState(), label = _e[0], setLabel = _e[1];
|
|
33
|
+
var activeRef = useRef(null);
|
|
34
|
+
var _f = useState({}), activeStyle = _f[0], setActiveStyle = _f[1];
|
|
35
|
+
var getActiveStyles = useCallback(function () {
|
|
36
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
37
|
+
return {
|
|
38
|
+
width: ((_c = (_b = (_a = activeRef === null || activeRef === void 0 ? void 0 : activeRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect) === null || _b === void 0 ? void 0 : _b.call(_a)) === null || _c === void 0 ? void 0 : _c.width) || 'fit-content',
|
|
39
|
+
lineHeight: '17px',
|
|
40
|
+
left: (activeRef === null || activeRef === void 0 ? void 0 : activeRef.current)
|
|
41
|
+
? ((_f = (_e = (_d = activeRef === null || activeRef === void 0 ? void 0 : activeRef.current) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect) === null || _e === void 0 ? void 0 : _e.call(_d)) === null || _f === void 0 ? void 0 : _f.x) -
|
|
42
|
+
((_k = (_j = (_h = (_g = activeRef === null || activeRef === void 0 ? void 0 : activeRef.current) === null || _g === void 0 ? void 0 : _g.parentNode) === null || _h === void 0 ? void 0 : _h.getBoundingClientRect) === null || _j === void 0 ? void 0 : _j.call(_h)) === null || _k === void 0 ? void 0 : _k.x)
|
|
43
|
+
: 0,
|
|
44
|
+
};
|
|
45
|
+
}, [activeRef]);
|
|
46
|
+
useEffect(function () {
|
|
47
|
+
React.Children.forEach(children, function (child) {
|
|
48
|
+
var _a, _b;
|
|
49
|
+
if (((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.index) === activeTab) {
|
|
50
|
+
setLabel((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.label);
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
if (size) {
|
|
54
|
+
setActiveStyle(getActiveStyles());
|
|
55
|
+
}
|
|
56
|
+
}, [activeTab, children, getActiveStyles, size]);
|
|
57
|
+
return (_jsx(Box, __assign({}, props, { sx: __assign(__assign({}, styles.tabs), { justifyContent: variant === variants.CENTERED ? 'center' : null }) }, { children: _jsxs(Box, __assign({ sx: __assign(__assign({}, styles.tabUnderlay), { width: variant === variants.FULLWIDTH ? '100%' : undefined, justifyContent: variant === variants.FULLWIDTH ? 'space-between' : 'center' }) }, { children: [React.Children.map(children, function (child) {
|
|
58
|
+
var _a, _b;
|
|
59
|
+
return React.cloneElement(child, __assign(__assign({}, child === null || child === void 0 ? void 0 : child.props), { sx: !isBrowser && ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.index) === activeTab
|
|
60
|
+
? {
|
|
61
|
+
background: 'yellow',
|
|
62
|
+
color: 'primaryBright',
|
|
63
|
+
}
|
|
64
|
+
: undefined, ref: ((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.index) === activeTab ? activeRef : undefined }));
|
|
65
|
+
}), activeTab >= 0 && (_jsx(Button, __assign({ sx: __assign(__assign(__assign({ px: tabPadding[size].x, py: tabPadding[size].y, fontSize: fontSizes[size] }, styles.tabButton), activeStyle), { display: isBrowser ? undefined : 'none' }) }, { children: label })))] })) })));
|
|
66
|
+
};
|
|
67
|
+
export default Tabs;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
var styles = {
|
|
2
|
+
tabs: {
|
|
3
|
+
overflow: 'hidden',
|
|
4
|
+
display: 'flex',
|
|
5
|
+
borderRadius: '10px',
|
|
6
|
+
background: 'transparent',
|
|
7
|
+
},
|
|
8
|
+
tabUnderlay: {
|
|
9
|
+
position: 'relative',
|
|
10
|
+
display: 'flex',
|
|
11
|
+
background: 'lvl1',
|
|
12
|
+
borderRadius: '10px',
|
|
13
|
+
padding: 0,
|
|
14
|
+
margin: 0,
|
|
15
|
+
},
|
|
16
|
+
tabButton: {
|
|
17
|
+
position: 'absolute',
|
|
18
|
+
border: 0,
|
|
19
|
+
top: 0,
|
|
20
|
+
height: '100%',
|
|
21
|
+
transition: 'left 0.2s linear',
|
|
22
|
+
textTransform: 'none',
|
|
23
|
+
'&:hover': {
|
|
24
|
+
filter: 'none',
|
|
25
|
+
},
|
|
26
|
+
},
|
|
27
|
+
tab: {
|
|
28
|
+
borderRadius: '10px',
|
|
29
|
+
px: '36px',
|
|
30
|
+
py: '9px',
|
|
31
|
+
background: 'white3',
|
|
32
|
+
color: 'primaryButtonDisable',
|
|
33
|
+
textAlign: 'center',
|
|
34
|
+
border: 0,
|
|
35
|
+
'&:hover': {
|
|
36
|
+
filter: '20%',
|
|
37
|
+
},
|
|
38
|
+
},
|
|
39
|
+
};
|
|
40
|
+
export default styles;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { BoxProps } from 'theme-ui';
|
|
3
|
+
export declare enum sizes {
|
|
4
|
+
SMALL = "sm",
|
|
5
|
+
MEDIUM = "md",
|
|
6
|
+
LARGE = "lg"
|
|
7
|
+
}
|
|
8
|
+
export declare const tabPadding: {
|
|
9
|
+
sm: {
|
|
10
|
+
x: number;
|
|
11
|
+
y: number;
|
|
12
|
+
};
|
|
13
|
+
md: {
|
|
14
|
+
x: number;
|
|
15
|
+
y: number;
|
|
16
|
+
};
|
|
17
|
+
lg: {
|
|
18
|
+
x: number;
|
|
19
|
+
y: number;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
export declare const fontSizes: {
|
|
23
|
+
sm: number;
|
|
24
|
+
md: number;
|
|
25
|
+
lg: number;
|
|
26
|
+
};
|
|
27
|
+
export declare enum variants {
|
|
28
|
+
CENTERED = "centered",
|
|
29
|
+
FULLWIDTH = "fullWidth"
|
|
30
|
+
}
|
|
31
|
+
export type variantProps = `${variants}`;
|
|
32
|
+
export type sizeProps = `${sizes}`;
|
|
33
|
+
export interface TabProps extends Omit<BoxProps, 'onClick'> {
|
|
34
|
+
index: number;
|
|
35
|
+
activeTab?: number;
|
|
36
|
+
label: string;
|
|
37
|
+
onClick: (activeTab: number) => void;
|
|
38
|
+
size: sizeProps;
|
|
39
|
+
variant: variantProps;
|
|
40
|
+
disabled?: boolean;
|
|
41
|
+
}
|
|
42
|
+
export interface TabsProps {
|
|
43
|
+
activeTab: number;
|
|
44
|
+
variant?: variantProps;
|
|
45
|
+
children?: ReactNode;
|
|
46
|
+
size?: sizeProps;
|
|
47
|
+
sx?: any;
|
|
48
|
+
}
|
|
49
|
+
export interface TabPanelProps {
|
|
50
|
+
index: number;
|
|
51
|
+
activeTab: number;
|
|
52
|
+
children?: ReactNode;
|
|
53
|
+
sx?: any;
|
|
54
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
var _a, _b;
|
|
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 tabPadding = (_a = {},
|
|
9
|
+
_a[sizes.SMALL] = { x: 9, y: 2 },
|
|
10
|
+
_a[sizes.MEDIUM] = { x: 15, y: 3 },
|
|
11
|
+
_a[sizes.LARGE] = { x: 16, y: 6 },
|
|
12
|
+
_a);
|
|
13
|
+
export var fontSizes = (_b = {},
|
|
14
|
+
_b[sizes.SMALL] = 0,
|
|
15
|
+
_b[sizes.MEDIUM] = 1,
|
|
16
|
+
_b[sizes.LARGE] = 2,
|
|
17
|
+
_b);
|
|
18
|
+
export var variants;
|
|
19
|
+
(function (variants) {
|
|
20
|
+
variants["CENTERED"] = "centered";
|
|
21
|
+
variants["FULLWIDTH"] = "fullWidth";
|
|
22
|
+
})(variants || (variants = {}));
|
|
@@ -0,0 +1,20 @@
|
|
|
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
|
+
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
13
|
+
import { styles } from './styles';
|
|
14
|
+
import { lpTags } from './types';
|
|
15
|
+
import Flex from '../Flex';
|
|
16
|
+
var ListTag = function (_a) {
|
|
17
|
+
var variant = _a.variant, _b = _a.text, text = _b === void 0 ? '' : _b, styleCustom = _a.styleCustom;
|
|
18
|
+
return (_jsx(Flex, __assign({ variant: variant, sx: __assign(__assign({}, styles.listTagCont({ variant: variant })), styleCustom) }, { children: text ? (_jsx(Flex, __assign({ sx: styles.tagText({ variant: variant }) }, { children: text }))) : (_jsxs(Flex, __assign({ sx: styles.tagText({ variant: variant }) }, { children: [variant.toUpperCase().replace('_', ' '), " ", lpTags.includes(variant) && 'LP'] }))) })));
|
|
19
|
+
};
|
|
20
|
+
export default ListTag;
|
|
@@ -0,0 +1,42 @@
|
|
|
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 { jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
24
|
+
import React from 'react';
|
|
25
|
+
import { StyledTag } from './styles';
|
|
26
|
+
var Tag = function (_a) {
|
|
27
|
+
var startIcon = _a.startIcon, endIcon = _a.endIcon, children = _a.children, props = __rest(_a, ["startIcon", "endIcon", "children"]);
|
|
28
|
+
return (_jsxs(StyledTag, __assign({}, props, { children: [React.isValidElement(startIcon) &&
|
|
29
|
+
React.cloneElement(startIcon, {
|
|
30
|
+
//@ts-ignore
|
|
31
|
+
mr: '0.5rem',
|
|
32
|
+
}), children, React.isValidElement(endIcon) &&
|
|
33
|
+
React.cloneElement(endIcon, {
|
|
34
|
+
//@ts-ignore
|
|
35
|
+
ml: '0.5rem',
|
|
36
|
+
})] })));
|
|
37
|
+
};
|
|
38
|
+
Tag.defaultProps = {
|
|
39
|
+
variant: 'primary',
|
|
40
|
+
outline: false,
|
|
41
|
+
};
|
|
42
|
+
export default Tag;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
import styled from '@emotion/styled';
|
|
6
|
+
var getThemeTextColor = function (_a) {
|
|
7
|
+
var outline = _a.outline, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
|
|
8
|
+
return (outline ? variant : '#ffffff');
|
|
9
|
+
};
|
|
10
|
+
export var StyledTag = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: 16px;\n color: ", ";\n display: inline-flex;\n font-size: 14px;\n font-weight: 300;\n height: 28px;\n line-height: 1.5;\n padding: 0 8px;\n white-space: nowrap;\n\n svg {\n fill: ", ";\n }\n"], ["\n align-items: center;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: 16px;\n color: ", ";\n display: inline-flex;\n font-size: 14px;\n font-weight: 300;\n height: 28px;\n line-height: 1.5;\n padding: 0 8px;\n white-space: nowrap;\n\n svg {\n fill: ", ";\n }\n"])), function (_a) {
|
|
11
|
+
var outline = _a.outline, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
|
|
12
|
+
return (outline ? 'transparent' : variant);
|
|
13
|
+
}, function (_a) {
|
|
14
|
+
var _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
|
|
15
|
+
return variant;
|
|
16
|
+
}, getThemeTextColor, getThemeTextColor);
|
|
17
|
+
export var styles = {
|
|
18
|
+
listTagCont: function (_a) {
|
|
19
|
+
var _b = _a.variant, variant = _b === void 0 ? 'ape' : _b;
|
|
20
|
+
return ({
|
|
21
|
+
alignItems: 'center',
|
|
22
|
+
background: function (theme) { var _a, _b, _c, _d, _e; return (_c = (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.listTagBg) === null || _b === void 0 ? void 0 : _b[variant]) !== null && _c !== void 0 ? _c : (_e = (_d = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _d === void 0 ? void 0 : _d.listTagBg) === null || _e === void 0 ? void 0 : _e.default; },
|
|
23
|
+
borderRadius: '3px',
|
|
24
|
+
display: 'inline-flex',
|
|
25
|
+
height: '15px',
|
|
26
|
+
padding: '0 5px',
|
|
27
|
+
});
|
|
28
|
+
},
|
|
29
|
+
tagText: function (_a) {
|
|
30
|
+
var _b = _a.variant, variant = _b === void 0 ? 'ape' : _b;
|
|
31
|
+
return ({
|
|
32
|
+
color: function (theme) {
|
|
33
|
+
var _a, _b, _c, _d, _e;
|
|
34
|
+
return ((_b = (_a = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _a === void 0 ? void 0 : _a.listTagTextColor) === null || _b === void 0 ? void 0 : _b[variant])
|
|
35
|
+
? (_d = (_c = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _c === void 0 ? void 0 : _c.listTagTextColor) === null || _d === void 0 ? void 0 : _d[variant]
|
|
36
|
+
: (_e = theme === null || theme === void 0 ? void 0 : theme.colors) === null || _e === void 0 ? void 0 : _e.primaryBright;
|
|
37
|
+
},
|
|
38
|
+
fontSize: '10px',
|
|
39
|
+
fontWeight: 600,
|
|
40
|
+
lineHeight: '15px',
|
|
41
|
+
});
|
|
42
|
+
},
|
|
43
|
+
};
|
|
44
|
+
var templateObject_1;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { SpaceProps } from 'styled-system';
|
|
3
|
+
import { ThemeUIStyleObject } from 'theme-ui';
|
|
4
|
+
export declare const variants: {
|
|
5
|
+
readonly PRIMARY: "primary";
|
|
6
|
+
readonly SUCCESS: "success";
|
|
7
|
+
readonly BINANCE: "binance";
|
|
8
|
+
readonly ERROR: "error";
|
|
9
|
+
readonly SECONDARY: "secondary";
|
|
10
|
+
readonly TEXTDISABLED: "textDisabled";
|
|
11
|
+
readonly TEXTSUBTLE: "textSubtle";
|
|
12
|
+
};
|
|
13
|
+
export type Variants = (typeof variants)[keyof typeof variants];
|
|
14
|
+
export interface TagProps extends SpaceProps {
|
|
15
|
+
variant?: Variants;
|
|
16
|
+
startIcon?: ReactNode;
|
|
17
|
+
endIcon?: ReactNode;
|
|
18
|
+
children?: ReactNode;
|
|
19
|
+
outline?: boolean;
|
|
20
|
+
}
|
|
21
|
+
export declare const listTagVariants: {
|
|
22
|
+
readonly APE: "ape";
|
|
23
|
+
readonly UNI: "uni";
|
|
24
|
+
readonly ARK: "ark";
|
|
25
|
+
readonly NEW: "new";
|
|
26
|
+
readonly HOT: "hot";
|
|
27
|
+
readonly AUTO: "auto";
|
|
28
|
+
readonly MAX: "max";
|
|
29
|
+
readonly yield: "yield";
|
|
30
|
+
readonly BETA: "beta";
|
|
31
|
+
readonly LIQUIDITY: "liquidity";
|
|
32
|
+
readonly RESERVE: "reserve";
|
|
33
|
+
readonly LAUNCH: "launch";
|
|
34
|
+
readonly bondLp: "bondLp";
|
|
35
|
+
readonly migration: "migration";
|
|
36
|
+
readonly CEX_FUND: "cex_fund";
|
|
37
|
+
readonly QuickswapV2: "QuickSwap v2";
|
|
38
|
+
readonly PancakeSwapV2: "PancakeSwap v2";
|
|
39
|
+
readonly expired: "expired";
|
|
40
|
+
readonly permalock: "permalock";
|
|
41
|
+
};
|
|
42
|
+
export type ListTagVariants = (typeof listTagVariants)[keyof typeof listTagVariants];
|
|
43
|
+
export interface ListTagProps extends SpaceProps {
|
|
44
|
+
variant: ListTagVariants;
|
|
45
|
+
text?: string;
|
|
46
|
+
styleCustom?: ThemeUIStyleObject;
|
|
47
|
+
}
|
|
48
|
+
export declare const lpTags: string[];
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
var _a;
|
|
2
|
+
import { LiquidityDex } from '@ape.swap/apeswap-lists';
|
|
3
|
+
export var variants = {
|
|
4
|
+
PRIMARY: 'primary',
|
|
5
|
+
SUCCESS: 'success',
|
|
6
|
+
BINANCE: 'binance',
|
|
7
|
+
ERROR: 'error',
|
|
8
|
+
SECONDARY: 'secondary',
|
|
9
|
+
TEXTDISABLED: 'textDisabled',
|
|
10
|
+
TEXTSUBTLE: 'textSubtle',
|
|
11
|
+
};
|
|
12
|
+
export var listTagVariants = (_a = {
|
|
13
|
+
APE: 'ape',
|
|
14
|
+
UNI: 'uni',
|
|
15
|
+
ARK: 'ark',
|
|
16
|
+
NEW: 'new',
|
|
17
|
+
HOT: 'hot',
|
|
18
|
+
AUTO: 'auto',
|
|
19
|
+
MAX: 'max',
|
|
20
|
+
yield: 'yield',
|
|
21
|
+
BETA: 'beta',
|
|
22
|
+
LIQUIDITY: 'liquidity',
|
|
23
|
+
RESERVE: 'reserve',
|
|
24
|
+
LAUNCH: 'launch',
|
|
25
|
+
bondLp: 'bondLp',
|
|
26
|
+
migration: 'migration',
|
|
27
|
+
CEX_FUND: 'cex_fund'
|
|
28
|
+
},
|
|
29
|
+
_a[LiquidityDex.QuickswapV2] = 'QuickSwap v2',
|
|
30
|
+
_a[LiquidityDex.PancakeSwapV2] = 'PancakeSwap v2',
|
|
31
|
+
_a.expired = 'expired',
|
|
32
|
+
_a.permalock = 'permalock',
|
|
33
|
+
_a);
|
|
34
|
+
export var lpTags = ['ape', 'uni', 'ark'];
|
|
@@ -0,0 +1,35 @@
|
|
|
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 { Text as ThemeUIText } from 'theme-ui';
|
|
25
|
+
import { variants } from './types';
|
|
26
|
+
var Text = function (_a) {
|
|
27
|
+
var _b = _a.variant, variant = _b === void 0 ? variants.NORMAL : _b, _c = _a.weight, weight = _c === void 0 ? variants.NORMAL : _c, size = _a.size, children = _a.children, _d = _a.color, color = _d === void 0 ? 'text' : _d, props = __rest(_a, ["variant", "weight", "size", "children", "color"]);
|
|
28
|
+
return (_jsx(ThemeUIText, __assign({}, props, { sx: {
|
|
29
|
+
variant: variant === variants.LINK ? "flex.".concat(variant) : "text.".concat(variant),
|
|
30
|
+
color: color,
|
|
31
|
+
fontWeight: weight,
|
|
32
|
+
fontSize: size,
|
|
33
|
+
} }, { children: children })));
|
|
34
|
+
};
|
|
35
|
+
export default Text;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { TextProps as ThemeUITextProps } from 'theme-ui';
|
|
2
|
+
export declare enum variants {
|
|
3
|
+
SMALL = "sm",
|
|
4
|
+
NORMAL = "md",
|
|
5
|
+
LARGE = "lg",
|
|
6
|
+
LINK = "link"
|
|
7
|
+
}
|
|
8
|
+
export declare enum weights {
|
|
9
|
+
LIGHT = "light",
|
|
10
|
+
NORMAL = "normal",
|
|
11
|
+
BOLD = "bold"
|
|
12
|
+
}
|
|
13
|
+
type variantProps = `${variants}`;
|
|
14
|
+
type weightProps = `${weights}` | number;
|
|
15
|
+
type sizeProps = string;
|
|
16
|
+
export interface TextProps extends Omit<ThemeUITextProps, 'sx'> {
|
|
17
|
+
variant?: variantProps;
|
|
18
|
+
weight?: weightProps;
|
|
19
|
+
color?: string;
|
|
20
|
+
size?: sizeProps;
|
|
21
|
+
[key: string]: any;
|
|
22
|
+
}
|
|
23
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export var variants;
|
|
2
|
+
(function (variants) {
|
|
3
|
+
variants["SMALL"] = "sm";
|
|
4
|
+
variants["NORMAL"] = "md";
|
|
5
|
+
variants["LARGE"] = "lg";
|
|
6
|
+
variants["LINK"] = "link";
|
|
7
|
+
})(variants || (variants = {}));
|
|
8
|
+
export var weights;
|
|
9
|
+
(function (weights) {
|
|
10
|
+
weights["LIGHT"] = "light";
|
|
11
|
+
weights["NORMAL"] = "normal";
|
|
12
|
+
weights["BOLD"] = "bold";
|
|
13
|
+
})(weights || (weights = {}));
|