@mezo-org/passport 0.15.0-dev.4 → 0.15.1-dev.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/dist/src/hooks/useAuthenticateWithWallet.d.ts +11 -11
- package/dist/src/hooks/useSignInWithWallet.d.ts +11 -11
- package/dist/src/hooks/useSignUpWithWallet.d.ts +11 -11
- package/dist/src/index.d.ts +0 -1
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/index.js +0 -1
- package/dist/src/index.js.map +1 -1
- package/package.json +1 -2
- package/src/index.ts +0 -1
- package/dist/src/assets/DefaultAvatar.d.ts +0 -5
- package/dist/src/assets/DefaultAvatar.d.ts.map +0 -1
- package/dist/src/assets/DefaultAvatar.js +0 -21
- package/dist/src/assets/DefaultAvatar.js.map +0 -1
- package/dist/src/components/Dropdown/ConnectedTrigger.d.ts +0 -8
- package/dist/src/components/Dropdown/ConnectedTrigger.d.ts.map +0 -1
- package/dist/src/components/Dropdown/ConnectedTrigger.js +0 -39
- package/dist/src/components/Dropdown/ConnectedTrigger.js.map +0 -1
- package/dist/src/components/Dropdown/Content.d.ts +0 -8
- package/dist/src/components/Dropdown/Content.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Content.js +0 -27
- package/dist/src/components/Dropdown/Content.js.map +0 -1
- package/dist/src/components/Dropdown/DisconnectedTrigger.d.ts +0 -7
- package/dist/src/components/Dropdown/DisconnectedTrigger.d.ts.map +0 -1
- package/dist/src/components/Dropdown/DisconnectedTrigger.js +0 -13
- package/dist/src/components/Dropdown/DisconnectedTrigger.js.map +0 -1
- package/dist/src/components/Dropdown/Dropdown.d.ts +0 -23
- package/dist/src/components/Dropdown/Dropdown.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Dropdown.js +0 -45
- package/dist/src/components/Dropdown/Dropdown.js.map +0 -1
- package/dist/src/components/Dropdown/ListingItem.d.ts +0 -14
- package/dist/src/components/Dropdown/ListingItem.d.ts.map +0 -1
- package/dist/src/components/Dropdown/ListingItem.js +0 -42
- package/dist/src/components/Dropdown/ListingItem.js.map +0 -1
- package/dist/src/components/Dropdown/NestedViewLayout.d.ts +0 -8
- package/dist/src/components/Dropdown/NestedViewLayout.d.ts.map +0 -1
- package/dist/src/components/Dropdown/NestedViewLayout.js +0 -32
- package/dist/src/components/Dropdown/NestedViewLayout.js.map +0 -1
- package/dist/src/components/Dropdown/Receive/Receive.d.ts +0 -4
- package/dist/src/components/Dropdown/Receive/Receive.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Receive/Receive.js +0 -64
- package/dist/src/components/Dropdown/Receive/Receive.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountAddressActions.d.ts +0 -4
- package/dist/src/components/Dropdown/Root/AccountAddressActions.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountAddressActions.js +0 -49
- package/dist/src/components/Dropdown/Root/AccountAddressActions.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountBalance.d.ts +0 -6
- package/dist/src/components/Dropdown/Root/AccountBalance.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountBalance.js +0 -32
- package/dist/src/components/Dropdown/Root/AccountBalance.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountBtcListing.d.ts +0 -6
- package/dist/src/components/Dropdown/Root/AccountBtcListing.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountBtcListing.js +0 -28
- package/dist/src/components/Dropdown/Root/AccountBtcListing.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountError.d.ts +0 -8
- package/dist/src/components/Dropdown/Root/AccountError.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountError.js +0 -17
- package/dist/src/components/Dropdown/Root/AccountError.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountMusdListing.d.ts +0 -4
- package/dist/src/components/Dropdown/Root/AccountMusdListing.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountMusdListing.js +0 -21
- package/dist/src/components/Dropdown/Root/AccountMusdListing.js.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountOtherAssets.d.ts +0 -8
- package/dist/src/components/Dropdown/Root/AccountOtherAssets.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/AccountOtherAssets.js +0 -43
- package/dist/src/components/Dropdown/Root/AccountOtherAssets.js.map +0 -1
- package/dist/src/components/Dropdown/Root/Root.d.ts +0 -8
- package/dist/src/components/Dropdown/Root/Root.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/Root.js +0 -45
- package/dist/src/components/Dropdown/Root/Root.js.map +0 -1
- package/dist/src/components/Dropdown/Root/WalletAddress.d.ts +0 -4
- package/dist/src/components/Dropdown/Root/WalletAddress.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/WalletAddress.js +0 -66
- package/dist/src/components/Dropdown/Root/WalletAddress.js.map +0 -1
- package/dist/src/components/Dropdown/Root/WelcomeBlock.d.ts +0 -6
- package/dist/src/components/Dropdown/Root/WelcomeBlock.d.ts.map +0 -1
- package/dist/src/components/Dropdown/Root/WelcomeBlock.js +0 -88
- package/dist/src/components/Dropdown/Root/WelcomeBlock.js.map +0 -1
- package/dist/src/components/Dropdown/SlotNumber.d.ts +0 -19
- package/dist/src/components/Dropdown/SlotNumber.d.ts.map +0 -1
- package/dist/src/components/Dropdown/SlotNumber.js +0 -67
- package/dist/src/components/Dropdown/SlotNumber.js.map +0 -1
- package/dist/src/components/Dropdown/TestnetTopBanner.d.ts +0 -3
- package/dist/src/components/Dropdown/TestnetTopBanner.d.ts.map +0 -1
- package/dist/src/components/Dropdown/TestnetTopBanner.js +0 -14
- package/dist/src/components/Dropdown/TestnetTopBanner.js.map +0 -1
- package/dist/src/components/Dropdown/index.d.ts +0 -3
- package/dist/src/components/Dropdown/index.d.ts.map +0 -1
- package/dist/src/components/Dropdown/index.js +0 -2
- package/dist/src/components/Dropdown/index.js.map +0 -1
- package/dist/src/components/index.d.ts +0 -2
- package/dist/src/components/index.d.ts.map +0 -1
- package/dist/src/components/index.js +0 -2
- package/dist/src/components/index.js.map +0 -1
- package/src/assets/DefaultAvatar.tsx +0 -74
- package/src/components/Dropdown/ConnectedTrigger.tsx +0 -76
- package/src/components/Dropdown/Content.tsx +0 -53
- package/src/components/Dropdown/DisconnectedTrigger.tsx +0 -36
- package/src/components/Dropdown/Dropdown.tsx +0 -100
- package/src/components/Dropdown/ListingItem.tsx +0 -176
- package/src/components/Dropdown/NestedViewLayout.tsx +0 -87
- package/src/components/Dropdown/README.md +0 -41
- package/src/components/Dropdown/Receive/Receive.tsx +0 -144
- package/src/components/Dropdown/Root/AccountAddressActions.tsx +0 -99
- package/src/components/Dropdown/Root/AccountBalance.tsx +0 -69
- package/src/components/Dropdown/Root/AccountBtcListing.tsx +0 -53
- package/src/components/Dropdown/Root/AccountError.tsx +0 -34
- package/src/components/Dropdown/Root/AccountMusdListing.tsx +0 -45
- package/src/components/Dropdown/Root/AccountOtherAssets.tsx +0 -85
- package/src/components/Dropdown/Root/Root.tsx +0 -77
- package/src/components/Dropdown/Root/WalletAddress.tsx +0 -123
- package/src/components/Dropdown/Root/WelcomeBlock.tsx +0 -173
- package/src/components/Dropdown/SlotNumber.tsx +0 -131
- package/src/components/Dropdown/TestnetTopBanner.tsx +0 -32
- package/src/components/Dropdown/index.ts +0 -2
- package/src/components/index.ts +0 -1
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
import { Block, HeadingMedium, LabelLarge, Mats, mergeOverrides, Skeleton, useStyletron, } from "@mezo-org/mezo-clay";
|
|
2
|
-
import React from "react";
|
|
3
|
-
import DefaultAvatar from "../../../assets/DefaultAvatar";
|
|
4
|
-
import { useGetCurrentAccount } from "../../../hooks";
|
|
5
|
-
import { formatNumberToCompactString } from "../../../utils/numbers";
|
|
6
|
-
import AccountError from "./AccountError";
|
|
7
|
-
import { usePassportContext } from "../../../hooks/usePassportContext";
|
|
8
|
-
import SlotNumber from "../SlotNumber";
|
|
9
|
-
const DOT_DELIMITER_REGEX = /(?=\.)/;
|
|
10
|
-
function WelcomeBlockSkeleton() {
|
|
11
|
-
const [, theme] = useStyletron();
|
|
12
|
-
return (React.createElement(Block, { display: "flex", alignItems: "center", padding: theme.sizing.scale600, paddingTop: theme.sizing.scale900, paddingBottom: theme.sizing.scale800, overrides: {
|
|
13
|
-
Block: {
|
|
14
|
-
style: {
|
|
15
|
-
gap: theme.sizing.scale600,
|
|
16
|
-
},
|
|
17
|
-
},
|
|
18
|
-
} },
|
|
19
|
-
React.createElement(Skeleton, { animation: true, width: theme.sizing.scale1200, height: theme.sizing.scale1200, overrides: {
|
|
20
|
-
Root: {
|
|
21
|
-
style: {
|
|
22
|
-
borderRadius: "100%",
|
|
23
|
-
},
|
|
24
|
-
},
|
|
25
|
-
} }),
|
|
26
|
-
React.createElement(Block, { display: "flex", flexDirection: "column", flex: 1, overrides: {
|
|
27
|
-
Block: {
|
|
28
|
-
style: {
|
|
29
|
-
gap: theme.sizing.scale100,
|
|
30
|
-
},
|
|
31
|
-
},
|
|
32
|
-
} },
|
|
33
|
-
React.createElement(Skeleton, { animation: true, width: "60%", height: theme.sizing.scale900 }),
|
|
34
|
-
React.createElement(Skeleton, { animation: true, width: "40%", height: theme.sizing.scale800 }))));
|
|
35
|
-
}
|
|
36
|
-
export default function WelcomeBlock(props) {
|
|
37
|
-
const { overrides, ...restProps } = props;
|
|
38
|
-
const { accountDataRefetchInterval } = usePassportContext();
|
|
39
|
-
const { data, isError, isPending } = useGetCurrentAccount({
|
|
40
|
-
staleTime: accountDataRefetchInterval,
|
|
41
|
-
refetchInterval: accountDataRefetchInterval,
|
|
42
|
-
});
|
|
43
|
-
const [, theme] = useStyletron();
|
|
44
|
-
if (isError) {
|
|
45
|
-
return (React.createElement(AccountError, { padding: theme.sizing.scale600, paddingTop: theme.sizing.scale900, paddingBottom: theme.sizing.scale800, marginBottom: theme.sizing.scale300, topic: "account information" }));
|
|
46
|
-
}
|
|
47
|
-
if (isPending) {
|
|
48
|
-
return React.createElement(WelcomeBlockSkeleton, null);
|
|
49
|
-
}
|
|
50
|
-
const [mezoId, mezoIdSuffix] = (data.mezoId ?? "").split(DOT_DELIMITER_REGEX);
|
|
51
|
-
return (React.createElement(Block, { display: "flex", alignItems: "center", paddingLeft: theme.sizing.scale600, paddingRight: theme.sizing.scale600, paddingTop: theme.sizing.scale900, paddingBottom: theme.sizing.scale800, overrides: mergeOverrides(overrides, {
|
|
52
|
-
Block: {
|
|
53
|
-
style: {
|
|
54
|
-
gap: theme.sizing.scale600,
|
|
55
|
-
},
|
|
56
|
-
},
|
|
57
|
-
}), ...restProps },
|
|
58
|
-
React.createElement(Block, { as: DefaultAvatar, width: theme.sizing.scale1200, height: theme.sizing.scale1200, overrides: {
|
|
59
|
-
Block: {
|
|
60
|
-
style: {
|
|
61
|
-
borderRadius: "100%",
|
|
62
|
-
},
|
|
63
|
-
},
|
|
64
|
-
} }),
|
|
65
|
-
React.createElement(Block, { display: "flex", flexDirection: "column" },
|
|
66
|
-
mezoId && mezoIdSuffix && (React.createElement(HeadingMedium, { as: "span" },
|
|
67
|
-
React.createElement(Block, { as: "span" }, mezoId),
|
|
68
|
-
React.createElement(Block, { as: "span", color: theme.colors.contentSecondary }, mezoIdSuffix))),
|
|
69
|
-
React.createElement(Block, { display: "flex", alignItems: "center", overrides: {
|
|
70
|
-
Block: {
|
|
71
|
-
style: {
|
|
72
|
-
gap: theme.sizing.scale100,
|
|
73
|
-
},
|
|
74
|
-
},
|
|
75
|
-
} },
|
|
76
|
-
React.createElement(Mats, { size: theme.sizing.scale600, overrides: {
|
|
77
|
-
Svg: {
|
|
78
|
-
style: {
|
|
79
|
-
margin: theme.sizing.scale100, // To reduce gap
|
|
80
|
-
},
|
|
81
|
-
},
|
|
82
|
-
} }),
|
|
83
|
-
React.createElement(LabelLarge, { color: theme.colors.contentPrimary },
|
|
84
|
-
React.createElement(SlotNumber, { formatFunction: formatNumberToCompactString }, data.totalMats),
|
|
85
|
-
" ",
|
|
86
|
-
"mats")))));
|
|
87
|
-
}
|
|
88
|
-
//# sourceMappingURL=WelcomeBlock.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"WelcomeBlock.js","sourceRoot":"","sources":["../../../../../src/components/Dropdown/Root/WelcomeBlock.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
type SlotNumberProps = {
|
|
3
|
-
className?: string;
|
|
4
|
-
children: number;
|
|
5
|
-
formatFunction?: (value: number) => string;
|
|
6
|
-
};
|
|
7
|
-
/**
|
|
8
|
-
* SlotNumber component displays a number with animated digits.
|
|
9
|
-
*
|
|
10
|
-
* @typedef {object} SlotNumberProps
|
|
11
|
-
* @property {number} children - The number to display.
|
|
12
|
-
* @property {function} [formatFunction] - Optional function to format the number.
|
|
13
|
-
* @property {BlockProps} [restProps] - Additional properties for the Block component.
|
|
14
|
-
* @see https://pyszkowski.dev/writings/slot-number
|
|
15
|
-
* @returns {JSX.Element} The rendered SlotNumber component.
|
|
16
|
-
*/
|
|
17
|
-
declare function SlotNumber(props: SlotNumberProps): React.JSX.Element;
|
|
18
|
-
export default SlotNumber;
|
|
19
|
-
//# sourceMappingURL=SlotNumber.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SlotNumber.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/SlotNumber.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAItC,KAAK,eAAe,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CAC3C,CAAA;AAoED;;;;;;;;;GASG;AACH,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,qBAyCzC;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
/* eslint-disable react/no-array-index-key */
|
|
2
|
-
import React, { useMemo } from "react";
|
|
3
|
-
import { AnimatePresence, motion } from "motion/react";
|
|
4
|
-
import { Block, useStyletron } from "@mezo-org/mezo-clay";
|
|
5
|
-
function SlotNumberDigit(props) {
|
|
6
|
-
const { children: value, ...restProps } = props;
|
|
7
|
-
const [css] = useStyletron();
|
|
8
|
-
const digits = [...Array(10).keys()];
|
|
9
|
-
return (React.createElement(AnimatePresence, { initial: false },
|
|
10
|
-
React.createElement(motion.div, { initial: {
|
|
11
|
-
y: "100%",
|
|
12
|
-
}, animate: {
|
|
13
|
-
y: "0%",
|
|
14
|
-
}, layout: "position", className: css({
|
|
15
|
-
position: "relative",
|
|
16
|
-
}), ...restProps },
|
|
17
|
-
React.createElement(Block, { overrides: {
|
|
18
|
-
Block: {
|
|
19
|
-
style: {
|
|
20
|
-
visibility: "hidden",
|
|
21
|
-
},
|
|
22
|
-
},
|
|
23
|
-
} }, value),
|
|
24
|
-
React.createElement(motion.div, { className: css({
|
|
25
|
-
display: "flex",
|
|
26
|
-
flexDirection: "column",
|
|
27
|
-
position: "absolute",
|
|
28
|
-
inset: 0,
|
|
29
|
-
height: "fit-content",
|
|
30
|
-
}), initial: false, animate: { y: `${(value / 10) * -100}%` }, transition: {
|
|
31
|
-
type: "spring",
|
|
32
|
-
damping: 16,
|
|
33
|
-
stiffness: 220,
|
|
34
|
-
} }, digits.map((digit) => (React.createElement(Block, { as: "span", key: digit }, digit)))))));
|
|
35
|
-
}
|
|
36
|
-
/**
|
|
37
|
-
* SlotNumber component displays a number with animated digits.
|
|
38
|
-
*
|
|
39
|
-
* @typedef {object} SlotNumberProps
|
|
40
|
-
* @property {number} children - The number to display.
|
|
41
|
-
* @property {function} [formatFunction] - Optional function to format the number.
|
|
42
|
-
* @property {BlockProps} [restProps] - Additional properties for the Block component.
|
|
43
|
-
* @see https://pyszkowski.dev/writings/slot-number
|
|
44
|
-
* @returns {JSX.Element} The rendered SlotNumber component.
|
|
45
|
-
*/
|
|
46
|
-
function SlotNumber(props) {
|
|
47
|
-
const { children: value, formatFunction, ...restProps } = props;
|
|
48
|
-
const [css] = useStyletron();
|
|
49
|
-
const characters = useMemo(() => {
|
|
50
|
-
const formattedValue = formatFunction
|
|
51
|
-
? formatFunction(value)
|
|
52
|
-
: value.toString();
|
|
53
|
-
return formattedValue
|
|
54
|
-
.split("")
|
|
55
|
-
.map((character) => (/^[0-9]$/.test(character) ? +character : character))
|
|
56
|
-
.reverse();
|
|
57
|
-
}, [formatFunction, value]);
|
|
58
|
-
return (React.createElement(motion.div, { layout: true, className: css({
|
|
59
|
-
display: "inline-flex",
|
|
60
|
-
flexDirection: "row-reverse",
|
|
61
|
-
justifyContent: "flex-end",
|
|
62
|
-
overflow: "hidden",
|
|
63
|
-
userSelect: "none",
|
|
64
|
-
}), ...restProps }, characters.map((character, index) => typeof character === "number" ? (React.createElement(SlotNumberDigit, { key: `slot-number-character-${index}` }, character)) : (React.createElement(motion.span, { layout: true, key: `slot-number-character-${index}` }, character)))));
|
|
65
|
-
}
|
|
66
|
-
export default SlotNumber;
|
|
67
|
-
//# sourceMappingURL=SlotNumber.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SlotNumber.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/SlotNumber.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TestnetTopBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/TestnetTopBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,MAAM,CAAC,OAAO,UAAU,gBAAgB,6BAsBvC"}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Block, InfoCircle, LabelSmall, useStyletron, } from "@mezo-org/mezo-clay";
|
|
3
|
-
import { usePassportContext } from "../../hooks/usePassportContext";
|
|
4
|
-
export default function TestnetTopBanner() {
|
|
5
|
-
const [, theme] = useStyletron();
|
|
6
|
-
const { environment } = usePassportContext();
|
|
7
|
-
if (environment !== "testnet") {
|
|
8
|
-
return null;
|
|
9
|
-
}
|
|
10
|
-
return (React.createElement(Block, { display: "flex", alignItems: "center", padding: `${theme.sizing.scale700} ${theme.sizing.scale600}`, backgroundColor: theme.colors.warning },
|
|
11
|
-
React.createElement(InfoCircle, { size: theme.sizing.scale550 }),
|
|
12
|
-
React.createElement(LabelSmall, { marginLeft: theme.sizing.scale500 }, "You are using testnet funds.")));
|
|
13
|
-
}
|
|
14
|
-
//# sourceMappingURL=TestnetTopBanner.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TestnetTopBanner.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/TestnetTopBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EACL,KAAK,EACL,UAAU,EACV,UAAU,EACV,YAAY,GACb,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAA;AAEnE,MAAM,CAAC,OAAO,UAAU,gBAAgB;IACtC,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,YAAY,EAAE,CAAA;IAEhC,MAAM,EAAE,WAAW,EAAE,GAAG,kBAAkB,EAAE,CAAA;IAE5C,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,oBAAC,KAAK,IACJ,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,QAAQ,EACnB,OAAO,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,IAAI,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,EAC5D,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO;QAErC,oBAAC,UAAU,IAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,GAAI;QAC3C,oBAAC,UAAU,IAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,mCAEhC,CACP,CACT,CAAA;AACH,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAA"}
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
import { Block, BlockProps } from "@mezo-org/mezo-clay"
|
|
2
|
-
import React, { SVGProps } from "react"
|
|
3
|
-
|
|
4
|
-
function DefaultAvatar(props: SVGProps<SVGSVGElement>) {
|
|
5
|
-
return (
|
|
6
|
-
<svg viewBox="0 0 214 214" fill="none" {...props}>
|
|
7
|
-
<rect y="-0.478027" width="166.379" height="81.7091" fill="#FF004D" />
|
|
8
|
-
<rect x="166" y="-0.478027" width="48" height="82" fill="black" />
|
|
9
|
-
<rect
|
|
10
|
-
x="166.379"
|
|
11
|
-
y="81.231"
|
|
12
|
-
width="24.1044"
|
|
13
|
-
height="132.291"
|
|
14
|
-
fill="#DFFF80"
|
|
15
|
-
/>
|
|
16
|
-
<rect
|
|
17
|
-
x="118.758"
|
|
18
|
-
y="81.231"
|
|
19
|
-
width="24.1044"
|
|
20
|
-
height="132.291"
|
|
21
|
-
fill="#FF5500"
|
|
22
|
-
/>
|
|
23
|
-
<rect
|
|
24
|
-
x="71.1372"
|
|
25
|
-
y="81.231"
|
|
26
|
-
width="24.1044"
|
|
27
|
-
height="132.291"
|
|
28
|
-
fill="#5A59A7"
|
|
29
|
-
/>
|
|
30
|
-
<rect
|
|
31
|
-
x="23.5166"
|
|
32
|
-
y="81.231"
|
|
33
|
-
width="24.1044"
|
|
34
|
-
height="132.291"
|
|
35
|
-
fill="#47B5FF"
|
|
36
|
-
/>
|
|
37
|
-
<rect y="81.231" width="23.5165" height="132.291" fill="#A3C238" />
|
|
38
|
-
<rect
|
|
39
|
-
x="190.483"
|
|
40
|
-
y="81.231"
|
|
41
|
-
width="23.5165"
|
|
42
|
-
height="132.291"
|
|
43
|
-
fill="#6E6E70"
|
|
44
|
-
/>
|
|
45
|
-
<rect
|
|
46
|
-
x="142.863"
|
|
47
|
-
y="81.231"
|
|
48
|
-
width="23.5165"
|
|
49
|
-
height="132.291"
|
|
50
|
-
fill="#0A3C01"
|
|
51
|
-
/>
|
|
52
|
-
<rect
|
|
53
|
-
x="95.2417"
|
|
54
|
-
y="81.231"
|
|
55
|
-
width="23.5165"
|
|
56
|
-
height="132.291"
|
|
57
|
-
fill="#F2A91F"
|
|
58
|
-
/>
|
|
59
|
-
<rect
|
|
60
|
-
x="47.6211"
|
|
61
|
-
y="81.231"
|
|
62
|
-
width="23.5165"
|
|
63
|
-
height="132.291"
|
|
64
|
-
fill="#6B3D01"
|
|
65
|
-
/>
|
|
66
|
-
</svg>
|
|
67
|
-
)
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
function DefaultAvatarComponent(props: BlockProps) {
|
|
71
|
-
return <Block as={DefaultAvatar} {...props} />
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
export default DefaultAvatarComponent
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
import { Block, Button, ButtonProps, useStyletron } from "@mezo-org/mezo-clay"
|
|
2
|
-
import React, { forwardRef, ReactNode, useMemo } from "react"
|
|
3
|
-
|
|
4
|
-
type ConnectedTriggerProps = Omit<ButtonProps, "children" | "size"> & {
|
|
5
|
-
avatar: ReactNode
|
|
6
|
-
size?: "medium" | "large"
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
const ConnectedTrigger = forwardRef<HTMLButtonElement, ConnectedTriggerProps>(
|
|
10
|
-
(props, ref) => {
|
|
11
|
-
const { onClick, avatar, size = "medium", ...restProps } = props
|
|
12
|
-
|
|
13
|
-
const [, theme] = useStyletron()
|
|
14
|
-
|
|
15
|
-
const avatarSize = useMemo(() => {
|
|
16
|
-
const sizeMap = {
|
|
17
|
-
medium: theme.sizing.scale950,
|
|
18
|
-
large: theme.sizing.scale1400,
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
return sizeMap[size]
|
|
22
|
-
}, [theme, size])
|
|
23
|
-
|
|
24
|
-
const buttonPadding = useMemo(() => {
|
|
25
|
-
const paddingMap = {
|
|
26
|
-
medium: theme.sizing.scale0,
|
|
27
|
-
large: theme.sizing.scale100,
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
return paddingMap[size]
|
|
31
|
-
}, [theme, size])
|
|
32
|
-
|
|
33
|
-
return (
|
|
34
|
-
<Button
|
|
35
|
-
overrides={{
|
|
36
|
-
BaseButton: {
|
|
37
|
-
props: { ref, ...restProps },
|
|
38
|
-
style: {
|
|
39
|
-
borderRadius: "100%",
|
|
40
|
-
overflow: "hidden",
|
|
41
|
-
padding: buttonPadding,
|
|
42
|
-
},
|
|
43
|
-
},
|
|
44
|
-
}}
|
|
45
|
-
onClick={onClick}
|
|
46
|
-
>
|
|
47
|
-
{typeof avatar === "string" ? (
|
|
48
|
-
<Block
|
|
49
|
-
width={avatarSize}
|
|
50
|
-
height={avatarSize}
|
|
51
|
-
as="img"
|
|
52
|
-
src={avatar}
|
|
53
|
-
alt=""
|
|
54
|
-
/>
|
|
55
|
-
) : (
|
|
56
|
-
<Block
|
|
57
|
-
width={avatarSize}
|
|
58
|
-
height={avatarSize}
|
|
59
|
-
overrides={{
|
|
60
|
-
Block: {
|
|
61
|
-
style: {
|
|
62
|
-
borderRadius: "100%",
|
|
63
|
-
overflow: "hidden",
|
|
64
|
-
},
|
|
65
|
-
},
|
|
66
|
-
}}
|
|
67
|
-
>
|
|
68
|
-
{avatar}
|
|
69
|
-
</Block>
|
|
70
|
-
)}
|
|
71
|
-
</Button>
|
|
72
|
-
)
|
|
73
|
-
},
|
|
74
|
-
)
|
|
75
|
-
|
|
76
|
-
export default ConnectedTrigger
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { Block, useStyletron } from "@mezo-org/mezo-clay"
|
|
2
|
-
import React, { useEffect } from "react"
|
|
3
|
-
import useDropdownStore, { DropdownView } from "../../stores/dropdownStore"
|
|
4
|
-
import Root from "./Root/Root"
|
|
5
|
-
import Receive from "./Receive/Receive"
|
|
6
|
-
import TestnetTopBanner from "./TestnetTopBanner"
|
|
7
|
-
|
|
8
|
-
type ContentProps = {
|
|
9
|
-
onSignOut?: () => void
|
|
10
|
-
onOtherAssetsClick?: () => void
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
function Content(props: ContentProps) {
|
|
14
|
-
const { onSignOut, onOtherAssetsClick } = props
|
|
15
|
-
|
|
16
|
-
const [_, theme] = useStyletron()
|
|
17
|
-
|
|
18
|
-
const currentView = useDropdownStore((state) => state.view)
|
|
19
|
-
const setView = useDropdownStore((state) => state.setView)
|
|
20
|
-
|
|
21
|
-
useEffect(
|
|
22
|
-
() => () => {
|
|
23
|
-
setView(DropdownView.ROOT)
|
|
24
|
-
},
|
|
25
|
-
[setView],
|
|
26
|
-
)
|
|
27
|
-
|
|
28
|
-
return (
|
|
29
|
-
<Block
|
|
30
|
-
display="inline-flex"
|
|
31
|
-
flexDirection="column"
|
|
32
|
-
backgroundColor={theme.colors.backgroundPrimary}
|
|
33
|
-
width="100%"
|
|
34
|
-
overrides={{
|
|
35
|
-
Block: {
|
|
36
|
-
style: {
|
|
37
|
-
boxSizing: "border-box",
|
|
38
|
-
},
|
|
39
|
-
},
|
|
40
|
-
}}
|
|
41
|
-
>
|
|
42
|
-
<TestnetTopBanner />
|
|
43
|
-
|
|
44
|
-
{currentView === DropdownView.ROOT && (
|
|
45
|
-
<Root onSignOut={onSignOut} onOtherAssetsClick={onOtherAssetsClick} />
|
|
46
|
-
)}
|
|
47
|
-
|
|
48
|
-
{currentView === DropdownView.RECEIVE && <Receive />}
|
|
49
|
-
</Block>
|
|
50
|
-
)
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
export default Content
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { Button, ButtonProps, LogIn01, useStyletron } from "@mezo-org/mezo-clay"
|
|
2
|
-
import React, { forwardRef } from "react"
|
|
3
|
-
|
|
4
|
-
type DisconnectedTriggerProps = Omit<ButtonProps, "children"> & {
|
|
5
|
-
children: string
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const DisconnectedTrigger = forwardRef<
|
|
9
|
-
HTMLButtonElement,
|
|
10
|
-
DisconnectedTriggerProps
|
|
11
|
-
>((props, ref) => {
|
|
12
|
-
const { onClick, children, ...restProps } = props
|
|
13
|
-
|
|
14
|
-
const [, theme] = useStyletron()
|
|
15
|
-
|
|
16
|
-
return (
|
|
17
|
-
<Button
|
|
18
|
-
startEnhancer={
|
|
19
|
-
<LogIn01 color="currentColor" size={theme.sizing.scale600} />
|
|
20
|
-
}
|
|
21
|
-
overrides={{
|
|
22
|
-
Root: {
|
|
23
|
-
props: { ref },
|
|
24
|
-
},
|
|
25
|
-
}}
|
|
26
|
-
size="small"
|
|
27
|
-
shape="pill"
|
|
28
|
-
onClick={onClick}
|
|
29
|
-
{...restProps}
|
|
30
|
-
>
|
|
31
|
-
{children}
|
|
32
|
-
</Button>
|
|
33
|
-
)
|
|
34
|
-
})
|
|
35
|
-
|
|
36
|
-
export default DisconnectedTrigger
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
ButtonProps,
|
|
3
|
-
StatefulPopover,
|
|
4
|
-
StatefulPopoverProps,
|
|
5
|
-
useStyletron,
|
|
6
|
-
} from "@mezo-org/mezo-clay"
|
|
7
|
-
import { useConnectModal } from "@rainbow-me/rainbowkit"
|
|
8
|
-
import React from "react"
|
|
9
|
-
import DefaultAvatar from "../../assets/DefaultAvatar"
|
|
10
|
-
import ConnectedTrigger from "./ConnectedTrigger"
|
|
11
|
-
import Content from "./Content"
|
|
12
|
-
import DisconnectedTrigger from "./DisconnectedTrigger"
|
|
13
|
-
import useWalletAccount from "../../hooks/useWalletAccount"
|
|
14
|
-
import { useWatchTransferEventsForAllTokens } from "../../hooks/useWatchTransferEvents"
|
|
15
|
-
|
|
16
|
-
export type DropdownProps = {
|
|
17
|
-
/** The callback to be called when the user clicks the sign-out button */
|
|
18
|
-
onSignOut?: () => void
|
|
19
|
-
/** The callback to be called when the user clicks the button in sign-in state */
|
|
20
|
-
onSignIn?: () => void
|
|
21
|
-
/** The props to be passed to the trigger button */
|
|
22
|
-
triggerProps?: {
|
|
23
|
-
signedIn?: Omit<ButtonProps, "onClick" | "size"> & {
|
|
24
|
-
size: "medium" | "large"
|
|
25
|
-
}
|
|
26
|
-
signedOut?: Omit<ButtonProps, "onClick">
|
|
27
|
-
}
|
|
28
|
-
onOtherAssetsClick?: () => void
|
|
29
|
-
} & Omit<StatefulPopoverProps, "children" | "content">
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* Passport Dropdown component that displays user's wallet and assets information.
|
|
33
|
-
* @param {DropdownProps} props - Component props.
|
|
34
|
-
* @returns {JSX.Element}
|
|
35
|
-
*/
|
|
36
|
-
export function Dropdown(props: DropdownProps) {
|
|
37
|
-
const {
|
|
38
|
-
placement = "bottomRight",
|
|
39
|
-
animateOutTime = 120,
|
|
40
|
-
onSignIn,
|
|
41
|
-
onSignOut,
|
|
42
|
-
overrides,
|
|
43
|
-
triggerProps,
|
|
44
|
-
onOtherAssetsClick,
|
|
45
|
-
...restProps
|
|
46
|
-
} = props
|
|
47
|
-
|
|
48
|
-
const [, theme] = useStyletron()
|
|
49
|
-
|
|
50
|
-
const walletAccount = useWalletAccount()
|
|
51
|
-
|
|
52
|
-
useWatchTransferEventsForAllTokens()
|
|
53
|
-
|
|
54
|
-
const { openConnectModal } = useConnectModal()
|
|
55
|
-
|
|
56
|
-
if (!walletAccount?.isConnected) {
|
|
57
|
-
return (
|
|
58
|
-
<DisconnectedTrigger
|
|
59
|
-
// If connect wallet flow is not provided it fallbacks to RainbowKit's
|
|
60
|
-
// connect modal
|
|
61
|
-
onClick={onSignIn || openConnectModal}
|
|
62
|
-
{...triggerProps?.signedOut}
|
|
63
|
-
>
|
|
64
|
-
Sign in
|
|
65
|
-
</DisconnectedTrigger>
|
|
66
|
-
)
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
return (
|
|
70
|
-
<StatefulPopover
|
|
71
|
-
content={
|
|
72
|
-
<Content
|
|
73
|
-
onSignOut={onSignOut}
|
|
74
|
-
onOtherAssetsClick={onOtherAssetsClick}
|
|
75
|
-
/>
|
|
76
|
-
}
|
|
77
|
-
placement={placement}
|
|
78
|
-
animateOutTime={animateOutTime}
|
|
79
|
-
overrides={{
|
|
80
|
-
...overrides,
|
|
81
|
-
Body: {
|
|
82
|
-
...overrides?.Body,
|
|
83
|
-
style: {
|
|
84
|
-
width: "402px",
|
|
85
|
-
borderRadius: theme.borders.radius500,
|
|
86
|
-
boxShadow: theme.lighting.shadow500,
|
|
87
|
-
overflow: "hidden",
|
|
88
|
-
...overrides?.Body?.style,
|
|
89
|
-
},
|
|
90
|
-
},
|
|
91
|
-
}}
|
|
92
|
-
{...restProps}
|
|
93
|
-
>
|
|
94
|
-
<ConnectedTrigger
|
|
95
|
-
avatar={<DefaultAvatar />}
|
|
96
|
-
{...triggerProps?.signedIn}
|
|
97
|
-
/>
|
|
98
|
-
</StatefulPopover>
|
|
99
|
-
)
|
|
100
|
-
}
|