@getpara/react-common 2.0.0-alpha.7 → 2.0.0-alpha.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -0
- package/dist/{chunk-GOCCUU3Z.js → chunk-MMUBH76A.js} +17 -0
- package/dist/classes/ParaInternal.d.ts +26 -7
- package/dist/classes/ParaInternal.js +22 -2
- package/dist/components/HeroSpinner.d.ts +4 -3
- package/dist/components/HeroSpinner.js +29 -15
- package/dist/components/KnownDevices.js +6 -7
- package/dist/components/MoonPayEmbed.d.ts +4 -2
- package/dist/components/MoonPayEmbed.js +57 -84
- package/dist/components/NetworkSpeedBanner.js +6 -6
- package/dist/components/QRCode.js +8 -8
- package/dist/components/RampEmbed.d.ts +2 -2
- package/dist/components/RampEmbed.js +17 -29
- package/dist/components/UserIdentifier.d.ts +8 -0
- package/dist/components/UserIdentifier.js +30 -22
- package/dist/components/WalletSelect.d.ts +33 -0
- package/dist/components/WalletSelect.js +171 -0
- package/dist/components/WalletTypeIcon.d.ts +9 -0
- package/dist/components/WalletTypeIcon.js +45 -0
- package/dist/components/WarningBanner.d.ts +7 -0
- package/dist/components/WarningBanner.js +60 -0
- package/dist/components/common.d.ts +3 -3
- package/dist/components/common.js +8 -8
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.js +3 -1
- package/dist/constants/aaguiMetadata.js +1 -1
- package/dist/constants/externalWalletDefaults.d.ts +50 -0
- package/dist/constants/externalWalletDefaults.js +52 -0
- package/dist/constants/index.d.ts +37 -0
- package/dist/constants/index.js +152 -0
- package/dist/constants/oAuthLogos.d.ts +12 -0
- package/dist/constants/oAuthLogos.js +160 -0
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.js +2 -0
- package/dist/hooks/useCopyToClipboard.js +1 -1
- package/dist/hooks/useDropdownPosition.d.ts +7 -0
- package/dist/hooks/useDropdownPosition.js +33 -0
- package/dist/hooks/useUserAgent.d.ts +2 -0
- package/dist/hooks/useUserAgent.js +10 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/types/commonTypes.d.ts +15 -0
- package/dist/types/commonTypes.js +1 -0
- package/dist/types/externalWalletCommon.d.ts +75 -37
- package/dist/types/externalWalletCommon.js +0 -31
- package/dist/types/index.d.ts +8 -5
- package/dist/types/index.js +1 -0
- package/dist/utils/formatBiometricHints.d.ts +1 -1
- package/dist/utils/formatBiometricHints.js +3 -3
- package/dist/utils/getBrowserName.js +1 -1
- package/dist/utils/getDeviceLogo.js +1 -1
- package/dist/utils/getDeviceModelName.js +1 -1
- package/dist/utils/getExternalWalletDisplayName.d.ts +3 -1
- package/dist/utils/getExternalWalletDisplayName.js +7 -15
- package/dist/utils/getExternalWalletIcon.d.ts +5 -0
- package/dist/utils/getExternalWalletIcon.js +17 -0
- package/dist/utils/index.d.ts +18 -16
- package/dist/utils/index.js +27 -31
- package/dist/utils/openMobileUrl.d.ts +1 -0
- package/dist/utils/openMobileUrl.js +34 -0
- package/dist/utils/safeStyled.d.ts +2 -0
- package/dist/utils/safeStyled.js +25 -0
- package/package.json +22 -24
- package/dist/components/StripeEmbed.d.ts +0 -4
- package/dist/components/StripeEmbed.js +0 -138
- package/dist/utils/offRampSend.d.ts +0 -7
- package/dist/utils/offRampSend.js +0 -75
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { ExternalWalletInfo } from '@getpara/web-sdk';
|
|
2
|
+
export declare const defaultCosmosExternalWallet: {
|
|
3
|
+
wallets: any[];
|
|
4
|
+
chains: any[];
|
|
5
|
+
chainId: any;
|
|
6
|
+
disconnect: () => Promise<void>;
|
|
7
|
+
disconnectStatus: string;
|
|
8
|
+
switchChain: () => Promise<void>;
|
|
9
|
+
connectParaEmbedded: () => Promise<{}>;
|
|
10
|
+
signMessage: () => Promise<{}>;
|
|
11
|
+
signVerificationMessage: () => Promise<{}>;
|
|
12
|
+
requestInfo: () => Promise<any>;
|
|
13
|
+
disconnectBase: () => Promise<void>;
|
|
14
|
+
useAccount: () => any;
|
|
15
|
+
};
|
|
16
|
+
export declare const defaultEvmExternalWallet: {
|
|
17
|
+
wallets: any[];
|
|
18
|
+
chains: any[];
|
|
19
|
+
chainId: any;
|
|
20
|
+
username: any;
|
|
21
|
+
avatar: any;
|
|
22
|
+
balance: any;
|
|
23
|
+
disconnect: () => Promise<void>;
|
|
24
|
+
disconnectStatus: string;
|
|
25
|
+
switchChain: () => Promise<void>;
|
|
26
|
+
connectParaEmbedded: () => Promise<{}>;
|
|
27
|
+
signMessage: () => Promise<{}>;
|
|
28
|
+
signVerificationMessage: () => Promise<{}>;
|
|
29
|
+
getWalletBalance: () => Promise<any>;
|
|
30
|
+
requestInfo: () => Promise<ExternalWalletInfo>;
|
|
31
|
+
disconnectBase: () => Promise<void>;
|
|
32
|
+
useAccount: () => any;
|
|
33
|
+
farcasterStatus: {
|
|
34
|
+
isPresent: false;
|
|
35
|
+
};
|
|
36
|
+
verificationStage: any;
|
|
37
|
+
};
|
|
38
|
+
export declare const defaultSolanaExternalWallet: {
|
|
39
|
+
wallets: any[];
|
|
40
|
+
disconnect: () => Promise<void>;
|
|
41
|
+
disconnectStatus: string;
|
|
42
|
+
signMessage: () => Promise<{}>;
|
|
43
|
+
signVerificationMessage: () => Promise<{}>;
|
|
44
|
+
requestInfo: () => Promise<ExternalWalletInfo>;
|
|
45
|
+
disconnectBase: () => Promise<void>;
|
|
46
|
+
useWallet: () => any;
|
|
47
|
+
farcasterStatus: {
|
|
48
|
+
isPresent: false;
|
|
49
|
+
};
|
|
50
|
+
};
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import "../chunk-MMUBH76A.js";
|
|
3
|
+
const defaultCosmosExternalWallet = {
|
|
4
|
+
wallets: [],
|
|
5
|
+
chains: [],
|
|
6
|
+
chainId: void 0,
|
|
7
|
+
disconnect: () => Promise.resolve(),
|
|
8
|
+
disconnectStatus: "idle",
|
|
9
|
+
switchChain: () => Promise.resolve(),
|
|
10
|
+
connectParaEmbedded: () => Promise.resolve({}),
|
|
11
|
+
signMessage: () => Promise.resolve({}),
|
|
12
|
+
signVerificationMessage: () => Promise.resolve({}),
|
|
13
|
+
requestInfo: () => Promise.resolve({}),
|
|
14
|
+
disconnectBase: () => Promise.resolve(),
|
|
15
|
+
useAccount: () => void 0
|
|
16
|
+
};
|
|
17
|
+
const defaultEvmExternalWallet = {
|
|
18
|
+
wallets: [],
|
|
19
|
+
chains: [],
|
|
20
|
+
chainId: void 0,
|
|
21
|
+
username: void 0,
|
|
22
|
+
avatar: void 0,
|
|
23
|
+
balance: void 0,
|
|
24
|
+
disconnect: () => Promise.resolve(),
|
|
25
|
+
disconnectStatus: "idle",
|
|
26
|
+
switchChain: () => Promise.resolve(),
|
|
27
|
+
connectParaEmbedded: () => Promise.resolve({}),
|
|
28
|
+
signMessage: () => Promise.resolve({}),
|
|
29
|
+
signVerificationMessage: () => Promise.resolve({}),
|
|
30
|
+
getWalletBalance: () => Promise.resolve(void 0),
|
|
31
|
+
requestInfo: () => Promise.resolve({}),
|
|
32
|
+
disconnectBase: () => Promise.resolve(),
|
|
33
|
+
useAccount: () => void 0,
|
|
34
|
+
farcasterStatus: { isPresent: false },
|
|
35
|
+
verificationStage: void 0
|
|
36
|
+
};
|
|
37
|
+
const defaultSolanaExternalWallet = {
|
|
38
|
+
wallets: [],
|
|
39
|
+
disconnect: () => Promise.resolve(),
|
|
40
|
+
disconnectStatus: "idle",
|
|
41
|
+
signMessage: () => Promise.resolve({}),
|
|
42
|
+
signVerificationMessage: () => Promise.resolve({}),
|
|
43
|
+
requestInfo: () => Promise.resolve({}),
|
|
44
|
+
disconnectBase: () => Promise.resolve(),
|
|
45
|
+
useWallet: () => void 0,
|
|
46
|
+
farcasterStatus: { isPresent: false }
|
|
47
|
+
};
|
|
48
|
+
export {
|
|
49
|
+
defaultCosmosExternalWallet,
|
|
50
|
+
defaultEvmExternalWallet,
|
|
51
|
+
defaultSolanaExternalWallet
|
|
52
|
+
};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { TNetwork, TOnRampAsset, OnRampMethod, OnRampProvider, TWalletType } from '@getpara/core-sdk';
|
|
2
|
+
import { IconType } from '@getpara/react-components';
|
|
3
|
+
import { Transition, Variants } from 'framer-motion';
|
|
4
|
+
import { DisplayMetadata } from '../types/commonTypes.js';
|
|
5
|
+
export declare const PARA_CONNECT = "https://connect.getpara.com/";
|
|
6
|
+
export declare const PARA_TERMS_AND_CONDITIONS = "https://getpara.com/terms";
|
|
7
|
+
export type OnRampProviderConfig = DisplayMetadata & {
|
|
8
|
+
feeLower: number;
|
|
9
|
+
feeUpper?: number;
|
|
10
|
+
methods: OnRampMethod[];
|
|
11
|
+
backgroundColors: string[];
|
|
12
|
+
};
|
|
13
|
+
export declare const ON_RAMP_PROVIDERS: Record<OnRampProvider, OnRampProviderConfig>;
|
|
14
|
+
type Networks = Record<TNetwork, DisplayMetadata>;
|
|
15
|
+
export declare const WALLET_TYPES_METADATA: Record<TWalletType, DisplayMetadata>;
|
|
16
|
+
export declare const NETWORKS: Networks;
|
|
17
|
+
export declare const ON_RAMP_ASSETS: Record<TOnRampAsset, {
|
|
18
|
+
name: string;
|
|
19
|
+
code: string;
|
|
20
|
+
icon: IconType;
|
|
21
|
+
isCircular?: boolean;
|
|
22
|
+
isDark?: boolean;
|
|
23
|
+
}>;
|
|
24
|
+
export declare function getNetworkName(str: TNetwork | string): string;
|
|
25
|
+
export declare function getNetworkIcon(str: TNetwork | string): IconType;
|
|
26
|
+
export declare function getAssetCode(str: TOnRampAsset | string): string;
|
|
27
|
+
export declare function getAssetName(str: TOnRampAsset | string): string;
|
|
28
|
+
export declare function getAssetIcon(str: TOnRampAsset | string): "alertCircle" | "alertTriangle" | "alignVerticalCenter" | "angelListBrand" | "angelList" | "appleBrand" | "apple" | "arbitrumBrand" | "arrowCircleBrokenDownLeft" | "arrowCircleDownFilled" | "arrowCircleDown" | "arrowNarrow" | "arrow" | "asterisk" | "backpack" | "backupKit" | "bank" | "baseBrand" | "beraBrand" | "brush" | "celoBrand" | "checkCircleFilled" | "checkCircle" | "checkSquare" | "check" | "chevronDown" | "chevronRight" | "chevronSelectorVertical" | "chevronUp" | "clock" | "close" | "clubhouseBrand" | "clubhouse" | "code" | "coinbase" | "copy07" | "copy" | "cosmosCircle" | "cosmos" | "cosmostation" | "creditCard02" | "creditCard" | "cube03" | "cubeOutline" | "cube" | "currencyDollar" | "decentBrand" | "decent" | "dell" | "discordBrand" | "discord" | "dot" | "dotsSquare" | "dots" | "downloadCloud" | "download" | "dribbbleBrand" | "dribbble" | "earth" | "edit02" | "emptyCircle" | "ethCircle" | "ethereum" | "eyeOff" | "eye" | "facebookBrand" | "facebook" | "farcasterBrand" | "farcaster" | "figmaBrand" | "figma" | "file" | "folder" | "githubBrand" | "github" | "globe" | "glow" | "googleBrand" | "google" | "gridDots" | "haha" | "helpCircle" | "heroAlertCircle" | "heroCheckmarkCapsule" | "heroCheckmark" | "heroEmail" | "heroExternalConnection" | "heroLock" | "heroPasskey" | "heroPhone" | "heroPlusCircleCapsule" | "heroPlusCircle" | "heroWallet" | "home" | "hp" | "image" | "infoCircle" | "instagramBrand" | "instagram" | "keplr" | "key" | "laptop" | "leap" | "lenovo" | "lg" | "lightning01" | "lightning" | "linkExternal" | "linkedinBrand" | "linkedin" | "lockKeyholeCircle" | "logOut" | "mail" | "menu" | "metamask" | "monitor" | "moonpayBrand" | "moreLoginOptions" | "motorola" | "nobleBrand" | "okx" | "optimismBrand" | "paraArrow" | "paraBlackBg" | "paraBrand" | "paraIconBrand" | "paraIconQr" | "paraIcon" | "paraLogo" | "paraRingsDark" | "paraRings" | "para" | "passcode" | "phantom" | "phone" | "pintrestBrand" | "pintrest" | "plusCircle" | "plus" | "polygonBrand" | "polygon" | "puzzlePiece" | "qrCode02" | "qrCode" | "rabby" | "rainbow" | "rampNetworkBrand" | "rampNetwork" | "redditBrand" | "reddit" | "refresh" | "safe" | "samsung" | "search" | "send" | "settings" | "share" | "shield" | "shuffle" | "signalBrand" | "signal" | "sliders" | "snapchatBrand" | "snapchat" | "solanaCircle" | "solana" | "solflare" | "spacingHeight" | "star04Filled" | "star05" | "stars01Filled" | "stars02" | "stars" | "stopSquare" | "stripeBrand" | "telegramBrand" | "telegram" | "tetherBrand" | "tikTokBrand" | "tikTok" | "trash" | "tumblrBrand" | "tumblr" | "twitterBrand" | "twitter" | "usdcBrand" | "user01" | "userCircle" | "userPlus" | "user" | "valora" | "wallet02" | "walletConnect" | "wallet" | "x" | "youtubeBrand" | "youtube" | "zap" | "zerion" | "AD" | "AE" | "AF" | "AG" | "AI" | "AL" | "AM" | "AO" | "AR" | "AS" | "AT" | "AU" | "AW" | "AX" | "AZ" | "BA" | "BB" | "BD" | "BE" | "BF" | "BG" | "BH" | "BI" | "BJ" | "BL" | "BM" | "BN" | "BO" | "BQ" | "BQ2" | "BQ3" | "BR" | "BS" | "BT" | "BW" | "BY" | "BZ" | "CA" | "CC" | "CD" | "CD2" | "CF" | "CH" | "CK" | "CL" | "CM" | "CN" | "CO" | "CR" | "CU" | "CW" | "CX" | "CY" | "CZ" | "DE" | "DJ" | "DK" | "DM" | "DO" | "DS" | "DZ" | "EC" | "EE" | "EG" | "EH" | "ER" | "ES" | "ET" | "FI" | "FJ" | "FK" | "FM" | "FO" | "FR" | "GA" | "GB2" | "GB" | "GD" | "GE" | "GG" | "GH" | "GI" | "GL" | "GM" | "GN" | "GQ" | "GR" | "GT" | "GU" | "GW" | "GY" | "HK" | "HN" | "HR" | "HT" | "HU" | "ID" | "IE" | "IL" | "IM" | "IN" | "IO" | "IQ" | "IR" | "IS" | "IT" | "JE" | "JM" | "JO" | "JP" | "KE" | "KG" | "KH" | "KI" | "KM" | "KN" | "KP" | "KR" | "KW" | "KY" | "KZ" | "LA" | "LB" | "LC" | "LI" | "LK" | "LR" | "LS" | "LT" | "LU" | "LV" | "LY" | "MA" | "MC" | "MD" | "ME" | "MG" | "MH" | "MK" | "ML" | "MM" | "MN" | "MO" | "MP" | "MQ" | "MR" | "MS" | "MT" | "MU" | "MV" | "MW" | "MX" | "MY" | "MZ" | "NA" | "NE" | "NF" | "NG" | "NI" | "NL" | "NO" | "NP" | "NR" | "NU" | "NZ" | "OM" | "PA" | "PE" | "PF" | "PG" | "PH" | "PK" | "PL" | "PN" | "PR" | "PS" | "PT" | "PW" | "PY" | "QA" | "RO" | "RS" | "RU" | "RW" | "SA" | "SB" | "SC" | "SE" | "SG" | "SI" | "SK" | "SL" | "SM" | "SN" | "SO" | "SR" | "SS" | "ST" | "SV" | "SX" | "SY" | "SZ" | "TC" | "TD" | "TG" | "TH" | "TJ" | "TK" | "TL" | "TM" | "TN" | "TO" | "TR" | "TT" | "TV" | "TW" | "TZ" | "UA" | "UG" | "US" | "UY" | "UZ" | "VC" | "VE" | "VG" | "VI" | "VN" | "VU" | "WS" | "YE" | "ZA" | "ZM" | "ZW";
|
|
29
|
+
export declare const MOBILE_SIZE = 480;
|
|
30
|
+
export declare const NETWORK_NOT_SUPPORTED_ERROR = "network not supported";
|
|
31
|
+
export declare const EMAIL_REGEX: RegExp;
|
|
32
|
+
export declare const BODY_MOTION_VARIANTS: Variants;
|
|
33
|
+
export declare const BODY_TRANSITION: Transition;
|
|
34
|
+
export declare const SDK_VERSION: string;
|
|
35
|
+
export * from './aaguiMetadata.js';
|
|
36
|
+
export * from './externalWalletDefaults.js';
|
|
37
|
+
export * from './oAuthLogos.js';
|
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
__spreadProps,
|
|
4
|
+
__spreadValues
|
|
5
|
+
} from "../chunk-MMUBH76A.js";
|
|
6
|
+
var _a;
|
|
7
|
+
import { OnRampMethod, OnRampProvider } from "@getpara/core-sdk";
|
|
8
|
+
const PARA_CONNECT = "https://connect.getpara.com/";
|
|
9
|
+
const PARA_TERMS_AND_CONDITIONS = "https://getpara.com/terms";
|
|
10
|
+
const ON_RAMP_PROVIDERS = {
|
|
11
|
+
[OnRampProvider.STRIPE]: {
|
|
12
|
+
name: "Stripe",
|
|
13
|
+
feeLower: 0.99,
|
|
14
|
+
feeUpper: 4.49,
|
|
15
|
+
methods: [OnRampMethod.ACH, OnRampMethod.DEBIT, OnRampMethod.CREDIT],
|
|
16
|
+
icon: "stripeBrand",
|
|
17
|
+
backgroundColors: ["#6772E5", "#808AF4"]
|
|
18
|
+
},
|
|
19
|
+
[OnRampProvider.RAMP]: {
|
|
20
|
+
name: "Ramp",
|
|
21
|
+
feeLower: 0.99,
|
|
22
|
+
feeUpper: 4.49,
|
|
23
|
+
methods: [OnRampMethod.ACH, OnRampMethod.DEBIT, OnRampMethod.CREDIT],
|
|
24
|
+
icon: "rampNetworkBrand",
|
|
25
|
+
backgroundColors: ["#21BF73", "#3AE492"]
|
|
26
|
+
},
|
|
27
|
+
[OnRampProvider.MOONPAY]: {
|
|
28
|
+
name: "MoonPay",
|
|
29
|
+
feeLower: 1,
|
|
30
|
+
feeUpper: 4.5,
|
|
31
|
+
methods: [OnRampMethod.ACH, OnRampMethod.DEBIT, OnRampMethod.CREDIT],
|
|
32
|
+
icon: "moonpayBrand",
|
|
33
|
+
backgroundColors: ["#7715F5", "#9647fd"]
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
const ICON_TYPES = {
|
|
37
|
+
ethereum: { isDark: true },
|
|
38
|
+
usdcBrand: { isCircular: true },
|
|
39
|
+
arbitrumBrand: { isCircular: true },
|
|
40
|
+
baseBrand: { isCircular: true },
|
|
41
|
+
optimismBrand: { isCircular: true },
|
|
42
|
+
cosmos: { isCircular: true, isDark: true },
|
|
43
|
+
celoBrand: { isCircular: true },
|
|
44
|
+
tetherBrand: { isCircular: true }
|
|
45
|
+
};
|
|
46
|
+
const WALLET_TYPES_METADATA = {
|
|
47
|
+
EVM: { name: "EVM", icon: "ethCircle", isCircular: true },
|
|
48
|
+
SOLANA: { name: "Solana", icon: "solana" },
|
|
49
|
+
COSMOS: { name: "Cosmos", icon: "cosmos", isCircular: true, isDark: true }
|
|
50
|
+
};
|
|
51
|
+
const NETWORKS = Object.entries({
|
|
52
|
+
["ETHEREUM"]: { name: "Ethereum", icon: "ethereum" },
|
|
53
|
+
["SEPOLIA"]: { name: "Sepolia", icon: "ethereum" },
|
|
54
|
+
["ARBITRUM"]: { name: "Arbitrum", icon: "arbitrumBrand" },
|
|
55
|
+
["BASE"]: { name: "Base", icon: "baseBrand" },
|
|
56
|
+
["OPTIMISM"]: { name: "Optimism", icon: "optimismBrand" },
|
|
57
|
+
["POLYGON"]: { name: "Polygon", icon: "polygonBrand" },
|
|
58
|
+
["SOLANA"]: { name: "Solana", icon: "solana" },
|
|
59
|
+
["COSMOS"]: { name: "Cosmos", icon: "cosmos" },
|
|
60
|
+
["CELO"]: { name: "Celo", icon: "celoBrand" },
|
|
61
|
+
["SOLANA_DEVNET"]: { name: "Solana Devnet", icon: "solana" },
|
|
62
|
+
["NOBLE"]: { name: "Noble", icon: "nobleBrand" },
|
|
63
|
+
["BERACHAIN"]: { name: "Berachain", icon: "beraBrand" }
|
|
64
|
+
}).reduce((acc, [key, entry]) => {
|
|
65
|
+
return __spreadProps(__spreadValues({}, acc), {
|
|
66
|
+
[key]: __spreadValues(__spreadValues({}, entry), ICON_TYPES[entry.icon])
|
|
67
|
+
});
|
|
68
|
+
}, {});
|
|
69
|
+
const ON_RAMP_ASSETS = Object.entries({
|
|
70
|
+
["ETHEREUM"]: { name: "Ethereum", code: "ETH", icon: "ethereum" },
|
|
71
|
+
["USDC"]: { name: "USD Coin", code: "USDC", icon: "usdcBrand" },
|
|
72
|
+
["POLYGON"]: { name: "Polygon", code: "POL", icon: "polygonBrand" },
|
|
73
|
+
["SOLANA"]: { name: "Solana", code: "SOL", icon: "solana" },
|
|
74
|
+
["ATOM"]: { name: "Atom", code: "ATOM", icon: "cosmos" },
|
|
75
|
+
["CELO"]: { name: "Celo", code: "CELO", icon: "celoBrand" },
|
|
76
|
+
["TETHER"]: { name: "Tether", code: "USDT", icon: "tetherBrand" },
|
|
77
|
+
["CUSD"]: { name: "Celo Dollar", code: "CUSD", icon: "celoBrand" },
|
|
78
|
+
["CEUR"]: { name: "Celo Euro", code: "CEUR", icon: "celoBrand" },
|
|
79
|
+
["CREAL"]: { name: "Celo Real", code: "CREAL", icon: "celoBrand" },
|
|
80
|
+
["BERA"]: { name: "Berachain", code: "BERA", icon: "beraBrand" }
|
|
81
|
+
}).reduce((acc, [key, entry]) => {
|
|
82
|
+
return __spreadProps(__spreadValues({}, acc), {
|
|
83
|
+
[key]: __spreadValues(__spreadValues({}, entry), ICON_TYPES[entry.icon])
|
|
84
|
+
});
|
|
85
|
+
}, {});
|
|
86
|
+
function getNetworkName(str) {
|
|
87
|
+
var _a2, _b;
|
|
88
|
+
return (_b = (_a2 = NETWORKS[str]) == null ? void 0 : _a2.name) != null ? _b : `${str[0]}${str.slice(1).toLowerCase()}`;
|
|
89
|
+
}
|
|
90
|
+
function getNetworkIcon(str) {
|
|
91
|
+
var _a2, _b;
|
|
92
|
+
return (_b = (_a2 = NETWORKS[str]) == null ? void 0 : _a2.icon) != null ? _b : "globe";
|
|
93
|
+
}
|
|
94
|
+
function getAssetCode(str) {
|
|
95
|
+
var _a2, _b;
|
|
96
|
+
return (_b = (_a2 = ON_RAMP_ASSETS[str]) == null ? void 0 : _a2.code) != null ? _b : str;
|
|
97
|
+
}
|
|
98
|
+
function getAssetName(str) {
|
|
99
|
+
var _a2, _b;
|
|
100
|
+
return (_b = (_a2 = ON_RAMP_ASSETS[str]) == null ? void 0 : _a2.name) != null ? _b : str;
|
|
101
|
+
}
|
|
102
|
+
function getAssetIcon(str) {
|
|
103
|
+
var _a2, _b;
|
|
104
|
+
return (_b = (_a2 = ON_RAMP_ASSETS[str]) == null ? void 0 : _a2.icon) != null ? _b : "emptyCircle";
|
|
105
|
+
}
|
|
106
|
+
const MOBILE_SIZE = 480;
|
|
107
|
+
const NETWORK_NOT_SUPPORTED_ERROR = "network not supported";
|
|
108
|
+
const EMAIL_REGEX = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
|
109
|
+
const BODY_MOTION_VARIANTS = {
|
|
110
|
+
enter: (direction) => {
|
|
111
|
+
return {
|
|
112
|
+
scale: direction > 0 ? 0.9 : 1.1,
|
|
113
|
+
opacity: 0
|
|
114
|
+
};
|
|
115
|
+
},
|
|
116
|
+
center: {
|
|
117
|
+
scale: 1,
|
|
118
|
+
opacity: 1
|
|
119
|
+
},
|
|
120
|
+
exit: (direction) => {
|
|
121
|
+
return {
|
|
122
|
+
scale: direction < 0 ? 0.9 : 1.1,
|
|
123
|
+
opacity: 0
|
|
124
|
+
};
|
|
125
|
+
}
|
|
126
|
+
};
|
|
127
|
+
const BODY_TRANSITION = {
|
|
128
|
+
duration: 0.2
|
|
129
|
+
};
|
|
130
|
+
const SDK_VERSION = (_a = process.env.PARA_REACT_SDK_VERSION) != null ? _a : "";
|
|
131
|
+
export * from "./aaguiMetadata.js";
|
|
132
|
+
export * from "./externalWalletDefaults.js";
|
|
133
|
+
export * from "./oAuthLogos.js";
|
|
134
|
+
export {
|
|
135
|
+
BODY_MOTION_VARIANTS,
|
|
136
|
+
BODY_TRANSITION,
|
|
137
|
+
EMAIL_REGEX,
|
|
138
|
+
MOBILE_SIZE,
|
|
139
|
+
NETWORKS,
|
|
140
|
+
NETWORK_NOT_SUPPORTED_ERROR,
|
|
141
|
+
ON_RAMP_ASSETS,
|
|
142
|
+
ON_RAMP_PROVIDERS,
|
|
143
|
+
PARA_CONNECT,
|
|
144
|
+
PARA_TERMS_AND_CONDITIONS,
|
|
145
|
+
SDK_VERSION,
|
|
146
|
+
WALLET_TYPES_METADATA,
|
|
147
|
+
getAssetCode,
|
|
148
|
+
getAssetIcon,
|
|
149
|
+
getAssetName,
|
|
150
|
+
getNetworkIcon,
|
|
151
|
+
getNetworkName
|
|
152
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { IconType } from '@getpara/react-components';
|
|
2
|
+
import { TLinkedAccountType } from '@getpara/web-sdk';
|
|
3
|
+
import { DisplayMetadata } from '../types/commonTypes.js';
|
|
4
|
+
export declare const ACCOUNT_TYPES: {
|
|
5
|
+
[key in TLinkedAccountType | string]: DisplayMetadata & {
|
|
6
|
+
isExternalWallet?: boolean;
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
export declare function getAccountTypeName(type: TLinkedAccountType | string | undefined, { inline }?: {
|
|
10
|
+
inline?: boolean;
|
|
11
|
+
}): string | undefined;
|
|
12
|
+
export declare function getAccountTypeLogo(type: TLinkedAccountType | undefined): IconType | undefined;
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import "../chunk-MMUBH76A.js";
|
|
3
|
+
const ACCOUNT_TYPES = {
|
|
4
|
+
"EMAIL": {
|
|
5
|
+
icon: "mail",
|
|
6
|
+
name: "Email",
|
|
7
|
+
inlineText: "email address",
|
|
8
|
+
isPlain: true
|
|
9
|
+
},
|
|
10
|
+
"PHONE": {
|
|
11
|
+
icon: "phone",
|
|
12
|
+
name: "Phone",
|
|
13
|
+
inlineText: "phone number",
|
|
14
|
+
isPlain: true
|
|
15
|
+
},
|
|
16
|
+
"EXTERNAL_WALLET": {
|
|
17
|
+
icon: "wallet",
|
|
18
|
+
name: "External Wallet",
|
|
19
|
+
inlineText: "external wallet",
|
|
20
|
+
isPlain: true
|
|
21
|
+
},
|
|
22
|
+
"GOOGLE": {
|
|
23
|
+
icon: "google",
|
|
24
|
+
iconBranded: "googleBrand",
|
|
25
|
+
name: "Google"
|
|
26
|
+
},
|
|
27
|
+
"TWITTER": {
|
|
28
|
+
icon: "twitter",
|
|
29
|
+
// Not using branded here to ensure the icon looks correct in dark mode
|
|
30
|
+
iconBranded: "twitter",
|
|
31
|
+
name: "X / Twitter",
|
|
32
|
+
inlineText: "X account",
|
|
33
|
+
isDark: true
|
|
34
|
+
},
|
|
35
|
+
"APPLE": {
|
|
36
|
+
icon: "apple",
|
|
37
|
+
// Not using branded here to ensure the icon looks correct in dark mode
|
|
38
|
+
iconBranded: "apple",
|
|
39
|
+
name: "Apple",
|
|
40
|
+
isDark: true
|
|
41
|
+
},
|
|
42
|
+
"DISCORD": {
|
|
43
|
+
icon: "discord",
|
|
44
|
+
iconBranded: "discordBrand",
|
|
45
|
+
name: "Discord"
|
|
46
|
+
},
|
|
47
|
+
"FACEBOOK": {
|
|
48
|
+
icon: "facebook",
|
|
49
|
+
iconBranded: "facebookBrand",
|
|
50
|
+
name: "Facebook"
|
|
51
|
+
},
|
|
52
|
+
"FARCASTER": {
|
|
53
|
+
icon: "farcaster",
|
|
54
|
+
iconBranded: "farcasterBrand",
|
|
55
|
+
name: "Farcaster"
|
|
56
|
+
},
|
|
57
|
+
"TELEGRAM": {
|
|
58
|
+
icon: "telegram",
|
|
59
|
+
iconBranded: "telegramBrand",
|
|
60
|
+
name: "Telegram"
|
|
61
|
+
},
|
|
62
|
+
"MetaMask": {
|
|
63
|
+
icon: "metamask",
|
|
64
|
+
name: "MetaMask",
|
|
65
|
+
isExternalWallet: true
|
|
66
|
+
},
|
|
67
|
+
"Rainbow": {
|
|
68
|
+
icon: "rainbow",
|
|
69
|
+
name: "Rainbow",
|
|
70
|
+
isExternalWallet: true
|
|
71
|
+
},
|
|
72
|
+
"Coinbase Wallet": {
|
|
73
|
+
icon: "coinbase",
|
|
74
|
+
name: "Coinbase Wallet",
|
|
75
|
+
isExternalWallet: true
|
|
76
|
+
},
|
|
77
|
+
"WalletConnect": {
|
|
78
|
+
icon: "walletConnect",
|
|
79
|
+
name: "WalletConnect",
|
|
80
|
+
isExternalWallet: true
|
|
81
|
+
},
|
|
82
|
+
"Zerion": {
|
|
83
|
+
icon: "zerion",
|
|
84
|
+
name: "Zerion",
|
|
85
|
+
isExternalWallet: true
|
|
86
|
+
},
|
|
87
|
+
"Safe": {
|
|
88
|
+
icon: "safe",
|
|
89
|
+
name: "Safe",
|
|
90
|
+
isExternalWallet: true
|
|
91
|
+
},
|
|
92
|
+
"Rabby": {
|
|
93
|
+
icon: "rabby",
|
|
94
|
+
name: "Rabby",
|
|
95
|
+
isExternalWallet: true
|
|
96
|
+
},
|
|
97
|
+
"OKX Wallet": {
|
|
98
|
+
icon: "okx",
|
|
99
|
+
name: "OKX Wallet",
|
|
100
|
+
isExternalWallet: true
|
|
101
|
+
},
|
|
102
|
+
"Phantom": {
|
|
103
|
+
icon: "phantom",
|
|
104
|
+
name: "Phantom",
|
|
105
|
+
isExternalWallet: true
|
|
106
|
+
},
|
|
107
|
+
"Glow": {
|
|
108
|
+
icon: "glow",
|
|
109
|
+
name: "Glow",
|
|
110
|
+
isExternalWallet: true
|
|
111
|
+
},
|
|
112
|
+
"Backpack": {
|
|
113
|
+
icon: "backpack",
|
|
114
|
+
name: "Backpack",
|
|
115
|
+
isExternalWallet: true
|
|
116
|
+
},
|
|
117
|
+
"Keplr": {
|
|
118
|
+
icon: "keplr",
|
|
119
|
+
name: "Keplr",
|
|
120
|
+
isExternalWallet: true
|
|
121
|
+
},
|
|
122
|
+
"Leap": {
|
|
123
|
+
icon: "leap",
|
|
124
|
+
name: "Leap",
|
|
125
|
+
isExternalWallet: true
|
|
126
|
+
},
|
|
127
|
+
"HaHa": {
|
|
128
|
+
icon: "haha",
|
|
129
|
+
name: "HaHa",
|
|
130
|
+
isExternalWallet: true
|
|
131
|
+
},
|
|
132
|
+
"Cosmostation": {
|
|
133
|
+
icon: "cosmostation",
|
|
134
|
+
name: "Cosmostation",
|
|
135
|
+
isExternalWallet: true
|
|
136
|
+
},
|
|
137
|
+
"Solflare": {
|
|
138
|
+
icon: "solflare",
|
|
139
|
+
name: "Solflare",
|
|
140
|
+
isExternalWallet: true
|
|
141
|
+
},
|
|
142
|
+
"Valora": {
|
|
143
|
+
icon: "valora",
|
|
144
|
+
name: "Valora",
|
|
145
|
+
isExternalWallet: true
|
|
146
|
+
}
|
|
147
|
+
};
|
|
148
|
+
function getAccountTypeName(type, { inline = false } = {}) {
|
|
149
|
+
var _a;
|
|
150
|
+
const data = type ? ACCOUNT_TYPES[type] : void 0;
|
|
151
|
+
return data ? inline ? (_a = data.inlineText) != null ? _a : `${data.name} ${data.isExternalWallet ? "wallet" : "account"}` : data.name : void 0;
|
|
152
|
+
}
|
|
153
|
+
function getAccountTypeLogo(type) {
|
|
154
|
+
return type ? ACCOUNT_TYPES[type].iconBranded || ACCOUNT_TYPES[type].icon : void 0;
|
|
155
|
+
}
|
|
156
|
+
export {
|
|
157
|
+
ACCOUNT_TYPES,
|
|
158
|
+
getAccountTypeLogo,
|
|
159
|
+
getAccountTypeName
|
|
160
|
+
};
|
package/dist/hooks/index.d.ts
CHANGED
package/dist/hooks/index.js
CHANGED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MutableRefObject } from 'react';
|
|
2
|
+
export declare const useDropdownPosition: (inputRef: MutableRefObject<HTMLCpslInputElement | HTMLDivElement | null>) => {
|
|
3
|
+
dropdownMaxHeight: number;
|
|
4
|
+
dropdownWidth: number;
|
|
5
|
+
mobileAnchor: number;
|
|
6
|
+
resize: () => void;
|
|
7
|
+
};
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import "../chunk-MMUBH76A.js";
|
|
3
|
+
import { useEffect, useState } from "react";
|
|
4
|
+
const useDropdownPosition = (inputRef) => {
|
|
5
|
+
const [dropdownMaxHeight, setDropdownMaxHeight] = useState();
|
|
6
|
+
const [dropdownWidth, setDropdownWidth] = useState();
|
|
7
|
+
const [mobileAnchor, setMobileAnchor] = useState();
|
|
8
|
+
const resize = () => {
|
|
9
|
+
var _a, _b, _c, _d;
|
|
10
|
+
if (typeof window !== "undefined") {
|
|
11
|
+
const newMaxHeight = Math.max(
|
|
12
|
+
window.innerHeight - ((_b = (_a = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a.getBoundingClientRect().bottom) != null ? _b : 0) - 20,
|
|
13
|
+
window.innerHeight * 0.25
|
|
14
|
+
);
|
|
15
|
+
setDropdownMaxHeight(newMaxHeight);
|
|
16
|
+
setDropdownWidth((_c = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _c.getBoundingClientRect().width);
|
|
17
|
+
setMobileAnchor((_d = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _d.getBoundingClientRect().height);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
if (inputRef.current && !dropdownMaxHeight) {
|
|
21
|
+
resize();
|
|
22
|
+
}
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
typeof window !== "undefined" && window.addEventListener("resize", resize);
|
|
25
|
+
return () => {
|
|
26
|
+
typeof window !== "undefined" && window.removeEventListener("resize", resize);
|
|
27
|
+
};
|
|
28
|
+
}, []);
|
|
29
|
+
return { dropdownMaxHeight, dropdownWidth, mobileAnchor, resize };
|
|
30
|
+
};
|
|
31
|
+
export {
|
|
32
|
+
useDropdownPosition
|
|
33
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import "../chunk-MMUBH76A.js";
|
|
3
|
+
import { UAParser } from "ua-parser-js";
|
|
4
|
+
function useUserAgent() {
|
|
5
|
+
const userAgent = typeof window !== "undefined" ? window.navigator.userAgent : void 0;
|
|
6
|
+
return UAParser(userAgent);
|
|
7
|
+
}
|
|
8
|
+
export {
|
|
9
|
+
useUserAgent
|
|
10
|
+
};
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { IconType } from '@getpara/react-components';
|
|
2
|
+
export type Tab<T> = {
|
|
3
|
+
label: string;
|
|
4
|
+
value: T;
|
|
5
|
+
icon: IconType;
|
|
6
|
+
};
|
|
7
|
+
export type DisplayMetadata = {
|
|
8
|
+
name: string;
|
|
9
|
+
inlineText?: string;
|
|
10
|
+
icon: IconType;
|
|
11
|
+
iconBranded?: IconType;
|
|
12
|
+
isDark?: boolean;
|
|
13
|
+
isCircular?: boolean;
|
|
14
|
+
isPlain?: boolean;
|
|
15
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";
|