{
"version": 3,
"sources": ["../../src/common/icon/circle_close.svg", "../../src/api/model/authError.ts", "../../src/api/model/bundle.ts", "../../src/utils/index.ts", "../../src/context/types.ts", "../../src/context/hooks/useLogin.ts", "../../src/context/index.tsx", "../../src/components/customRouter/index.tsx", "../../src/components/loading/index.tsx", "../../src/components/focusTrap/index.tsx", "../../src/context/hooks/useFocusTrap.ts", "../../src/components/particle-modal/index.tsx", "../../src/components/particle-drawer/index.tsx", "../../src/utils/isTelegramWebApp.ts", "../../src/components/icon/circle-close.tsx", "../../src/components/particle-modal/authCoreModalContainer.tsx", "../../src/locales/index.ts", "../../src/utils/authorizeUtils.ts", "../../src/api/getPublicAddress.ts", "../../src/utils/chain-utils.ts", "../../src/utils/common-utils.ts", "../../src/utils/sendAnalyticsActive.ts", "../../src/utils/version.ts", "../../src/context/providerInject.tsx", "../../src/utils/isSocialLogin.ts", "../../src/context/hooks/useAuthCore.ts", "../../src/common/config/index.ts", "../../src/context/hooks/useMessage.ts", "../../src/context/hooks/useConnect.ts", "../../src/context/hooks/useCustomize.ts", "../../src/context/hooks/useEthereum.ts", "../../src/utils/evmSendTransaction.ts", "../../src/utils/number-utils.ts", "../../src/utils/transaction-utils.ts", "../../src/context/evmProvider.ts", "../../src/context/hooks/useUserInfo.ts", "../../src/context/hooks/useIsMounted.ts", "../../src/context/hooks/useSolana.ts", "../../src/context/solanaWallet.ts", "../../src/context/web3ModalProvider.tsx", "../../src/repository/index.ts", "../../src/api/master-password.ts"],
"sourcesContent": ["import * as React from \"react\";\nfunction MyComponent(props) {\n return ;\n}\nexport default MyComponent;", "export class AuthError {\n constructor(public code: number, public message: string) {\n this.code = code;\n this.message = message;\n }\n\n public static feeError() {\n return new AuthError(8101, 'maxFeePerGas cannot be less than maxPriorityFeePerGas');\n }\n\n public static userRejectedRequest() {\n return new AuthError(4001, 'The user rejected the request');\n }\n\n public static userCancelOperation() {\n return new AuthError(4011, 'The user canceled operation.');\n }\n\n public static unauthorized() {\n return new AuthError(4100, 'The requested method and/or account has not been authorized by the user');\n }\n\n public static systemError() {\n return new AuthError(8001, 'System Error');\n }\n\n public static paramsError() {\n return new AuthError(8002, 'Param error, see doc for more info');\n }\n\n public static notLogin() {\n return new AuthError(8005, 'Please connect first!');\n }\n\n public static walletNotCreated() {\n return new AuthError(8006, 'Wallet not created');\n }\n\n public static authorizeError() {\n return new AuthError(8007, 'Authorize error');\n }\n\n public static network() {\n return new AuthError(8011, 'Network error');\n }\n\n public static unknown(message: string) {\n return new AuthError(9000, message);\n }\n\n public static pending(method: string) {\n return new AuthError(-32002, `Request of type ${method} already pending, please wait.`);\n }\n}\n", "export interface AuthorizationOptions {\n message?: string;\n uniq?: boolean;\n}\n\nexport enum PromptSettingType {\n /**\n * \u4E0D\u63D0\u9192\n */\n none = 0,\n /**\n * \u9996\u6B21\u63D0\u9192\n */\n first = 1,\n /**\n * \u6BCF\u6B21\u90FD\u63D0\u9192\n */\n every = 2,\n /**\n * \u6BCF\u6B21\u90FD\u63D0\u9192\uFF0C\u4E14\u4E0D\u53EF\u8DF3\u8FC7\n */\n everyAndNotSkip = 3,\n}\n\nexport interface PromptSettingConfig {\n promptPaymentPasswordSettingWhenSign?: PromptSettingType | boolean; // 0: \u4E0D\u63D0\u9192\uFF0C 1: \u9996\u6B21\u63D0\u9192\uFF0C 2: \u6BCF\u6B21\u90FD\u63D0\u9192, 3: \u6BCF\u6B21\u90FD\u63D0\u9192\uFF0C\u4E14\u4E0D\u53EF\u8DF3\u8FC7\n promptMasterPasswordSettingWhenLogin?: PromptSettingType | boolean; // 0: \u4E0D\u63D0\u9192\uFF0C 1: \u9996\u6B21\u63D0\u9192\uFF0C 2: \u6BCF\u6B21\u90FD\u63D0\u9192\uFF0C 3: \u6BCF\u6B21\u90FD\u63D0\u9192\uFF0C\u4E14\u4E0D\u53EF\u8DF3\u8FC7\n}\n", "import type { CountryCode } from 'libphonenumber-js/max';\nimport { isValidPhoneNumber, parsePhoneNumberWithError } from 'libphonenumber-js/max';\nimport darkApple from '../common/images/apple_dark_icon.png';\nimport apple from '../common/images/apple_icon.png';\nimport discord from '../common/images/discord_icon.png';\nimport email from '../common/images/email_icon.png';\nimport facebook from '../common/images/facebook_icon.png';\nimport darkGithub from '../common/images/github_dark_icon.png';\nimport github from '../common/images/github_icon.png';\nimport google from '../common/images/google_icon.png';\nimport jwt from '../common/images/jwt_icon.png';\nimport linkedin from '../common/images/linkedin_icon.png';\nimport microsoft from '../common/images/microsoft_icon.png';\nimport passkeys from '../common/images/passkeys_icon.png';\nimport phone from '../common/images/phone_icon.png';\nimport twitch from '../common/images/twitch_icon.png';\nimport darkTwitter from '../common/images/twitter_dark_icon.png';\nimport twitter from '../common/images/twitter_icon.png';\nimport type { Theme } from '../types';\n\nexport const ipfsToSrc = (ipfs: string) => {\n if (!ipfs || !ipfs.startsWith('ipfs://')) {\n return ipfs || '';\n }\n\n return `https://ipfs.io/ipfs/${encodeURI(ipfs.slice(7))}`;\n};\n\nexport const EmailRegExp = /^\\w+([-+.]\\w+)*@[a-zA-Z0-9]+([.-][a-zA-Z0-9]+)*\\.[a-zA-Z0-9]+([.-][a-zA-Z0-9]+)*$/;\n\nexport const PhoneRegExp = /^[0-9]{4,16}$/;\n\nexport const PhoneE164Exp = /^\\+[1-9]\\d{4,14}$/;\n\nexport function isValidEmail(email?: string) {\n if (email && EmailRegExp.test(email)) {\n return email;\n }\n}\n\nexport function isPhoneValid(phone: string, regionCode: string): boolean {\n if (!phone || phone.length < 5) {\n return false;\n }\n const countryCode = regionCode?.toUpperCase() as CountryCode;\n const result = isValidPhoneNumber(phone, countryCode);\n return result;\n}\n\nexport const isValidE164PhoneNumber = (phone: string | undefined) => {\n if (phone && PhoneE164Exp.test(phone)) {\n try {\n if (isValidPhoneNumber(phone)) {\n const e164Phone = parsePhoneNumberWithError(phone).format('E.164');\n return e164Phone;\n }\n } catch (e) {\n // ignore\n }\n }\n};\n\nexport function isValidCaptcha(code?: string) {\n return code && code.match(/^\\d{6}$/);\n}\n\nexport const isAutoFocusSupported = () => {\n return true;\n};\n\nexport const isMobile = () => {\n if (isServer()) return false;\n return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);\n};\n\nexport const isServer = () => typeof window === 'undefined';\n\nexport const isClient = () => typeof window !== 'undefined';\n\nexport const getLoginLogos = (theme?: Theme): Record => {\n const twitterIcon = theme === 'dark' ? darkTwitter : twitter;\n const githubIcon = theme === 'dark' ? darkGithub : github;\n const appleIcon = theme === 'dark' ? darkApple : apple;\n return {\n email,\n phone,\n google,\n facebook,\n twitter: twitterIcon,\n linkedin,\n github: githubIcon,\n microsoft,\n apple: appleIcon,\n discord,\n twitch,\n jwt,\n passkeys,\n };\n};\n", "import type { AuthType, ERC4337Options, ServerError, UserInfo } from '@particle-network/auth-core';\nimport type { WalletCustomStyle, WalletOption } from '@particle-network/wallet';\nimport type { Chain as ViemChain } from 'viem/chains';\nimport type { PromptSettingConfig } from '../api/model/bundle';\nimport type { CurrencyUnit, Theme } from '../types';\n\nexport type ViewType = 'desktop' | 'mobile';\n\nexport interface NavigateOptions {\n replace?: boolean;\n back?: boolean;\n state?: any;\n}\n\nexport interface IAuthCoreModal {\n rootModalContainer: HTMLDivElement | null;\n rootBody: HTMLDivElement | null;\n particleModalVisible: boolean;\n viewType: ViewType;\n closable?: boolean;\n}\n\nexport interface ICustomRouter {\n path: string;\n replace?: boolean;\n state?: any;\n history?: any[];\n children?: React.ReactNode;\n}\n\nexport enum AuthCoreModalEvent {\n Login = 'login', // \u767B\u5F55\n LoginSuccess = 'loginSuccess', // \u767B\u5F55\u6210\u529F\n LoginFail = 'loginFail', // \u767B\u5F55\u5931\u8D25\n SignResponse = 'signResponse', // \u7B7E\u540D\u54CD\u5E94\n}\n\nexport type Language = 'en' | 'zh-cn' | 'ja' | 'ko' | 'zh-tw';\n\nexport interface ThemeStyle {\n primaryBtnColor?: string;\n primaryBtnBackgroundColor?: string;\n secondaryBtnColor?: string;\n secondaryBtnBackgroundColor?: string;\n textColor?: string;\n secondaryTextColor?: string;\n themeBackgroundColor?: string;\n iconBorderColor?: string;\n accentColor?: string;\n inputBackgroundColor?: string;\n inputBorderColor?: string;\n inputPlaceholderColor?: string;\n cardBorderColor?: string;\n cardUnclickableBackgroundColor?: string;\n cardUnclickableBorderColor?: string;\n cardDividerColor?: string;\n tagBackgroundColor?: string;\n modalBackgroundColor?: string;\n tipsBackgroundColor?: string;\n}\n\nexport interface CustomStyle {\n logo?: string;\n projectName?: string;\n subtitle?: string;\n modalWidth?: number;\n modalHeight?: number;\n zIndex?: number;\n primaryBtnBorderRadius?: number | string;\n modalBorderRadius?: number | string;\n cardBorderRadius?: number | string;\n fontFamily?: string;\n theme?: {\n dark?: ThemeStyle;\n light?: ThemeStyle;\n };\n}\n\nexport interface AuthCoreModalOptions {\n projectId: string;\n clientKey: string;\n appId: string;\n authTypes?: AuthType[];\n themeType?: Theme;\n fiatCoin?: CurrencyUnit;\n erc4337?: ERC4337Options;\n language?: Language;\n promptSettingConfig?: PromptSettingConfig;\n customStyle?: CustomStyle;\n chains: readonly [ViemChain, ...ViemChain[]];\n wallet?:\n | (Omit & {\n customStyle?: Omit;\n })\n | false;\n supportEIP6963?: boolean; // defalut true\n web3Modal?: any; // optional: add to support @web3modal/ethers\n}\n\nexport type ConnectionStatus = 'loading' | 'connecting' | 'connected' | 'disconnected';\n\nexport type SocialConnectCallback = {\n onSuccess?: (info: UserInfo) => void;\n onError?: (error: ServerError | Error) => void;\n};\n\nexport interface OpenBuyOptions {\n network?: string;\n fiatCoin?: string;\n cryptoCoin?: string;\n fiatAmt?: number;\n fixFiatCoin?: boolean;\n fixCryptoCoin?: boolean;\n fixFiatAmt?: boolean;\n walletAddress?: string;\n}\n\nexport type OpenBuyOptionsKeys = keyof OpenBuyOptions;\n", "import { RecordType } from '@particle-network/analytics';\nimport type {\n Authorization,\n Chain,\n ConnectParam,\n ConnectWithSocialParam,\n SocialAuthType,\n} from '@particle-network/auth-core';\nimport { analyticsRecord, connect, thirdpartyAuth } from '@particle-network/auth-core';\nimport base64url from 'base64url';\nimport { useCallback } from 'react';\nimport { useCustomNavigate, useParticleAuth } from '..';\nimport { isPromptSetMasterPassword } from '../../api/master-password';\nimport { AuthPage } from '../../components/customRouter';\nimport { sendAnalyticsActive } from '../../utils/sendAnalyticsActive';\nimport { AuthCoreModalEvent } from '../types';\n\nconst useLogin = () => {\n const navigate = useCustomNavigate();\n const { loginSuccessRedirectToApp, modalOptions, events } = useParticleAuth();\n const loginHandler = useCallback(\n async (data: ConnectParam, emitError: boolean = true) => {\n try {\n if (!data.chain) {\n data.chain = modalOptions.chains[0];\n }\n const userInfo = await connect(data);\n const { token = '', ...restInfo } = userInfo;\n sendAnalyticsActive('login', restInfo);\n\n analyticsRecord({\n // eslint-disable-next-line camelcase\n record_type: RecordType.PAGE_LOGIN_BUTTON_CLICK_SUCCESS, // \u767B\u5F55\u6210\u529F\n });\n console.log('login successful, check master password');\n\n if (userInfo.security_account?.has_set_master_password) {\n console.log('login successful, start verify master password');\n navigate(AuthPage.MasterPasswordVerify, {\n replace: true,\n state: {\n loginVerifyMasterPassword: true,\n },\n });\n } else {\n if (isPromptSetMasterPassword(modalOptions.promptSettingConfig?.promptMasterPasswordSettingWhenLogin)) {\n console.log('login successful, popup set master password');\n navigate(AuthPage.MasterPasswordPrompt, {\n replace: true,\n });\n } else {\n loginSuccessRedirectToApp();\n }\n }\n } catch (error) {\n analyticsRecord({\n // eslint-disable-next-line camelcase\n record_type: RecordType.PAGE_LOGIN_BUTTON_CLICK_FAILURE, // \u767B\u5F55\u5931\u8D25\n });\n if (emitError) {\n console.log('login failed, emit LoginFail event', error);\n events.emit(AuthCoreModalEvent.LoginFail, error);\n } else {\n throw error;\n }\n }\n },\n [modalOptions.promptSettingConfig, navigate, loginSuccessRedirectToApp, modalOptions?.wallet]\n );\n\n const socialAuthLogin = useCallback(\n async (\n options: ConnectWithSocialParam & {\n authorization?: Authorization;\n chain?: Chain;\n }\n ) => {\n try {\n const appState = base64url(\n JSON.stringify({\n chain: options.chain,\n authorization: options.authorization,\n socialType: options.socialType,\n })\n );\n await thirdpartyAuth({\n authType: options.socialType as SocialAuthType,\n appState,\n prompt: options.prompt,\n });\n } catch (error) {\n events.emit(AuthCoreModalEvent.LoginFail, error);\n }\n },\n [events]\n );\n\n return { loginHandler, socialAuthLogin };\n};\n\nexport default useLogin;\n", "import type { LoginAuthorization, SolanaAuthorization, UserInfo } from '@particle-network/auth-core';\nimport {\n AuthCoreEvent,\n EvmRpcMethod,\n SolanaRpcMethod,\n connect,\n getConnectCaptcha,\n getUserInfo,\n hasPaymentPassword,\n isConnected,\n particleAuth,\n syncUserInfo,\n} from '@particle-network/auth-core';\nimport type { WalletEntryPlugin } from '@particle-network/wallet';\nimport { useAsyncEffect, useSetState, useSize } from 'ahooks';\nimport base58 from 'bs58';\nimport { EventEmitter } from 'events';\nimport get from 'lodash/get';\nimport React, { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport root from 'react-shadow';\nimport { AuthError } from '../api/model/authError';\nimport CustomRouter, { AuthPage } from '../components/customRouter';\nimport FocusTrap from '../components/focusTrap';\nimport ParticleModal from '../components/particle-modal';\nimport AuthCoreModalContainer from '../components/particle-modal/authCoreModalContainer';\nimport { dictionaries } from '../locales';\nimport type { AccountTipModalProps } from '../pages/account/accountTipModal';\nimport type { PaymentVerify } from '../pages/account/paymentVerifyModal';\nimport type { WrongPasswordInfo } from '../pages/account/wrongPasswordModal';\nimport { isServer } from '../utils';\nimport authorizeUtils from '../utils/authorizeUtils';\nimport { isSolana } from '../utils/chain-utils';\nimport { toHexPrefixString } from '../utils/common-utils';\nimport { sendAnalyticsActive } from '../utils/sendAnalyticsActive';\nimport { getVersion } from '../utils/version';\nimport ProviderInject from './providerInject';\nimport type {\n AuthCoreModalOptions,\n ConnectionStatus,\n IAuthCoreModal,\n ICustomRouter,\n Language,\n NavigateOptions,\n SocialConnectCallback,\n ViewType,\n} from './types';\nimport { AuthCoreModalEvent } from './types';\nimport Web3ModalProvider from './web3ModalProvider';\n\nconst IframeWalletPlugin = React.lazy(() => import('./iframeWalletPlugin'));\nconst AccountTipModal = React.lazy(() => import('../pages/account/accountTipModal'));\nconst PaymentVerifyModal = React.lazy(() => import('../pages/account/paymentVerifyModal'));\nconst WrongPasswordModal = React.lazy(() => import('../pages/account/wrongPasswordModal'));\nconst SelectSecurityAccount = React.lazy(() => import('../pages/account/selectSecurityAccount'));\n\nexport const defaultModalOptions: Partial = {\n themeType: 'light',\n language: 'en',\n fiatCoin: 'USD',\n promptSettingConfig: {\n promptPaymentPasswordSettingWhenSign: 1,\n promptMasterPasswordSettingWhenLogin: 0,\n },\n customStyle: {\n modalWidth: 400,\n modalHeight: 650,\n },\n wallet: { visible: true, themeType: 'light' },\n};\n\ninterface GlobalState {\n connectionStatus: ConnectionStatus;\n setConnectionStatus: (status: ConnectionStatus) => void;\n userInfo?: UserInfo;\n modalOptions: AuthCoreModalOptions;\n setModalOptions: (options: any) => void;\n showSelectSecurityAccount: (display: boolean, state?: any) => void;\n setWrongPassword: (info: WrongPasswordInfo) => void;\n setPaymentVerify: (props: PaymentVerify) => void;\n showAccountTipModal: (props: AccountTipModalProps) => void;\n setPaymentPassword: () => void;\n loginSuccessRedirectToApp: () => void;\n events: EventEmitter;\n authCoreModal: IAuthCoreModal;\n setAuthCoreModal: (params: any) => void;\n customRouter: ICustomRouter;\n setCustomRouter: (params: any) => void;\n customNavigate: (url: string | number, options?: NavigateOptions) => void;\n setLoginAuthorization: (loginAuthorization?: LoginAuthorization) => void;\n authCoreModalClose: () => void;\n socialConnectCallback?: SocialConnectCallback;\n setSocialConnectCallback: (callback?: SocialConnectCallback) => void;\n walletEntryPlugin?: WalletEntryPlugin;\n lang: string;\n setLang: (value: Language) => void;\n}\n\nexport const GlobalContext = createContext(null);\n\nconst events = new EventEmitter();\nevents.setMaxListeners(100);\n\nexport const AuthCoreContextProvider = (props: { options: AuthCoreModalOptions; children: React.ReactNode }) => {\n const [userInfo, _setUserInfo] = useState();\n const userInfoRef = useRef(userInfo);\n\n const setUserInfo = (info: UserInfo | undefined) => {\n _setUserInfo(info);\n userInfoRef.current = info;\n };\n\n const [lang, setLang] = useState('en');\n const rootRef = React.useRef(null);\n\n const [styles, setStyles] = useState({\n styleList: [\n {\n name: 'antStyle',\n loadStyle: () => import('../../../../node_modules/antd/dist/antd.css'),\n styleContent: '',\n },\n {\n name: 'globalStyle',\n loadStyle: () => import('../common/style/global.scss'),\n styleContent: '',\n },\n {\n name: 'scrollStyle',\n loadStyle: () => import('../common/style/scroll.scss'),\n styleContent: '',\n },\n {\n name: 'themeStyle',\n loadStyle: () => import('../common/style/theme.scss'),\n styleContent: '',\n },\n ],\n });\n\n const [modalOptions, setModalOptions] = useSetState(props.options);\n\n const [selectSecurityAccount, setSelectSecurityAccount] = useState(false);\n\n const [verifySecurityAccountState, setVerifySecurityAccountState] = useState();\n\n const [wrongPassword, setWrongPassword] = useState({ visible: false });\n\n const [accountTipModal, setAccountTipModal] = useState({\n visible: false,\n });\n\n const initParticleAuthRef = React.useRef(false);\n\n const [paymentVerify, setPaymentVerify] = useState({ visible: false });\n\n const [loginAuthorization, _setLoginAuthorization] = useState();\n\n const loginAuthorizationRef = useRef(null);\n\n const setLoginAuthorization = (data?: LoginAuthorization) => {\n _setLoginAuthorization(data);\n loginAuthorizationRef.current = data;\n };\n\n const [connectionStatus, setConnectionStatus] = useState('loading');\n\n const showSelectSecurityAccount = (display: boolean, state?: any) => {\n setVerifySecurityAccountState(state);\n setSelectSecurityAccount(display);\n };\n\n const showAccountTipModal = (props: AccountTipModalProps) => {\n setAccountTipModal(props);\n };\n\n const loadStyles = () => {\n const fns = styles.styleList.map((item: any) => {\n return item?.loadStyle?.();\n });\n Promise.all(fns).then((styles: any) => {\n const styleList = styles.map((item: any) => {\n return {\n styleContent: item.default,\n };\n });\n setStyles({\n styleList,\n });\n });\n };\n\n const [customRouter, setCustomRouter] = useSetState({ path: '/' });\n const [authCoreModal, setAuthCoreModal] = useSetState({\n viewType: 'mobile' as ViewType,\n particleModalVisible: false,\n rootModalContainer: null,\n rootBody: null,\n closable: true,\n });\n\n const customNavigate = useCallback(\n (url: string | number, options?: NavigateOptions) => {\n if (typeof url === 'string' && url !== '/') {\n url = url.replace(/^\\//, '');\n }\n\n console.log('customNavigate', url, options);\n\n let { history } = customRouter;\n\n if (!history) {\n history = [];\n }\n\n if (options?.back === true) {\n if (\n typeof url === 'string' &&\n !!history.find((item: any) => item.path.replace(/^\\//, '') === (url as string).replace(/^\\//, ''))\n ) {\n url = history.findIndex((item) => item.path === url) - history.length + 1;\n }\n }\n\n if (typeof url === 'string') {\n if (url !== AuthPage.Login && url !== AuthPage.Index && !isConnected()) {\n throw AuthError.notLogin();\n }\n\n const { replace = false, state = {} } = options || {};\n\n if (history.length && replace) {\n history.pop();\n }\n\n history.push({\n path: url,\n state,\n updateAt: new Date().getTime(),\n });\n\n setCustomRouter({\n path: url,\n replace,\n state,\n history,\n });\n } else if (typeof url === 'number' && history.length > 0) {\n for (let i = 0; i < Math.abs(url); i++) {\n history.pop();\n }\n\n if (history.length === 0) {\n setAuthCoreModal({\n particleModalVisible: false,\n });\n return;\n }\n\n const route = history[history.length - 1];\n setCustomRouter({\n path: route?.path,\n replace: false,\n state: route?.state,\n history,\n });\n }\n },\n [customRouter, setAuthCoreModal, setCustomRouter]\n );\n\n const setPaymentPassword = useCallback(() => {\n if (userInfo?.security_account?.has_set_payment_password) {\n return;\n }\n if (!userInfo?.security_account?.email && !userInfo?.security_account?.phone) {\n customNavigate('/account/bind', {\n state: {\n accountType: userInfo?.email ? 'phone' : 'email',\n showSwitch: true,\n redirectUrl: '/account/set-password',\n },\n });\n return;\n }\n if (userInfo?.security_account?.email && userInfo?.security_account?.phone) {\n showSelectSecurityAccount(true);\n } else {\n customNavigate('/account/set-password', {\n state: {\n account: userInfo?.security_account?.email || userInfo?.security_account?.phone,\n },\n });\n }\n }, [userInfo, customNavigate]);\n\n const loginSuccessRedirectToApp = useCallback(() => {\n console.log('login success', 'redirectToApp');\n\n const userInfo = userInfoRef.current;\n const loginAuthorization = loginAuthorizationRef.current;\n\n let authorizeResult;\n if (loginAuthorization && authorizeUtils.isNeedAuthorize(loginAuthorization)) {\n if (hasPaymentPassword()) {\n if (isSolana(loginAuthorization.chain)) {\n const message = (loginAuthorization.authorization as SolanaAuthorization).message;\n customNavigate(AuthPage.SolanaSign, {\n state: {\n method: SolanaRpcMethod.signMessage,\n param: base58.decode(message),\n loginAuthorizationSign: true,\n },\n });\n } else {\n authorizeUtils\n .generateMessage(loginAuthorization.chain, modalOptions.erc4337)\n .then((message) => {\n customNavigate(AuthPage.EvmSign, {\n state: {\n method: loginAuthorization.authorization.uniq\n ? EvmRpcMethod.personalSignUniq\n : EvmRpcMethod.personalSign,\n param: toHexPrefixString(message),\n loginAuthorizationSign: true,\n },\n });\n })\n .catch((error) => {\n events.emit(AuthCoreModalEvent.LoginFail, error);\n });\n }\n return;\n } else {\n authorizeUtils\n .authorize(loginAuthorization, modalOptions.erc4337)\n .then((result) => {\n events.emit(AuthCoreModalEvent.LoginSuccess, {\n ...userInfo,\n authorization: result,\n });\n })\n .catch((error) => {\n events.emit(AuthCoreModalEvent.LoginFail, error);\n });\n }\n } else {\n events.emit(AuthCoreModalEvent.LoginSuccess, {\n ...(userInfo ?? getUserInfo()),\n authorization: authorizeResult,\n });\n }\n }, [customNavigate, userInfo, modalOptions.erc4337, loginAuthorization]);\n\n const authCoreModalClose = () => {\n if (events.listenerCount(AuthCoreModalEvent.SignResponse) > 0) {\n events.emit(AuthCoreModalEvent.SignResponse, {\n error: AuthError.userRejectedRequest(),\n });\n }\n\n if (events.listenerCount(AuthCoreModalEvent.LoginSuccess)) {\n if (customRouter?.path === AuthPage.Login || !userInfo) {\n events.emit(AuthCoreModalEvent.LoginFail, AuthError.userCancelOperation());\n } else {\n events.emit(AuthCoreModalEvent.LoginSuccess, userInfo);\n }\n }\n\n setAuthCoreModal({\n particleModalVisible: false,\n });\n };\n\n const getPageHTML = () => {\n let htmlContent = rootRef.current?.outerHTML || '';\n const path = rootRef.current?.getAttribute('data-path');\n htmlContent = Buffer.from(htmlContent).toString('base64');\n console.log('getPageHTML', path, htmlContent.substring(0, 30) + '...');\n return htmlContent;\n };\n\n const fontStyle = useMemo(() => {\n let style = '';\n if (!isServer()) {\n const bodyFontFamily = window.getComputedStyle(window.document.body).fontFamily;\n const fontFamily =\n props.options?.customStyle?.fontFamily ||\n bodyFontFamily ||\n '\"PingFang SC\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", sans-serif';\n\n style = ` \n .particle-auth-core-shadow-root {\n --auth-core-font-family: ${fontFamily};\n }\n `;\n }\n\n return style;\n }, [props.options?.customStyle?.fontFamily]);\n\n // \u81EA\u5B9A\u4E49 \u4E3B\u9898\n const customThemeStyle = useMemo(() => {\n const themeType = modalOptions.themeType;\n const customStyle = modalOptions.customStyle || {};\n\n const theme = {\n ...Object.fromEntries(\n Object.keys(customStyle || {})\n .filter((key) => key !== 'theme')\n .map((key) => {\n return [key, (customStyle as any)?.[key] || ''];\n })\n ),\n\n ...(customStyle?.theme?.[themeType === 'light' ? 'light' : 'dark'] || {}),\n };\n\n const styleContent = Object.keys(theme)\n .filter((key) => key !== 'fontFamily')\n .map((key) => {\n const name = key.replace(/([A-Z])/g, '-$1').toLowerCase();\n let value = theme[key as keyof typeof theme];\n if (!isNaN(Number(value))) {\n value = value + 'px';\n }\n return `--${name}:${value};`;\n })\n .join('\\n');\n\n if (themeType === 'dark') {\n return `.particle-auth-core-shadow-root.dark{\n ${styleContent}\n }`;\n }\n\n return `.particle-auth-core-shadow-root{\n ${styleContent}\n }`;\n }, [modalOptions.themeType, modalOptions.customStyle]);\n\n useEffect(() => {\n setModalOptions({\n ...defaultModalOptions,\n ...props.options,\n promptSettingConfig: {\n ...defaultModalOptions.promptSettingConfig,\n ...props.options.promptSettingConfig,\n },\n customStyle: {\n ...defaultModalOptions.customStyle,\n ...props.options.customStyle,\n },\n });\n }, [props.options, setModalOptions]);\n\n useEffect(() => {\n // \u5F39\u51FA\u7A97\u53E3\u540E \u9501\u5B9Abody \u6EDA\u52A8\n if (!document.querySelector('.particle-auth-core-body-style')) {\n const style = document.createElement('style');\n style.classList.add('particle-auth-core-body-style');\n const styleContent = `.particle-modal-lock {\n overflow: hidden !important;\n }`;\n style.innerHTML = styleContent;\n document.head.appendChild(style);\n }\n\n if (authCoreModal.particleModalVisible) {\n document.body.classList.add('particle-modal-lock');\n const rootBody = authCoreModal.rootModalContainer?.querySelector(\n '.root-particle-modal-container .ant-drawer-body,.root-particle-modal-container .ant-modal-body'\n ) as HTMLDivElement;\n setAuthCoreModal({\n rootBody,\n });\n } else {\n // \u5173\u95EDrootModal\u5F39\u7A97\u540E\uFF0C\u5EF6\u65F6\u6E05\u7A7A\u8DEF\u7531\n setTimeout(() => {\n setCustomRouter({\n path: '/',\n history: [],\n });\n }, 100);\n document.body.classList.remove('particle-modal-lock');\n }\n }, [authCoreModal.particleModalVisible, authCoreModal.rootModalContainer]);\n\n const bodySze = useSize(isServer() ? null : document.body);\n\n useEffect(() => {\n // \u8BBE\u7F6EviewType \u4E3A\u5168\u5C40\u53D8\u91CF desktop | mobile\n let viewType: ViewType = 'mobile';\n if (document.body.clientWidth >= 600) {\n viewType = 'desktop';\n }\n setAuthCoreModal({\n viewType,\n });\n }, [bodySze]);\n\n useEffect(() => {\n if (customRouter?.path && customRouter?.path != '/') {\n // \u8DEF\u7531 path \u4E0D\u4E3A / \u65F6\uFF0C\u6253\u5F00rootModal\u5F39\u7A97\n setAuthCoreModal({\n particleModalVisible: true,\n });\n }\n }, [customRouter?.path]);\n\n useEffect(() => {\n // \u8BBE\u7F6E\u6A21\u6001\u6846\u7684\u5BBD\u5EA6\u548C\u9AD8\u5EA6\uFF0C\u54CD\u5E94\u79FB\u52A8\u7AEF\u89C6\u56FE\n if (rootRef.current) {\n const minWidth = 300;\n const minHeight = 500;\n let modalWidth = Math.max(minWidth, Number(modalOptions.customStyle?.modalWidth));\n let modalHeight = Math.max(minHeight, Number(modalOptions.customStyle?.modalHeight));\n\n if (authCoreModal.viewType == 'mobile') {\n modalWidth = document.body.clientWidth;\n modalHeight = document.body.clientHeight * 0.86;\n }\n const vm = modalWidth / 100;\n rootRef.current.style.setProperty('--vw', vm + 'px');\n rootRef.current.style.setProperty('--doc-height', modalHeight + 'px');\n rootRef.current.style.setProperty('--doc-width', modalWidth + 'px');\n }\n }, [\n rootRef.current,\n authCoreModal.viewType,\n modalOptions.customStyle?.modalWidth,\n modalOptions.customStyle?.modalHeight,\n ]);\n\n useEffect(() => {\n setTimeout(() => {\n setLang(modalOptions.language || 'en');\n });\n }, [modalOptions.language]);\n\n useEffect(() => {\n const onMasterPasswordChange = () => {\n customNavigate(AuthPage.MasterPasswordVerify);\n };\n window?.particleAuth?.on(AuthCoreEvent.MasterPasswordChanged, onMasterPasswordChange);\n return () => {\n window?.particleAuth?.off(AuthCoreEvent.MasterPasswordChanged, onMasterPasswordChange);\n };\n }, [customRouter.history, customNavigate]);\n\n useEffect(() => {\n const userInfoChanged = (userInfo: UserInfo) => {\n setUserInfo(userInfo);\n };\n const onDisconnect = (error?: Error) => {\n setUserInfo(undefined);\n if (events.listenerCount(AuthCoreModalEvent.SignResponse) > 0) {\n // \u5982\u679C\u6709\u76D1\u542CsignResponse\u4E8B\u4EF6\uFF0C\u8BF4\u660E\u662F\u5728\u7B7E\u540D\u4E2D\u65AD\uFF0C\u9700\u8981\u89E6\u53D1signResponse\u4E8B\u4EF6\n events.emit(AuthCoreModalEvent.SignResponse, {\n error: error || AuthError.notLogin(),\n });\n }\n setAuthCoreModal({\n particleModalVisible: false,\n });\n };\n\n window?.particleAuth?.on(AuthCoreEvent.UserInfoChanged, userInfoChanged);\n window?.particleAuth?.on(AuthCoreEvent.ParticleAuthDisconnect, onDisconnect);\n return () => {\n window?.particleAuth?.off(AuthCoreEvent.UserInfoChanged, userInfoChanged);\n window?.particleAuth?.off(AuthCoreEvent.ParticleAuthDisconnect, onDisconnect);\n };\n }, []);\n\n if (!initParticleAuthRef.current || particleAuth.chains != modalOptions.chains) {\n // authCore \u521D\u59CB\u5316\n particleAuth.init({\n projectId: modalOptions.projectId || props.options.projectId,\n clientKey: modalOptions.clientKey || props.options.clientKey,\n appId: modalOptions.appId || props.options.appId,\n chains: modalOptions.chains,\n });\n const info = getUserInfo();\n setUserInfo(info);\n initParticleAuthRef.current = true;\n\n if (info) {\n const { token = '', ...restInfo } = info;\n sendAnalyticsActive('open', restInfo);\n }\n }\n\n useEffect(() => {\n if (isConnected()) {\n syncUserInfo().catch((e) => console.error('syncUserInfo', e));\n }\n loadStyles();\n\n if (!props?.options?.chains.length) {\n throw new Error('Auth Core: Please set chains in options');\n }\n }, []);\n\n if (!isServer()) {\n // @ts-ignore\n window.__getConnectCaptcha = getConnectCaptcha;\n // @ts-ignore\n window.__connect = connect;\n // @ts-ignore\n window.__getUserInfo = getUserInfo;\n // @ts-ignore\n window.__getPageHTML = getPageHTML;\n // @ts-ignore\n window.__navigate = customNavigate;\n // @ts-ignore\n window.__particleAuthCoreModal__ = rootRef?.current;\n }\n\n useEffect(() => {\n console.log('\uD83D\uDE80 ~ AuthCoreContextProvider ~ connectionStatus:', connectionStatus);\n }, [connectionStatus]);\n\n const [socialConnectCallback, setSocialConnectCallback] = useState();\n const [walletEntryPlugin, setWalletEntryPlugin] = useState();\n\n useAsyncEffect(async () => {\n if (modalOptions.wallet !== false) {\n const { walletEntryPlugin } = await import('@particle-network/wallet');\n setWalletEntryPlugin(walletEntryPlugin);\n }\n }, [modalOptions.wallet]);\n\n return (\n \n {props.children}\n\n {isServer() ? (\n \n ) : (\n \n {\n event.stopPropagation();\n }}\n >\n {/* */}\n \n \n {!!styles.styleList[0].styleContent &&\n styles.styleList.map((item: any, index: number) => {\n return (\n \n );\n })}\n \n\n {authCoreModal.rootModalContainer && (\n {\n authCoreModalClose();\n }}\n className='root-particle-modal-container'\n modalProps={{\n footer: null,\n width: parseInt(modalOptions.customStyle?.modalWidth as unknown as string),\n height: parseInt(modalOptions.customStyle?.modalHeight as unknown as string),\n forceRender: true,\n destroyOnClose: true,\n style: {\n maxWidth: modalOptions.customStyle?.modalWidth,\n },\n zIndex: modalOptions.customStyle?.zIndex || 99999,\n }}\n drawerProps={{\n height: '86%',\n closable: false,\n forceRender: true,\n destroyOnClose: true,\n push: false,\n zIndex: modalOptions.customStyle?.zIndex || 99999,\n }}\n >\n \n \n )}\n\n \n \n \n \n \n \n \n \n {props.options.web3Modal && }\n \n {/* */}\n \n \n )}\n \n );\n};\n\nexport const useParticleAuth = () => {\n const context = useContext(GlobalContext);\n if (!context) {\n throw new Error('Auth Core hooks must used in AuthCoreContextProvider');\n }\n return context;\n};\n\nexport const useAuthCoreModal = () => {\n const { authCoreModal, setAuthCoreModal, authCoreModalClose } = useParticleAuth();\n return {\n authCoreModalClose,\n authCoreModal,\n setAuthCoreModal,\n };\n};\n\nexport const useCustomRouter = () => {\n const { customRouter, setCustomRouter } = useParticleAuth();\n return {\n customRouter,\n setCustomRouter,\n };\n};\n\nexport const useCustomNavigate = () => {\n const { customNavigate } = useParticleAuth();\n\n return customNavigate;\n};\n\nexport const useSupportedChains = () => {\n const { modalOptions } = useParticleAuth();\n return modalOptions?.chains || [];\n};\n\nexport const useModalOptions = () => {\n const { modalOptions, setModalOptions } = useParticleAuth();\n return {\n modalOptions,\n setModalOptions,\n };\n};\n\nexport const useEvents = () => {\n const { events } = useParticleAuth();\n return { events };\n};\n\nexport const useTranslation = () => {\n const { lang } = useParticleAuth();\n const tempData = (dictionaries[lang.toLowerCase() as keyof typeof dictionaries] || dictionaries.en)();\n type ValueType = Awaited;\n const [data, setData] = useState({} as ValueType);\n\n useEffect(() => {\n async function getTranslations() {\n const targetTranslations = await tempData;\n\n setData(targetTranslations);\n }\n\n getTranslations();\n }, [lang]);\n\n const getTranslation = useCallback(\n (key: string) => {\n const keyItems = key.split('.');\n return get(data, keyItems, '');\n },\n [data]\n );\n\n return { ...data, t: getTranslation };\n};\n", "import { isConnected } from '@particle-network/auth-core';\nimport qs from 'qs';\nimport React, { useMemo } from 'react';\nimport type { ICustomRouter } from '../../context/types';\nimport ParticleLoading from '../loading';\n\nexport enum AuthPage {\n Index = 'index',\n Login = 'login',\n EvmSign = 'evm-chain/sign',\n SolanaSign = 'solana/sign',\n LoginAccount = 'login-account',\n AccountSecurity = 'account/security',\n MasterPasswordVerify = 'account/master-password/verify',\n MasterPasswordPrompt = 'account/master-password/prompt',\n}\n\ninterface IPage {\n name?: AuthPage;\n path?: string;\n component: React.LazyExoticComponent;\n}\n\nconst pages: IPage[] = [\n {\n name: AuthPage.Index,\n component: React.lazy(() => import('../../pages/index/index')),\n },\n {\n name: AuthPage.Login,\n component: React.lazy(() => import('../../pages/login')),\n },\n {\n path: 'account/security',\n component: React.lazy(() => import('../../pages/account/security')),\n },\n {\n name: AuthPage.LoginAccount,\n path: 'login-account',\n component: React.lazy(() => import('../../pages/loginAccount/index')),\n },\n {\n path: 'manageDevices/deviceList',\n component: React.lazy(() => import('../../pages/manageDevices/deviceList/index')),\n },\n {\n path: 'manageDevices/deviceDetails',\n component: React.lazy(() => import('../../pages/manageDevices/deviceDetails/index')),\n },\n {\n name: AuthPage.EvmSign,\n component: React.lazy(() => import('../../pages/sign/index')),\n },\n {\n name: AuthPage.SolanaSign,\n component: React.lazy(() => import('../../pages/sign/components/info-sign')),\n },\n {\n path: 'account/bind',\n component: React.lazy(() => import('../../pages/account/accountBind/index')),\n },\n {\n path: 'account/verify',\n component: React.lazy(() => import('../../pages/account/accountVerify/index')),\n },\n {\n path: 'login-account',\n component: React.lazy(() => import('../../pages/loginAccount/index')),\n },\n {\n path: 'manageDevices/deviceDetails',\n component: React.lazy(() => import('../../pages/manageDevices/deviceDetails/index')),\n },\n {\n path: 'account/master-password',\n component: React.lazy(() => import('../../pages/account/setMasterPassword/index')),\n },\n {\n path: 'account/master-password/description',\n component: React.lazy(() => import('../../pages/account/masterPasswordDescription/index')),\n },\n {\n path: AuthPage.MasterPasswordVerify,\n component: React.lazy(() => import('../../pages/account/masterPasswordVerify/index')),\n },\n {\n path: AuthPage.MasterPasswordPrompt,\n component: React.lazy(() => import('../../pages/account/masterPasswordModal/index')),\n },\n {\n path: 'account/master-password/change',\n component: React.lazy(() => import('../../pages/account/masterPasswordChange/index')),\n },\n {\n path: 'account/set-password',\n component: React.lazy(() => import('../../pages/account/setPaymentPassword/index')),\n },\n {\n path: 'account/change-password',\n component: React.lazy(() => import('../../pages/account/changePaymentPassword/index')),\n },\n {\n path: 'login-account/bind',\n component: React.lazy(() => import('../../pages/loginAccountBind/index')),\n },\n {\n path: 'login-account/bind-loading',\n component: React.lazy(() => import('../../pages/account/loginAccountBindLoading/index')),\n },\n];\n\nconst CustomRouter = (props: ICustomRouter) => {\n const path = useMemo(() => {\n let path = props.path?.split('?')?.[0].replace(/^\\//, '');\n if (path == '' || path == '/') {\n path = AuthPage.Index;\n }\n if (path !== AuthPage.Login && !isConnected() && path !== AuthPage.Index) {\n path = AuthPage.Login;\n }\n return path;\n }, [props.path]);\n\n const queryString = useMemo(() => {\n let queryString = props.path?.split('?')?.[1];\n if (path !== AuthPage.Login && !isConnected() && path !== AuthPage.Index) {\n queryString = '';\n }\n return queryString;\n }, [props.path, path]);\n\n const state = useMemo(() => {\n return {\n ...(props.state || {}),\n ...qs.parse(queryString),\n };\n }, [props.state, queryString]);\n\n const Comp = useMemo(() => {\n let Comp = pages.find((item: IPage) => item.name === path || item.path === path);\n if (!Comp) {\n if (path) {\n console.log('Not Found', path);\n }\n Comp = pages[0];\n }\n return Comp;\n }, [path]);\n\n return (\n \n }\n >\n \n \n \n );\n};\n\nexport default CustomRouter;\n", "import React from 'react';\nimport styles from './index.less';\n\nconst ParticleLoading = () => {\n return (\n <>\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
Powered by
\n
Particle Network
\n
\n {props.children}\n
\n );\n}\n", "import { useEffect, useRef } from 'react';\n\nconst KEYCODE_TAB = 9;\n\nexport default function useFocusTrap() {\n const elRef = useRef(null);\n\n function handleFocus(e: any) {\n if (!elRef.current) return;\n const focusableEls = elRef.current.querySelectorAll(`\n a[href]:not(:disabled),\n button:not(:disabled),\n textarea:not(:disabled),\n input[type=\"text\"]:not(:disabled),\n input[type=\"radio\"]:not(:disabled),\n input[type=\"checkbox\"]:not(:disabled),\n select:not(:disabled)\n `),\n firstFocusableEl = focusableEls[0],\n lastFocusableEl = focusableEls[focusableEls.length - 1];\n\n const isTabPressed = e.key === 'Tab' || e.keyCode === KEYCODE_TAB;\n\n if (!isTabPressed) {\n return;\n }\n\n if (e.shiftKey) {\n /* shift + tab */ if (document.activeElement === firstFocusableEl) {\n lastFocusableEl.focus();\n e.preventDefault();\n }\n } /* tab */ else {\n if (document.activeElement === lastFocusableEl) {\n firstFocusableEl.focus();\n e.preventDefault();\n }\n }\n }\n\n useEffect(() => {\n if (elRef.current) {\n elRef.current.addEventListener('keydown', handleFocus);\n elRef.current.focus({ preventScroll: true });\n }\n return () => {\n if (elRef.current) {\n elRef.current.removeEventListener('keydown', handleFocus);\n }\n };\n }, []);\n\n return elRef;\n}\n", "import { Modal } from 'antd';\nimport React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react';\n\nimport { useAuthCoreModal } from '../../context';\nimport ParticleDrawer from '../particle-drawer';\nimport styles from './index.less';\n\ninterface IProps {\n children?: React.ReactNode;\n visible?: boolean;\n containerSelector?: any;\n title?: string | any;\n modalProps?: any;\n locked?: 'modal' | 'drawer';\n drawerProps?: any;\n className?: string;\n closable?: boolean;\n onOpen?: () => void;\n onClose?: () => void;\n}\nconst ParticleModal = forwardRef((props: IProps, ref) => {\n const { children, title, drawerProps = {}, modalProps = {} } = props;\n const { authCoreModal } = useAuthCoreModal();\n const [visible, setVisible] = useState(props.visible || false);\n\n const onClose = () => {\n setVisible(false);\n props.onClose && props.onClose();\n };\n\n const onOpen = () => {\n setVisible(true);\n props.onOpen && props.onOpen();\n };\n\n useImperativeHandle(ref, () => ({\n setVisible,\n onOpen,\n onClose,\n }));\n\n useEffect(() => {\n setVisible(props.visible ?? false);\n }, [props.visible]);\n\n if (modalProps?.style?.top) {\n modalProps.style.top = '';\n }\n\n return (\n <>\n \n {authCoreModal.viewType == 'desktop' || props.locked === 'modal' ? (\n {\n return props.containerSelector\n ? document.querySelector(props.containerSelector)\n : authCoreModal.rootModalContainer || document.querySelector('body');\n }}\n onCancel={() => {\n onClose();\n }}\n closable={props.closable ?? true}\n // closeIcon={}\n {...modalProps}\n styles={{\n ...modalProps.styles,\n }}\n >\n {children}\n \n ) : (\n {\n return props.containerSelector\n ? document.querySelector(props.containerSelector)\n : authCoreModal.rootModalContainer || document.querySelector('body');\n }}\n extra={<>{/* onClose()} /> */}}\n title={title}\n {...drawerProps}\n >\n {children}\n \n )}\n \n );\n});\n\nexport default ParticleModal;\n", "import { Drawer } from 'antd';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { useAuthCoreModal } from '../../context';\nimport { isMobile } from '../../utils';\nimport { isTelegramWebApp } from '../../utils/isTelegramWebApp';\nimport CircleClose from '../icon/circle-close';\nimport styles from './index.less';\n\ninterface IProps {\n children?: React.ReactNode;\n onClose: () => void;\n visible: boolean;\n title?: string;\n [key: string]: any;\n}\nconst ParticleDrawer = (props: IProps) => {\n const { title, children, onClose, visible, ...rest } = props;\n const [mobile, setMobile] = useState(isMobile());\n const { authCoreModal } = useAuthCoreModal();\n const dropDownRef = useRef({\n isDown: false,\n moveY: 0,\n });\n const drawerContentRef = useRef(null);\n\n const className = useMemo(() => {\n const classNames = [props.className, `particle-${mobile ? 'mobile' : 'pc'}-drawer`, 'particle-drawer-container'];\n return classNames.join(' ');\n }, [props.className, mobile]);\n\n const isScroll = (target: HTMLElement) => {\n let parentElement: HTMLElement | null = target;\n let flag = false;\n while (parentElement) {\n parentElement = parentElement.parentElement;\n if (parentElement?.classList.contains('ant-drawer-body')) {\n break;\n }\n if (parentElement?.scrollTop) {\n flag = true;\n break;\n }\n }\n return flag;\n };\n\n const drawerContainer = useMemo(() => {\n return props.containerSelector\n ? document.querySelector(props.containerSelector)\n : authCoreModal.rootModalContainer || document.querySelector('body');\n }, [props.containerSelector, authCoreModal.rootModalContainer]);\n\n useEffect(() => {\n if (!mobile || !drawerContentRef?.current || isTelegramWebApp()) {\n return;\n }\n const touchstartHandler = (e: TouchEvent) => {\n if (e.type === 'touchstart' && isScroll(e.target as HTMLElement)) {\n return;\n }\n const clientY = e.touches[0].clientY;\n e.stopPropagation();\n dropDownRef.current.isDown = true;\n dropDownRef.current.moveY = clientY;\n };\n\n if (visible) {\n drawerContentRef?.current?.addEventListener('touchstart', touchstartHandler);\n }\n\n if (!visible) {\n drawerContentRef?.current?.removeEventListener('touchstart', touchstartHandler);\n dropDownRef.current.isDown = false;\n dropDownRef.current.moveY = 0;\n }\n\n return () => {\n drawerContentRef?.current?.removeEventListener('touchstart', touchstartHandler);\n dropDownRef.current.isDown = false;\n dropDownRef.current.moveY = 0;\n };\n }, [visible, mobile, drawerContentRef?.current]);\n\n useEffect(() => {\n if (!mobile || !drawerContentRef?.current || isTelegramWebApp()) {\n return;\n }\n const touchendHandler = (e: TouchEvent) => {\n if (dropDownRef.current.isDown) {\n e.stopPropagation();\n dropDownRef.current.isDown = false;\n }\n };\n\n const touchmoveHandler = (e: TouchEvent) => {\n e.preventDefault();\n const clientY = e.touches[0].clientY;\n if (dropDownRef.current.isDown && clientY - dropDownRef.current.moveY > 60) {\n onClose();\n }\n };\n\n drawerContentRef?.current?.addEventListener('touchend', touchendHandler);\n\n drawerContentRef?.current?.addEventListener('touchmove', touchmoveHandler, { passive: true });\n\n return () => {\n drawerContentRef?.current?.removeEventListener('touchend', touchendHandler);\n drawerContentRef?.current?.removeEventListener('touchmove', touchmoveHandler);\n };\n }, [mobile, drawerContentRef?.current]);\n\n useEffect(() => {\n const resizeHandler = () => {\n setMobile(isMobile());\n };\n window.addEventListener('resize', resizeHandler);\n return () => {\n window.removeEventListener('resize', resizeHandler);\n };\n }, []);\n\n return (\n {\n return rest?.getContainer?.() || drawerContainer;\n }}\n >\n \n \n
{\n onClose();\n }}\n />\n \n {title && {title}
}\n {children}\n