@ape.swap/bonds-sdk 1.0.663 → 1.0.665
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.
|
@@ -5,13 +5,14 @@ import ProgressBar from "../ProgressBar/ProgressBar";
|
|
|
5
5
|
import ProgressBarWrapper from "../ProgressBar/ProgressBarWrapper";
|
|
6
6
|
import TokenInfoAndName from "../TokenInfoAndName";
|
|
7
7
|
import Tooltip from "../Tooltip/Tooltip";
|
|
8
|
-
import {
|
|
8
|
+
import { Svg, TooltipBubble } from "../uikit-sdk";
|
|
9
9
|
import { formatDollar, formatValue } from "../../utils/formatNumbers";
|
|
10
10
|
import getTimePeriods from "../../utils/getTimePeriods";
|
|
11
11
|
import { BLOCK_EXPLORER } from "../../config/constants/chains";
|
|
12
12
|
import { useState } from "react";
|
|
13
13
|
import { useNavigate } from "react-router-dom";
|
|
14
14
|
import '../../scss/BondRow.scss';
|
|
15
|
+
import { Flex } from "theme-ui";
|
|
15
16
|
var BondRow = function (_a) {
|
|
16
17
|
var _b, _c, _d;
|
|
17
18
|
var bond = _a.bond, hotBonds = _a.hotBonds;
|
|
@@ -37,14 +37,14 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
37
37
|
import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
38
38
|
/** @jsxImportSource theme-ui */
|
|
39
39
|
import React, { useEffect, useState } from 'react';
|
|
40
|
-
import { Flex, Input, ThemeUIProvider } from 'theme-ui';
|
|
40
|
+
import { Button, Flex, Input, ThemeUIProvider } from 'theme-ui';
|
|
41
41
|
import { defaultTheme } from '../../../theme';
|
|
42
42
|
import getTimePeriods from '../../../utils/getTimePeriods';
|
|
43
43
|
import axios from 'axios';
|
|
44
44
|
import { BigNumber } from 'bignumber.js';
|
|
45
45
|
import { getFirstNonZeroDigits } from '../../../utils/roundNumber';
|
|
46
46
|
import { isNumber } from '../../../utils/numbers';
|
|
47
|
-
import { TooltipBubble,
|
|
47
|
+
import { TooltipBubble, Svg, ListTag } from '../../uikit-sdk';
|
|
48
48
|
import { TooltipText } from '../../../enum/tooltips';
|
|
49
49
|
import { ethers } from 'ethers';
|
|
50
50
|
import convertToTokenValue, { adjustDecimals } from "../../../utils/convertToTokenValue";
|
|
@@ -29,8 +29,8 @@ var Button = function (_a) {
|
|
|
29
29
|
var hoverStyle = {
|
|
30
30
|
'&:hover': {
|
|
31
31
|
'&:not([disabled])': {
|
|
32
|
-
borderColor: 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
33
|
-
background: variant === 'primary' && 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
32
|
+
// borderColor: 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
33
|
+
// background: variant === 'primary' && 'var(--theme-ui-colors-primaryButtonHovered)',
|
|
34
34
|
opacity: 1,
|
|
35
35
|
},
|
|
36
36
|
'&:disabled': {},
|
|
@@ -41,8 +41,8 @@ var Button = function (_a) {
|
|
|
41
41
|
'&:hover': {
|
|
42
42
|
'&:not([disabled])': hoverStyle['&:hover']['&:not([disabled])'],
|
|
43
43
|
'&:disabled': {
|
|
44
|
-
color: 'secondaryButtonDisableColor',
|
|
45
|
-
borderColor: 'secondaryButtonDisable',
|
|
44
|
+
// color: 'secondaryButtonDisableColor',
|
|
45
|
+
// borderColor: 'secondaryButtonDisable',
|
|
46
46
|
opacity: 0.6,
|
|
47
47
|
},
|
|
48
48
|
},
|
|
@@ -52,8 +52,8 @@ var Button = function (_a) {
|
|
|
52
52
|
hoverStyle = {
|
|
53
53
|
'&:hover': {
|
|
54
54
|
'&:not([disabled])': {
|
|
55
|
-
borderColor: 'primaryBtnDisable',
|
|
56
|
-
background: 'white4',
|
|
55
|
+
// borderColor: 'primaryBtnDisable',
|
|
56
|
+
// background: 'white4',
|
|
57
57
|
opacity: 1,
|
|
58
58
|
},
|
|
59
59
|
'&:disabled': {},
|
|
@@ -64,8 +64,8 @@ var Button = function (_a) {
|
|
|
64
64
|
hoverStyle = {
|
|
65
65
|
'&:hover': {
|
|
66
66
|
'&:not([disabled])': {
|
|
67
|
-
borderColor: 'hoveredSuccess',
|
|
68
|
-
background: 'hoveredSuccess',
|
|
67
|
+
// borderColor: 'hoveredSuccess',
|
|
68
|
+
// background: 'hoveredSuccess',
|
|
69
69
|
opacity: 1,
|
|
70
70
|
},
|
|
71
71
|
'&:disabled': {},
|
|
@@ -76,8 +76,8 @@ var Button = function (_a) {
|
|
|
76
76
|
hoverStyle = {
|
|
77
77
|
'&:hover': {
|
|
78
78
|
'&:not([disabled])': {
|
|
79
|
-
borderColor: 'hoveredDanger',
|
|
80
|
-
background: 'hoveredDanger',
|
|
79
|
+
// borderColor: 'hoveredDanger',
|
|
80
|
+
// background: 'hoveredDanger',
|
|
81
81
|
opacity: 1,
|
|
82
82
|
},
|
|
83
83
|
'&:disabled': {},
|
|
@@ -180,19 +180,12 @@ declare const components: {
|
|
|
180
180
|
};
|
|
181
181
|
buttons: {
|
|
182
182
|
primary: {
|
|
183
|
-
color: string;
|
|
184
183
|
'&:disabled': {
|
|
185
184
|
cursor: string;
|
|
186
|
-
background: string;
|
|
187
|
-
color: string;
|
|
188
|
-
border: string;
|
|
189
185
|
opacity: number;
|
|
190
186
|
};
|
|
191
187
|
'&:hover': {
|
|
192
|
-
'&:not([disabled])': {
|
|
193
|
-
borderColor: string;
|
|
194
|
-
background: string;
|
|
195
|
-
};
|
|
188
|
+
'&:not([disabled])': {};
|
|
196
189
|
'&:disabled': {};
|
|
197
190
|
};
|
|
198
191
|
padding: string;
|
|
@@ -207,19 +200,11 @@ declare const components: {
|
|
|
207
200
|
};
|
|
208
201
|
};
|
|
209
202
|
secondary: {
|
|
210
|
-
background: string;
|
|
211
|
-
border: string;
|
|
212
|
-
color: string;
|
|
213
203
|
'&:disabled': {
|
|
214
204
|
cursor: string;
|
|
215
|
-
background: string;
|
|
216
|
-
color: string;
|
|
217
|
-
border: string;
|
|
218
205
|
};
|
|
219
206
|
'&&:hover': {
|
|
220
|
-
'&:not([disabled])': {
|
|
221
|
-
borderColor: string;
|
|
222
|
-
};
|
|
207
|
+
'&:not([disabled])': {};
|
|
223
208
|
'&:disabled': {};
|
|
224
209
|
};
|
|
225
210
|
padding: string;
|
|
@@ -234,18 +219,11 @@ declare const components: {
|
|
|
234
219
|
};
|
|
235
220
|
};
|
|
236
221
|
tertiary: {
|
|
237
|
-
background: string;
|
|
238
|
-
border: string;
|
|
239
|
-
color: string;
|
|
240
222
|
'&:disabled': {
|
|
241
223
|
cursor: string;
|
|
242
|
-
background: string;
|
|
243
|
-
color: string;
|
|
244
224
|
};
|
|
245
225
|
'&:hover': {
|
|
246
|
-
'&:not([disabled])': {
|
|
247
|
-
background: string;
|
|
248
|
-
};
|
|
226
|
+
'&:not([disabled])': {};
|
|
249
227
|
'&:disabled': {};
|
|
250
228
|
};
|
|
251
229
|
padding: string;
|
|
@@ -260,18 +238,12 @@ declare const components: {
|
|
|
260
238
|
};
|
|
261
239
|
};
|
|
262
240
|
text: {
|
|
263
|
-
background: string;
|
|
264
|
-
color: string;
|
|
265
241
|
'&:hover': {
|
|
266
|
-
'&:not([disabled])': {
|
|
267
|
-
color: string;
|
|
268
|
-
};
|
|
242
|
+
'&:not([disabled])': {};
|
|
269
243
|
'&:disabled': {};
|
|
270
244
|
};
|
|
271
245
|
'&:disabled': {
|
|
272
246
|
cursor: string;
|
|
273
|
-
background: string;
|
|
274
|
-
color: string;
|
|
275
247
|
};
|
|
276
248
|
padding: string;
|
|
277
249
|
fontSize: string;
|
|
@@ -285,17 +257,11 @@ declare const components: {
|
|
|
285
257
|
};
|
|
286
258
|
};
|
|
287
259
|
success: {
|
|
288
|
-
background: string;
|
|
289
|
-
color: string;
|
|
290
260
|
'&:disabled': {
|
|
291
261
|
cursor: string;
|
|
292
|
-
background: string;
|
|
293
|
-
color: string;
|
|
294
262
|
};
|
|
295
263
|
'&:hover': {
|
|
296
|
-
'&:not([disabled])': {
|
|
297
|
-
background: string;
|
|
298
|
-
};
|
|
264
|
+
'&:not([disabled])': {};
|
|
299
265
|
'&:disabled': {};
|
|
300
266
|
};
|
|
301
267
|
padding: string;
|
|
@@ -310,17 +276,11 @@ declare const components: {
|
|
|
310
276
|
};
|
|
311
277
|
};
|
|
312
278
|
danger: {
|
|
313
|
-
background: string;
|
|
314
|
-
color: string;
|
|
315
279
|
'&:disabled': {
|
|
316
280
|
cursor: string;
|
|
317
|
-
background: string;
|
|
318
|
-
color: string;
|
|
319
281
|
};
|
|
320
282
|
'&:hover': {
|
|
321
|
-
'&:not([disabled])': {
|
|
322
|
-
background: string;
|
|
323
|
-
};
|
|
283
|
+
'&:not([disabled])': {};
|
|
324
284
|
'&:disabled': {};
|
|
325
285
|
};
|
|
326
286
|
padding: string;
|
|
@@ -337,7 +297,6 @@ declare const components: {
|
|
|
337
297
|
circular: {
|
|
338
298
|
width: string;
|
|
339
299
|
height: string;
|
|
340
|
-
background: string;
|
|
341
300
|
borderRadius: string;
|
|
342
301
|
display: string;
|
|
343
302
|
justifyContent: string;
|
package/dist/theme/components.js
CHANGED
|
@@ -198,74 +198,92 @@ var components = {
|
|
|
198
198
|
primary: __assign(__assign({}, buttonBaseStyles), {
|
|
199
199
|
// background: 'primaryButton',
|
|
200
200
|
// border: 'primaryButton',
|
|
201
|
-
color: 'primaryBright',
|
|
201
|
+
// color: 'primaryBright',
|
|
202
|
+
'&:disabled': {
|
|
202
203
|
cursor: 'not-allowed',
|
|
203
|
-
background: 'white3',
|
|
204
|
-
color: 'textDisabledButton',
|
|
205
|
-
border: 'primaryBtnDisable',
|
|
204
|
+
// background: 'white3',
|
|
205
|
+
// color: 'textDisabledButton',
|
|
206
|
+
// border: 'primaryBtnDisable',
|
|
206
207
|
opacity: 0.9,
|
|
207
208
|
}, '&:hover': {
|
|
208
209
|
'&:not([disabled])': {
|
|
209
|
-
|
|
210
|
-
|
|
210
|
+
// borderColor: 'rgba(var(--theme-ui-colors-primaryButton), 0.7)',
|
|
211
|
+
// background: 'rgba(var(--theme-ui-colors-primaryButton), 0.7)',
|
|
211
212
|
},
|
|
212
213
|
'&:disabled': {},
|
|
213
214
|
} }),
|
|
214
|
-
secondary: __assign(__assign({}, buttonBaseStyles), {
|
|
215
|
+
secondary: __assign(__assign({}, buttonBaseStyles), {
|
|
216
|
+
// background: 'transparent',
|
|
217
|
+
// border: 'secondaryButton',
|
|
218
|
+
// color: 'var(--theme-ui-colors-primaryButton)',
|
|
219
|
+
'&:disabled': {
|
|
215
220
|
cursor: 'not-allowed',
|
|
216
|
-
background: 'white3',
|
|
217
|
-
color: 'primaryButtonDisable',
|
|
218
|
-
border: 'primaryBtnDisable',
|
|
221
|
+
// background: 'white3',
|
|
222
|
+
// color: 'primaryButtonDisable',
|
|
223
|
+
// border: 'primaryBtnDisable',
|
|
219
224
|
}, '&&:hover': {
|
|
220
225
|
'&:not([disabled])': {
|
|
221
|
-
|
|
226
|
+
// borderColor: 'rgba(var(--theme-ui-colors-primaryButton), 0.7)',
|
|
222
227
|
},
|
|
223
228
|
'&:disabled': {},
|
|
224
229
|
} }),
|
|
225
|
-
tertiary: __assign(__assign({}, buttonBaseStyles), {
|
|
230
|
+
tertiary: __assign(__assign({}, buttonBaseStyles), {
|
|
231
|
+
// background: 'white3',
|
|
232
|
+
// border: 'none',
|
|
233
|
+
// color: 'text',
|
|
234
|
+
'&:disabled': {
|
|
226
235
|
cursor: 'not-allowed',
|
|
227
|
-
background: 'white3',
|
|
228
|
-
color: 'primaryButtonDisable',
|
|
236
|
+
// background: 'white3',
|
|
237
|
+
// color: 'primaryButtonDisable',
|
|
229
238
|
}, '&:hover': {
|
|
230
239
|
'&:not([disabled])': {
|
|
231
|
-
|
|
240
|
+
// background: 'white4',
|
|
232
241
|
},
|
|
233
242
|
'&:disabled': {},
|
|
234
243
|
} }),
|
|
235
|
-
text: __assign(__assign({}, buttonBaseStyles), {
|
|
244
|
+
text: __assign(__assign({}, buttonBaseStyles), {
|
|
245
|
+
// background: 'transparent',
|
|
246
|
+
// color: 'text',
|
|
247
|
+
'&:hover': {
|
|
236
248
|
'&:not([disabled])': {
|
|
237
|
-
|
|
249
|
+
// color: 'var(--theme-ui-colors-yellow)',
|
|
238
250
|
},
|
|
239
251
|
'&:disabled': {},
|
|
240
252
|
}, '&:disabled': {
|
|
241
253
|
cursor: 'not-allowed',
|
|
242
|
-
background: 'white3',
|
|
243
|
-
color: 'primaryButtonDisable',
|
|
254
|
+
// background: 'white3',
|
|
255
|
+
// color: 'primaryButtonDisable',
|
|
244
256
|
} }),
|
|
245
|
-
success: __assign(__assign({}, buttonBaseStyles), {
|
|
257
|
+
success: __assign(__assign({}, buttonBaseStyles), {
|
|
258
|
+
// background: 'success',
|
|
259
|
+
// color: 'primaryBright',
|
|
260
|
+
'&:disabled': {
|
|
246
261
|
cursor: 'not-allowed',
|
|
247
|
-
background: 'white3',
|
|
248
|
-
color: 'primaryButtonDisable',
|
|
262
|
+
// background: 'white3',
|
|
263
|
+
// color: 'primaryButtonDisable',
|
|
249
264
|
}, '&:hover': {
|
|
250
265
|
'&:not([disabled])': {
|
|
251
|
-
|
|
266
|
+
// background: 'hoveredSuccess',
|
|
252
267
|
},
|
|
253
268
|
'&:disabled': {},
|
|
254
269
|
} }),
|
|
255
|
-
danger: __assign(__assign({}, buttonBaseStyles), {
|
|
270
|
+
danger: __assign(__assign({}, buttonBaseStyles), {
|
|
271
|
+
// background: 'error',
|
|
272
|
+
// color: 'primaryBright',
|
|
273
|
+
'&:disabled': {
|
|
256
274
|
cursor: 'not-allowed',
|
|
257
|
-
background: 'white3',
|
|
258
|
-
color: 'primaryButtonDisable',
|
|
275
|
+
// background: 'white3',
|
|
276
|
+
// color: 'primaryButtonDisable',
|
|
259
277
|
}, '&:hover': {
|
|
260
278
|
'&:not([disabled])': {
|
|
261
|
-
|
|
279
|
+
// background: 'hoveredDanger',
|
|
262
280
|
},
|
|
263
281
|
'&:disabled': {},
|
|
264
282
|
} }),
|
|
265
283
|
circular: {
|
|
266
284
|
width: '40px',
|
|
267
285
|
height: '40px',
|
|
268
|
-
background: 'white3',
|
|
286
|
+
// background: 'white3',
|
|
269
287
|
borderRadius: '50%',
|
|
270
288
|
display: 'flex',
|
|
271
289
|
justifyContent: 'center',
|