{"version":3,"file":"static/chunks/90344-1c7e6ca9dcdf4b95.js","sources":["webpack://_N_E/./src/LegacyApp/client/components/tooltip/tooltip.jsx","webpack://_N_E/./src/common/methods/iteratePromiseChunks.ts","webpack://_N_E/./src/LegacyApp/hooks/wallet/useWalletSettings.ts","webpack://_N_E/./src/LegacyApp/hooks/window/useWindowSize.ts","webpack://_N_E/./src/LegacyApp/methods/array/removeArrayDuplicates.ts","webpack://_N_E/./src/common/components/auth/AuthActionButton.tsx","webpack://_N_E/./src/common/components/optionsList/OptionsList.tsx","webpack://_N_E/./src/common/components/timerCountDown/index.tsx","webpack://_N_E/./src/common/components/withdraw/Withdraw.global.styled.ts","webpack://_N_E/./src/common/icons/ui/arrow-left.tsx","webpack://_N_E/./src/common/icons/ui/edit-icon.tsx","webpack://_N_E/./src/common/icons/ui/more-icon.tsx","webpack://_N_E/./src/common/icons/ui/plus-icon.tsx","webpack://_N_E/./src/common/icons/ui/remove-icon.tsx","webpack://_N_E/./src/common/icons/user-menu/addressBook.tsx","webpack://_N_E/./src/common/icons/user-menu/depositIcon.tsx","webpack://_N_E/./src/common/icons/user-menu/vault.tsx","webpack://_N_E/./src/common/icons/user-menu/withdrawIcon.tsx","webpack://_N_E/./src/common/icons/wallet/add-wallet.tsx","webpack://_N_E/./src/common/icons/wallet/verify-2fa.tsx","webpack://_N_E/./src/common/icons/wallet/verify-email.tsx","webpack://_N_E/./src/common/selectors/twoFa.selectors.ts","webpack://_N_E/./src/modules/balance/components/BalancesDropdownSelector.tsx","webpack://_N_E/./src/modules/balance/context/Balance.context.ts","webpack://_N_E/./src/modules/balance/hooks/useSetCurrency.ts","webpack://_N_E/./src/modules/balance/styles/BalanceWrapper.styled.ts","webpack://_N_E/./src/modules/form/components/Form.tsx","webpack://_N_E/./src/modules/form/components/InputWrapperField.tsx","webpack://_N_E/./src/modules/form/components/SelectField.tsx","webpack://_N_E/./src/modules/form/context/FormApiErrorsContext.ts","webpack://_N_E/./src/modules/form/methods/validateFormValues.ts","webpack://_N_E/./src/modules/modals/components/ModalSubPage/ModalSubPage.context.ts","webpack://_N_E/./src/modules/modals/components/ModalSubPage/ModalSubPage.tsx","webpack://_N_E/./src/modules/modals/components/UI/ModalTitle.tsx","webpack://_N_E/./src/modules/modals/modal/mixins.ts","webpack://_N_E/./src/modules/wallet/methods/generatePayUrl.ts","webpack://_N_E/./src/modules/form/components/OptionWithIcon.tsx","webpack://_N_E/./src/modules/form/components/SingleValueWithIcon.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/constants/FormFieldNames.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/ProviderTile.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoOffers.tsx","webpack://_N_E/./src/modules/form/components/CheckboxField.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoTooltipContent.tsx","webpack://_N_E/./src/modules/form/components/SelectFieldWithSearchInside.tsx","webpack://_N_E/./src/modules/form/components/CustomMenuList.tsx","webpack://_N_E/./src/modules/form/components/CustomValueContainerWithIcon.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoForm.tsx","webpack://_N_E/./src/modules/wallet/components/VaultContent/VaultContent.tsx","webpack://_N_E/./src/modules/wallet/hooks/useProvidersCash.ts","webpack://_N_E/./src/modules/wallet/hooks/useDepositOfferCash.ts","webpack://_N_E/./src/modules/wallet/methods/getOrderRedirectUrl.ts","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/constants/buyCryptoFormValidate.ts","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoStatus.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCrypto.tsx","webpack://_N_E/./src/modules/wallet/hooks/useCurrenciesCash.ts","webpack://_N_E/./src/modules/wallet/components/DepositContent/DepositButton.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoIcons.tsx","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCryptoTokens.tsx","webpack://_N_E/./src/modules/wallet/wallet/DepositSkins/DepositSkinsStatus.tsx","webpack://_N_E/./src/modules/wallet/methods/getDepositSkinsRedirectUrl.ts","webpack://_N_E/./src/modules/wallet/wallet/DepositSkins/DepositSkinsIcons.tsx","webpack://_N_E/./src/modules/wallet/wallet/DepositSkins/DepositSkins.tsx","webpack://_N_E/./src/modules/wallet/components/DepositContent/DepositContent.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/WithdrawConfirmInfo.tsx","webpack://_N_E/./src/modules/wallet/components/WithdrawContent/WithdrawContent.tsx","webpack://_N_E/./src/common/selectors/vault.selectors.ts","webpack://_N_E/./src/LegacyApp/client/components/vaultHistoryTable/vaultHistoryTable.tsx","webpack://_N_E/./src/modules/wallet/components/VaultContent/VaultDropdowns.tsx","webpack://_N_E/./src/modules/wallet/hooks/useAddressBook.ts","webpack://_N_E/./src/modules/wallet/context/AddressBook.context.ts","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddWalletButton.tsx","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddressBookWallet.tsx","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddressBookList.tsx","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddressBookContent.tsx","webpack://_N_E/./src/common/hooks/useInput.ts","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddressBookForm.tsx","webpack://_N_E/./src/modules/wallet/components/WalletTabs/WalletTabs.tsx","webpack://_N_E/./src/modules/wallet/components/AddressBookContent/AddressBook.tsx","webpack://_N_E/./src/modules/wallet/wallet/WalletSettingsWrapper/WalletSettingsWrapper.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawBlockedInfo/VerifyBox.tsx","webpack://_N_E/./src/common/components/timerCountDown/CircleTimerCountDown.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawBlockedInfo/WithdrawBlockedTimer.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawBlockedInfo/WithdrawBlockedInfo.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/WithdrawForm.styled.ts","webpack://_N_E/./src/modules/balance/store/thunks/balance.thunk.js","webpack://_N_E/./src/modules/wallet/constants.ts","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/WithdrawForm.tsx","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/methods/verifyWithdrawAmount.ts","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/methods/verifyPaymentId.ts","webpack://_N_E/./src/modules/wallet/wallet/WithdrawForm/WithdrawForm/methods/verifyWalletAddress.ts","webpack://_N_E/./src/LegacyApp/methods/currency/addresValidator/checkCurrencyAddressError.ts","webpack://_N_E/./src/ui/components/link/index.tsx","webpack://_N_E/./src/ui/components/tab-navigation/TabNavigation.styled.ts","webpack://_N_E/./src/ui/components/tab-navigation/index.tsx","webpack://_N_E/./src/LegacyApp/hooks/window/useIsElementScroll.ts","webpack://_N_E/./src/common/hooks/useInitScrollTo.ts","webpack://_N_E/./src/common/hooks/useMultiRef.ts","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/BuyCrypto.module.scss","webpack://_N_E/./src/modules/wallet/wallet/BuyCrypto/ProviderTile.module.scss"],"sourceRoot":"","sourcesContent":["import 'tippy.js/dist/tippy.css';\n\nimport React, { Children } from 'react';\nimport PropTypes from 'prop-types';\nimport Tippy from '@tippyjs/react';\nimport { connect } from 'react-redux';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport classnames from 'classnames';\n\nimport { isFunction } from '@common/methods/isFunction';\nimport { trans } from '@legacyApp/client/modules/translation/translate';\nimport { enhanceComponent } from '@legacyApp/client/wrappers/enhanceComponent';\n\nTippy.defaultProps = {\n\t...Tippy.defaultProps,\n\tarrow: true,\n};\n\nclass ChildrenWithInstance extends React.PureComponent {\n\tstatic propTypes = {\n\t\tchildren: PropTypes.any,\n\t\tinstance: PropTypes.any,\n\t};\n\n\trender() {\n\t\treturn Children.map(this.props.children, (child) => {\n\t\t\t// console.log({child, instance: this.props.instance});\n\t\t\treturn React.cloneElement(child, {\n\t\t\t\ttippyinstance: this.props.instance,\n\t\t\t\t...child.props,\n\t\t\t});\n\t\t});\n\t}\n}\n\nclass Tooltip extends React.PureComponent {\n\tstatic propTypes = {\n\t\tlocalTheme: PropTypes.any,\n\t\tcontent: PropTypes.any,\n\t\tisVisible: PropTypes.any,\n\t\tvisible: PropTypes.any,\n\t\tenabled: PropTypes.bool,\n\t\thideOnClick: PropTypes.any,\n\t\tchildren: PropTypes.any,\n\t\tpassInstance: PropTypes.bool,\n\t\thandleComponentError: PropTypes.func,\n\t\tmodal: PropTypes.any,\n\t\tonModal: PropTypes.bool,\n\t\tdispatch: PropTypes.func,\n\t\tmobile: PropTypes.bool,\n\t\tmobileEnable: PropTypes.bool,\n\t\tnamespace: PropTypes.string,\n\t\tchatVisible: PropTypes.bool,\n\t\tsideMenuVisible: PropTypes.bool,\n\t\tzIndex: PropTypes.number,\n\t\tclassName: PropTypes.string,\n\t\tcloseOnScrollElemClass: PropTypes.string,\n\t};\n\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tinstance: '',\n\t\t\tforceHide: false,\n\t\t};\n\t\tthis.modalResizeObserver =\n\t\t\tprocess.browser && ResizeObserver\n\t\t\t\t? new ResizeObserver(() => {\n\t\t\t\t\t\tthis.popperForceUpdate();\n\t\t\t\t })\n\t\t\t\t: null;\n\t\tthis.strategy = React.createRef();\n\t\tthis.element = React.createRef();\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.setForceHide();\n\t\tthis.setOnModalResize();\n\t\tthis.closeOnScrollEventAdd();\n\t}\n\n\tcomponentWillUnmount() {\n\t\tconst modalElement = this.getModalElement();\n\t\tif (modalElement && isFunction(this.modalResizeObserver?.unobserve)) {\n\t\t\tthis.modalResizeObserver.unobserve(modalElement);\n\t\t}\n\n\t\tthis.closeOnScrollEventRemove();\n\t}\n\n\tsetInstance = (instance) => {\n\t\tthis.setState({\n\t\t\tinstance,\n\t\t});\n\t};\n\n\tcomponentDidUpdate(prevProps) {\n\t\tif (\n\t\t\tprevProps.modal !== this.props.modal ||\n\t\t\tprevProps.mobile !== this.props.mobile ||\n\t\t\tprevProps.chatVisible !== this.props.chatVisible ||\n\t\t\tprevProps.sideMenuVisible !== this.props.sideMenuVisible\n\t\t) {\n\t\t\tthis.popperForceUpdate();\n\t\t\tthis.setForceHide();\n\t\t}\n\n\t\tif (\n\t\t\tprevProps.content !== this.props.content ||\n\t\t\t!!prevProps.visible !== !!this.props.visible\n\t\t) {\n\t\t\tthis.setOnModalResize();\n\t\t}\n\t}\n\n\tisOnModal = () => {\n\t\treturn typeof this.props.onModal === 'boolean'\n\t\t\t? this.props.onModal\n\t\t\t: this.getModalElement();\n\t};\n\n\tgetModalElement = () => {\n\t\treturn this.element.current ? this.element.current.closest('.modal') : null;\n\t};\n\n\tpopperForceUpdate = () => {\n\t\tsetTimeout(() => {\n\t\t\tif (isFunction(this.state.instance?.popperInstance?.forceUpdate)) {\n\t\t\t\tthis.state.instance.popperInstance.forceUpdate();\n\t\t\t}\n\t\t}, 300);\n\t};\n\n\tsetOnModalResize = () => {\n\t\tconst modalElement = this.getModalElement();\n\t\tif (modalElement && isFunction(this.modalResizeObserver?.observe)) {\n\t\t\tthis.modalResizeObserver.observe(modalElement);\n\t\t}\n\t};\n\n\tsetForceHide = () => {\n\t\tconst onModal = this.isOnModal();\n\t\tthis.setState({\n\t\t\tforceHide:\n\t\t\t\t(this.props.modal && !onModal) ||\n\t\t\t\t(!onModal &&\n\t\t\t\t\tthis.props.mobile &&\n\t\t\t\t\t(this.props.chatVisible || this.props.sideMenuVisible)),\n\t\t});\n\t};\n\n\tonShown = () => {\n\t\tconst input = this.element?.current?.querySelector?.('input');\n\t\tif (!input) {\n\t\t\treturn;\n\t\t}\n\t\tconst isInputFocus = document.activeElement === input;\n\t\tif (!isInputFocus) {\n\t\t\tinput.focus();\n\t\t}\n\t};\n\n\tcloseOnScroll = () => {\n\t\tif (this.state.instance.state.isVisible) {\n\t\t\tthis.state.instance.hide();\n\t\t}\n\t};\n\n\tcloseOnScrollEventAdd = () => {\n\t\tif (!this.props.closeOnScrollElemClass) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst elem = document.querySelector(\n\t\t\t`.${this.props.closeOnScrollElemClass}`,\n\t\t);\n\n\t\telem?.addEventListener('scroll', this.closeOnScroll, false);\n\t};\n\n\tcloseOnScrollEventRemove = () => {\n\t\tif (!this.props.closeOnScrollElemClass) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst elem = document.querySelector(\n\t\t\t`.${this.props.closeOnScrollElemClass}`,\n\t\t);\n\n\t\telem?.removeEventListener('scroll', this.closeOnScroll, false);\n\t};\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tpassInstance,\n\t\t\tlocalTheme,\n\t\t\tnamespace,\n\t\t\tclassName,\n\t\t\t...props\n\t\t} = this.props;\n\n\t\tdelete props.handleComponentError;\n\t\tdelete props.modal;\n\t\tdelete props.className;\n\t\tdelete props.dispatch;\n\t\tdelete props.onModal;\n\t\tdelete props.mobile;\n\t\tdelete props.mobileEnable;\n\t\tdelete props.chatVisible;\n\t\tdelete props.sideMenuVisible;\n\t\tdelete props.closeOnScrollElemClass;\n\n\t\tif (!children) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif (!props.content || typeof props.content === 'boolean') {\n\t\t\treturn children;\n\t\t}\n\n\t\tif (\n\t\t\t(props.content &&\n\t\t\t\ttypeof props.content === 'object' &&\n\t\t\t\t('message' in props.content || 'values' in props.content)) ||\n\t\t\tnamespace\n\t\t) {\n\t\t\tprops.content = trans({ label: props.content, namespace });\n\t\t}\n\n\t\tconst content = (\n\t\t\t
\n\t\t\t\t{passInstance && (\n\t\t\t\t\t\n\t\t\t\t\t\t{children}\n\t\t\t\t\t\n\t\t\t\t)}\n\t\t\t\t{!passInstance && children}\n\t\t\t
\n\t\t);\n\n\t\tif (\n\t\t\tthis.state.forceHide ||\n\t\t\t(this.props.mobile &&\n\t\t\t\tthis.props.localTheme !== 'error' &&\n\t\t\t\t!this.props.mobileEnable &&\n\t\t\t\t!passInstance)\n\t\t) {\n\t\t\treturn content;\n\t\t}\n\n\t\treturn (\n\t\t\t\n\t\t\t\t{content}\n\t\t\t\n\t\t);\n\t}\n}\n\nTooltip = enhanceComponent({\n\tTooltip,\n});\n\nconst mapStateToProps = (state) => {\n\treturn {\n\t\tmodal: !!state.modal?.id,\n\t\tmobile: state.app.mobile,\n\t\t// TODO: chat store usage\n\t\tchatVisible: state?.chat?.visible,\n\t\tsideMenuVisible: state?.app?.isSideMenuVisible,\n\t};\n};\n//\n// const mapDispatchToProps = (dispatch) => {\n// return {\n// };\n// };\n\nTooltip = connect(mapStateToProps, null)(Tooltip);\n\nexport default Tooltip;\n","export const iteratePromiseChunks = async (\n\tchunkSize,\n\tarray,\n\tcallback,\n\tid?: string,\n): Promise => {\n\tconst perChunk = chunkSize;\n\tconst chunks = array.reduce((all, one, i) => {\n\t\tconst ch = Math.floor(i / perChunk);\n\t\tall[ch] = [].concat(all[ch] || [], one);\n\t\treturn all;\n\t}, []);\n\tfor (const [chunkIndex, chunk] of chunks.entries()) {\n\t\tconsole.log(\n\t\t\t`--------------- CHUNK ${chunkIndex + 1}/${chunks.length} - updating ${\n\t\t\t\tid || ''\n\t\t\t}`,\n\t\t);\n\t\tawait Promise.all(\n\t\t\tchunk.map((el, index) => callback(el, index, chunkIndex)),\n\t\t);\n\t}\n};\n","import { useCallback, useState } from 'react';\nimport {\n\tWalletSettings,\n\tWalletSettingsCurrency,\n} from '@common/context/wallet/WalletSettingsContext';\nimport { generateUrl, ROUTE } from '@common/routes';\nimport {\n\tCurrencyNetworkType,\n\tCurrencyType,\n} from '@legacyApp/types/wallet/CurrencyType';\nimport { mapApiTokenToLayoutToken } from '@common/controllers/currency/currenciesSettings';\nimport { iteratePromiseChunks } from '@common/methods/iteratePromiseChunks';\nimport { useFetchApiPromise } from '../fetch/useFetchApi';\nimport { useInterval } from '../app/useInterval';\nimport { minute } from '../../client/modules/app/time';\n\nexport type UseWalletSettingsUpdate = () => Promise<[any, WalletSettings]>;\nconst DATA_UPDATE_INTERVAL = 10 * minute;\n\nconst mapSettings = async (settings: WalletSettings) => {\n\tconst result: WalletSettings = {};\n\tconst currencies = Object.keys(settings);\n\tawait iteratePromiseChunks(5, currencies, async (currency: CurrencyType) => {\n\t\tconst resultCurrency: WalletSettingsCurrency = {};\n\t\tconst currencySettings = settings[currency];\n\t\tconst networks = Object.keys(currencySettings);\n\n\t\tawait iteratePromiseChunks(\n\t\t\t5,\n\t\t\tnetworks,\n\t\t\tasync (network: CurrencyNetworkType) => {\n\t\t\t\tresultCurrency[network] = {\n\t\t\t\t\t...currencySettings[network],\n\t\t\t\t\ttokens: currencySettings[network].tokens.map(\n\t\t\t\t\t\tmapApiTokenToLayoutToken,\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t},\n\t\t);\n\n\t\tresult[currency] = resultCurrency;\n\t});\n\n\treturn result;\n};\n\nexport const useWalletSettings = (): {\n\tsettings: WalletSettings;\n\tloaded: boolean;\n\terror?: any;\n\tupdate: UseWalletSettingsUpdate;\n} => {\n\tconst [_settings, setSettings] = useState(null);\n\tconst [_loaded, setLoaded] = useState(false);\n\tconst [_error, setError] = useState(null);\n\n\tconst fetchApi = useFetchApiPromise();\n\n\tconst setSettingsData: UseWalletSettingsUpdate = useCallback(async () => {\n\t\tconst response: {\n\t\t\tsettings: WalletSettings;\n\t\t} = await fetchApi({\n\t\t\turl: generateUrl(ROUTE.apiSiteWallets),\n\t\t});\n\t\tsetLoaded(true);\n\t\tlet error = null;\n\t\tif (response.settings) {\n\t\t\tsetSettings(await mapSettings(response.settings));\n\t\t} else {\n\t\t\tsetError(response);\n\t\t\terror = response;\n\t\t}\n\t\treturn [error, response.settings];\n\t}, [fetchApi]);\n\n\tuseInterval({\n\t\tinterval: DATA_UPDATE_INTERVAL,\n\t\tcallback: setSettingsData,\n\t\tid: 'walletSettings',\n\t});\n\n\treturn {\n\t\tsettings: _settings,\n\t\tloaded: _loaded,\n\t\terror: _error,\n\t\tupdate: setSettingsData,\n\t};\n};\n","import { useCallback, useEffect, useState } from 'react';\nimport { useWindowEventListener } from '@common/hooks/useEventListener';\n\ntype Callback = (values: [number, number]) => void;\n\nexport const useWindowSize = (callback: Callback) => {\n\tconst [size, setSize] = useState([0, 0]);\n\tconst updateSize = useCallback(() => {\n\t\tif (size[0] === window.innerWidth && size[1] === window.innerHeight) {\n\t\t\treturn;\n\t\t}\n\t\tsetSize([window.innerWidth, window.innerHeight]);\n\t\tif (!callback) {\n\t\t\treturn;\n\t\t}\n\t\tcallback([window.innerWidth, window.innerHeight]);\n\t}, [callback, size]);\n\n\tuseWindowEventListener('resize', updateSize);\n\n\tuseEffect(() => {\n\t\tupdateSize();\n\t}, [updateSize]);\n\treturn size;\n};\n","import uniq from 'lodash.uniq';\n\nexport const removeArrayDuplicates = (array) => {\n\treturn uniq(array);\n};\n","import { FC, PropsWithChildren } from 'react';\nimport { Button, ButtonProps } from '@ui/button';\nimport { Trans } from '@legacyApp/client/modules/translation/translate';\nimport { openModal } from '@modules/modals/store/modal.actions';\nimport { useAppDispatch } from '@legacyApp/hooks/store/useAppDispatch';\nimport { MODAL_ID } from '@common/constants/modal/ids.modal.constants';\nimport { useUserIsLogged } from '@common/selectors/user.selectors';\n\nexport const AuthActionButton: FC<\n\tPropsWithChildren<{\n\t\tlabelText?: string;\n\t\tprops?: ButtonProps;\n\t}>\n> = ({ labelText, children, props }) => {\n\tconst isLogged = useUserIsLogged();\n\tconst dispatch = useAppDispatch();\n\n\tif (!isLogged || !children) {\n\t\treturn (\n\t\t\t}\n\t\t\t\tonClick={() =>\n\t\t\t\t\tdispatch(openModal(MODAL_ID.NEW_ACCOUNT, 'auth_action_button'))\n\t\t\t\t}\n\t\t\t\tname={'submit-not-auth'}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn <>{children};\n};\n","import React, { FC } from 'react';\nimport {\n\tDropdown,\n\tDropdownProps,\n\tStyledDropdownButtonWrapper,\n} from '@ui/dropdown';\nimport { Button, CSSClassNameButton } from '@ui/button';\nimport { MoreIcon } from '@icons/ui/more-icon';\nimport styled from 'styled-components';\nimport { Size } from '@uiTypes/Size';\nimport { ButtonStyleType } from '@uiTypes/ButtonStyleType';\n\nexport interface OptionsListProps {\n\tportalId: string;\n\tpopperOptions?: DropdownProps['popperOptions'];\n\tlist: DropdownProps['list'];\n}\n\nexport const OptionsList: FC = ({\n\tportalId,\n\tpopperOptions,\n\tlist,\n}) => {\n\tif (!list.length) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t\n\t\t\t\n\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\n\t\t\n\t);\n};\n\nexport const OptionsListStyled = styled.div`\n\t${StyledDropdownButtonWrapper} {\n\t\t.${CSSClassNameButton} {\n\t\t\tbox-shadow: unset !important;\n\t\t\tpadding-right: 8px !important;\n\t\t}\n\t}\n`;\n","import React, { FC, useCallback, useEffect, useState } from 'react';\nimport Countdown from 'react-countdown';\nimport { CountdownProps } from 'react-countdown/dist/Countdown';\nimport { getTimestamp } from '@legacyApp/client/modules/app/timeService';\nimport { trans } from '@legacyApp/client/modules/translation/translate';\nimport { useAppDispatch } from '@legacyApp/hooks/store/useAppDispatch';\nimport { usePrevious } from '@legacyApp/hooks/render/usePrevious';\nimport { isFunction } from '../../methods/isFunction';\n\nexport interface TimerCountDownProps {\n\tdate: Date | string | number;\n\tprecise?: boolean;\n\tcallback?: () => void;\n\tdispatchCallback?: any;\n\trenderer?: CountdownProps['renderer'];\n}\n\nconst getTimestamp_ = (date) => {\n\tif (!date) {\n\t\treturn null;\n\t}\n\n\treturn getTimestamp(date);\n};\n\nexport const TimerCountDown: FC = (props) => {\n\tconst { date, precise, callback, dispatchCallback, renderer } = props;\n\tconst dispatch = useAppDispatch();\n\tconst [timestamp, setTimestamp] = useState(getTimestamp_(date));\n\tconst prevDate = usePrevious(date);\n\n\tconst renderer_ = useCallback(\n\t\t(data) => {\n\t\t\tconst { days, hours, minutes, seconds, completed, formatted } = data;\n\n\t\t\tif (completed) {\n\t\t\t\tif (isFunction(callback)) {\n\t\t\t\t\tcallback();\n\t\t\t\t}\n\t\t\t\tif (dispatchCallback) {\n\t\t\t\t\tdispatch(dispatchCallback);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (isFunction(renderer)) {\n\t\t\t\treturn renderer(data);\n\t\t\t}\n\n\t\t\tif (completed) {\n\t\t\t\treturn precise ? '00:00' : null;\n\t\t\t}\n\n\t\t\tif (precise) {\n\t\t\t\tconst hoursPrecise = hours > 0 ? `${formatted.hours}:` : '';\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\t\t{hoursPrecise}\n\t\t\t\t\t\t{formatted.minutes}:{formatted.seconds}\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (days > 0) {\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\t\t{formatted.days} {trans({ label: days === 1 ? 'day' : 'days' })}\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (hours > 0) {\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\t\t{formatted.hours} {trans({ label: hours === 1 ? 'hour' : 'hours' })}\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (minutes > 0) {\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\t\t{formatted.minutes}{' '}\n\t\t\t\t\t\t{trans({ label: minutes === 1 ? 'minute' : 'minutes' })}\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif (seconds > 0) {\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t\t\t{formatted.seconds}{' '}\n\t\t\t\t\t\t{trans({ label: seconds === 1 ? 'second' : 'seconds' })}\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn {new Date(timestamp).toTimeString()};\n\t\t},\n\t\t[callback, dispatch, dispatchCallback, precise, renderer, timestamp],\n\t);\n\n\tuseEffect(() => {\n\t\tif (getTimestamp_(date) !== getTimestamp_(prevDate)) {\n\t\t\tsetTimestamp(getTimestamp_(date));\n\t\t}\n\t}, [date, prevDate]);\n\n\treturn ;\n};\n","import { createGlobalStyle } from 'styled-components';\nimport { ThemeType } from '@legacyApp/client/modules/style/theme';\nimport { parseImageSrc } from '../default/Image/Image';\n\nexport const StyledWithdrawGlobal = createGlobalStyle<{ theme: ThemeType }>`\n\t.page-user_withdraw {\n\t\t.page-title:after {\n\t\t\tcontent: url(${parseImageSrc('/img/main/icon-withdraw.svg')});\n\t\t}\n\n\t\t.withdraw-form {\n\t\t\t.list-box {\n\t\t\t@extend .box-no-height;\n\t\t\t\tmargin: 20px 0 10px;\n\t\t\t}\n\t\t}\n\n\t\t@media (max-width: ${(props) => props.theme.media.maxWidthMobile}) {\n\t\t\t.withdraw-form {\n\t\t\t\tmargin-bottom: 30px;\n\t\t\t}\n\t\t}\n\n\t\t@media (min-width: ${(props) => props.theme.media.minWidthSmallTablet}) {\n\t\t\t.slide-down__box {\n\t\t\t\tmargin-top: 50px;\n\t\t\t}\n\t\t}\n\t}\n`;\n","import { FC } from 'react';\nimport { IconProps } from '@icons/all-bets';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const ArrowLeft: FC = ({ fill, height, width, style }) => {\n\treturn (\n\t\t\n\t\t\t}\n\t\t\tstyle={style}\n\t\t\twidth={width || 16}\n\t\t\theight={height || 17}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const EditIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={12}\n\t\t\theight={12}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const MoreIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={4}\n\t\t\theight={15}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const PlusIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={12}\n\t\t\theight={12}\n\t\t/>\n\t);\n};\n","import { FC } from 'react';\nimport { IconProps } from '@icons/all-bets';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const RemoveIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={12}\n\t\t\theight={14}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const AddressBook: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={12}\n\t\t\theight={14}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const DepositIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={14}\n\t\t\theight={12}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const Vault: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={14}\n\t\t\theight={13}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\n\nexport const WithdrawIcon: FC = ({ fill }) => {\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={14}\n\t\t\theight={15}\n\t\t/>\n\t);\n};\n","import { FC } from 'react';\nimport { IconProps } from '@icons/all-bets';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\nimport { useId } from '../../hooks/useId';\n\nexport const AddWallet: FC = ({ fill }) => {\n\tconst { get } = useId({ id: 'add-wallet' });\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={36}\n\t\t\theight={42}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\nimport { useId } from '../../hooks/useId';\n\nexport const Verify2fa: FC = ({ fill }) => {\n\tconst { get } = useId({ id: 'wallet-verify-2fa' });\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={20}\n\t\t\theight={31}\n\t\t/>\n\t);\n};\n","import { IconProps } from '@icons/all-bets';\nimport { FC } from 'react';\nimport { Svg } from '@legacyApp/client/components/svg/Svg';\nimport { useId } from '../../hooks/useId';\n\nexport const VerifyEmail: FC = ({ fill }) => {\n\tconst { get } = useId({ id: 'wallet-verify-email' });\n\tconst color = fill || 'white';\n\treturn (\n\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\twidth={36}\n\t\t\theight={26}\n\t\t/>\n\t);\n};\n","import { shallowEqual } from 'react-redux';\nimport { useAppSelector } from '@legacyApp/hooks/store/useAppSelector';\n\nexport const useTwoFaIsActive = () =>\n\tuseAppSelector((state) => state.twoFA.isActive, shallowEqual);\n","import React, { FC } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useUserActiveCurrency } from '@common/selectors/user.selectors';\nimport { calcStyle } from '@legacyApp/client/modules/style/methods/calcStyle';\nimport { chatViewport } from '@legacyApp/client/modules/style/methods/chatViewport';\nimport { fontSize } from '@legacyApp/client/modules/style/mixins/fontSize';\nimport { BalancesArray } from '@legacyApp/types/balance/BalancesArray';\nimport { useSetCurrency } from '@modules/balance/hooks/useSetCurrency';\nimport { Size } from '@uiTypes/Size';\n\nimport { BalanceCurrencyValueSmallStyle } from '@common/components/number/balanceAmount/balanceCurrencyValue.style';\nimport { BalanceAmount } from '@common/components/number/balanceAmount';\nimport { CurrencySymbol } from '@legacyApp/client/components/currencySymbol/currencySymbol';\nimport { StyledBalanceCurrency } from '@modules/balance/styles/BalanceCurrency.styled';\nimport { StyledBalanceWrapper } from '@modules/balance/styles/BalanceWrapper.styled';\nimport { Dropdown, DropdownProps } from '@ui/dropdown';\n\nexport interface BalancesDropdownSelectorProps {\n\tlabel?: DropdownProps['label'];\n\tmaxHeight?: DropdownProps['maxHeight'];\n\tbalances: BalancesArray;\n}\n\nexport const BalancesDropdownSelector: FC = ({\n\tlabel,\n\tmaxHeight,\n\tbalances,\n}) => {\n\tconst setCurrency = useSetCurrency();\n\n\tconst currency = useUserActiveCurrency();\n\n\tconst activeBalance = balances.find(\n\t\t(balance) => balance.currency === currency,\n\t);\n\n\treturn (\n\t\t ({\n\t\t\t\tid: balance.currency,\n\t\t\t\tcontent: (\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t),\n\t\t\t}))}\n\t\t\tactiveContent={\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\t\n\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t}\n\t\t\tsize={Size.MEDIUM}\n\t\t\tdefaultActiveId={currency}\n\t\t\tonSelect={setCurrency}\n\t\t/>\n\t);\n};\n\nexport const StyledBalancesWrapperButton = styled(StyledBalanceWrapper)`\n\t${BalanceCurrencyValueSmallStyle} {\n\t\tposition: relative;\n\t\t${chatViewport(\n\t\t\t(viewportPadding) =>\n\t\t\t\tcss`\n\t\t\t\t\t${(props) =>\n\t\t\t\t\t\tfontSize({\n\t\t\t\t\t\t\tlabel: 'top',\n\t\t\t\t\t\t\tsize: '1px',\n\t\t\t\t\t\t\tsizeDesktop: '5px',\n\t\t\t\t\t\t\tminWidth: calcStyle({\n\t\t\t\t\t\t\t\ta: props.theme.media.minWidthDesktop,\n\t\t\t\t\t\t\t\tb: viewportPadding,\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\tsizeBigScreen: '3px',\n\t\t\t\t\t\t})};\n\t\t\t\t`,\n\t\t)};\n\t}\n`;\n\nexport const StyledBalancesWrapperInDropdown = styled(StyledBalanceWrapper)`\n\t${StyledBalanceCurrency} {\n\t\tpadding: 0;\n\t}\n`;\n","import { createContext } from 'react';\nimport { CurrencyType } from '@legacyApp/types/wallet/CurrencyType';\n\nexport interface BalanceContextProps {\n\tisListOpen: boolean;\n\tsetListOpen: (isOpen: boolean) => void;\n\tactiveCurrency: CurrencyType;\n\tsetCurrency: (currency: CurrencyType) => void;\n\ttoggleDropdown: (open?: boolean) => void;\n\tonlySelector: boolean;\n\tsource: string;\n\tcompact: boolean;\n\tshowHideZeroBalancesSwitch: boolean;\n}\n\nexport const BalanceContext = createContext({\n\tisListOpen: null,\n\tsetListOpen: null,\n\tactiveCurrency: null,\n\tsetCurrency: null,\n\ttoggleDropdown: null,\n\tonlySelector: null,\n\tsource: null,\n\tcompact: null,\n\tshowHideZeroBalancesSwitch: null,\n});\n","import { useCallback, useContext } from 'react';\nimport { useDispatch } from 'react-redux';\nimport { CurrencyType } from '@legacyApp/types/wallet/CurrencyType';\nimport { changeCurrency } from '@legacyApp/client/store/user/user.actions';\nimport { BalanceContext } from '../context/Balance.context';\n\nexport const useSetCurrency = () => {\n\tconst dispatch = useDispatch();\n\tconst { setCurrency } = useContext(BalanceContext);\n\n\treturn useCallback(\n\t\t(currency: CurrencyType) => {\n\t\t\tconsole.trace('useSetCurrency');\n\t\t\tconsole.log('useSetCurrency', { currency, setCurrency });\n\t\t\tif (typeof setCurrency === 'function') {\n\t\t\t\treturn setCurrency(currency);\n\t\t\t}\n\t\t\tdispatch(changeCurrency(currency));\n\t\t},\n\t\t[dispatch, setCurrency],\n\t);\n};\n","import styled, { css } from 'styled-components';\n\ninterface BalanceWrapperStyledProps {\n\tonlySelector?: boolean;\n}\n\nexport const StyledBalanceWrapper = styled.div.attrs(\n\t{\n\t\tclassName: 'balance--wrapper',\n\t},\n)`\n\tposition: relative;\n\t${(props) =>\n\t\tprops.onlySelector\n\t\t\t? css`\n\t\t\t\t\tmargin: 0 0 30px;\n\t\t\t\t\tz-index: 3;\n\t\t\t `\n\t\t\t: ''}\n`;\n","import { Form as FinalFormForm } from 'react-final-form';\n\nexport const Form: typeof FinalFormForm = (props) => {\n\treturn ;\n};\n","import { FC, useContext } from 'react';\nimport { Field } from 'react-final-form';\n// eslint-disable-next-line import/named\nimport { FieldValidator } from 'final-form';\n\nimport { FormApiErrorsContext } from '@modules/form/context/FormApiErrorsContext';\nimport { simpleTrans } from '@legacyApp/client/modules/translation/translationService';\nimport { TransNamespace } from '@legacyApp/client/modules/translation/TransNamespace';\nimport { useAddNamespace } from '@legacyApp/hooks/translation/useAddNamespace';\n\nimport { InputWrapperContainer } from '@legacyApp/client/components/input/inputWrapper.container';\n\nexport interface InputWrapperFieldProps {\n\tlabel?: string | JSX.Element;\n\tid: string;\n\tplaceholder?: string;\n\tvalidate?: FieldValidator;\n\ttype?: string;\n\tparseValue?: (value: string) => any;\n\tstep?: number;\n\tmaxLength?: number;\n\tprecision?: number;\n\tcomponentName?: string;\n\tdisabled?: boolean;\n\tclassName?: string;\n\twrapperClasses?: string;\n}\n\nexport type InputWrapperFieldType = FC;\n\nexport const InputWrapperField: InputWrapperFieldType = ({\n\tlabel,\n\tid,\n\tplaceholder,\n\tvalidate,\n\ttype,\n\tparseValue,\n\tstep,\n\tmaxLength,\n\tprecision,\n\tcomponentName,\n\tdisabled,\n\tclassName,\n\twrapperClasses,\n\t...props_\n}) => {\n\tconst { errors } = useContext(FormApiErrorsContext);\n\n\tuseAddNamespace({ namespace: TransNamespace.VALIDATION });\n\n\treturn (\n\t\t\n\t\t\t{(props) => {\n\t\t\t\tconst { input, meta } = props;\n\t\t\t\tconst canShowError = meta.submitFailed && !meta.valid;\n\t\t\t\tconst onChange = parseValue\n\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\tinput.onChange(parseValue(value));\n\t\t\t\t\t }\n\t\t\t\t\t: input.onChange;\n\t\t\t\tconst apiErrors = !meta.active ? errors : null;\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}}\n\t\t\n\t);\n};\n","import {\n\tFC,\n\tuseContext,\n\ttype ReactNode,\n\ttype Dispatch,\n\ttype SetStateAction,\n} from 'react';\nimport Select, { type StylesConfig } from 'react-select';\nimport { Field } from 'react-final-form';\nimport { createGlobalStyle } from 'styled-components';\nimport classnames from 'classnames';\n\nimport {\n\ttheme as mainTheme,\n\tThemeType,\n} from '@legacyApp/client/modules/style/theme';\nimport { inputHeight } from '@legacyApp/client/modules/style/defaults';\nimport { trans } from '@legacyApp/client/modules/translation/translate';\nimport { simpleTrans } from '@legacyApp/client/modules/translation/translationService';\nimport { TransNamespace } from '@legacyApp/client/modules/translation/TransNamespace';\nimport { useAddNamespace } from '@legacyApp/hooks/translation/useAddNamespace';\nimport { FormApiErrorsContext } from '@modules/form/context/FormApiErrorsContext';\n\nimport { InputWrapperStyle } from '@legacyApp/client/components/input/styled/inputWrapper.style';\nimport { InputLabelStyle } from '@legacyApp/client/components/input/styled/inputLabelStyle';\nimport { Tooltip } from '@legacyApp/client/components/tooltip';\nimport { AsyncFunction } from 'type-fest/source/async-return-type';\n\nexport interface Option {\n\tvalue: string;\n\tlabel: string;\n\tkey: string;\n\ticon?: string | ReactNode;\n}\n\nexport interface SelectFieldProps {\n\tid: string;\n\tlabel?: any;\n\toptions: Option[];\n\tplaceholder?: string;\n\tcomponentName?: string;\n\tclassNames?: Record;\n\tcomponents?: Record;\n\tonChange?: Function;\n\tinputValue?: string;\n\tisSearchable?: boolean;\n\tonMenuInputFocus?: Function;\n\tonInputChange?: Dispatch>;\n\tonErrorIcon?: Function;\n\tcloseMenuOnScroll?: boolean | ((event: Event) => boolean);\n\tonChangePromise?: AsyncFunction;\n}\n\nexport const REACT_SELECT_CLASS_PREFIX = 'react-select';\n\nconst selectTheme = (theme: any) => ({\n\t...theme,\n\tborderRadius: mainTheme.layout.borderRadius,\n\tcolors: {\n\t\t...theme.colors,\n\t},\n});\n\nconst selectStyles: StylesConfig = {\n\tcontrol: (styles, { isFocused, isDisabled }) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tborderWidth: 0,\n\t\t\tborderColor: 'transparent',\n\t\t\tboxShadow: 'none',\n\t\t\tcolor: isDisabled\n\t\t\t\t? mainTheme.ui.colors['dark-200']\n\t\t\t\t: mainTheme.ui.colors['white'],\n\t\t\tbackgroundColor: isDisabled\n\t\t\t\t? mainTheme.colors.inputBackgroundDisabled\n\t\t\t\t: isFocused\n\t\t\t\t? mainTheme.ui.colors['dark-400']\n\t\t\t\t: mainTheme.ui.colors['dark-400'],\n\t\t};\n\t},\n\n\toption: (styles, { isDisabled, isFocused, isSelected }) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tbackgroundColor: isFocused\n\t\t\t\t? mainTheme.ui.colors['dark-400']\n\t\t\t\t: isSelected\n\t\t\t\t? mainTheme.ui.colors['dark-300']\n\t\t\t\t: isDisabled\n\t\t\t\t? mainTheme.ui.colors['dark-600']\n\t\t\t\t: 'transparent',\n\t\t\tcolor: '#FFF',\n\t\t\tcursor: isDisabled ? 'not-allowed' : 'default',\n\t\t};\n\t},\n\n\tmenu: (styles) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tbackgroundColor: mainTheme.ui.colors['dark-500'],\n\t\t};\n\t},\n\n\tinput: (styles) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tcolor: 'white',\n\t\t};\n\t},\n\n\tvalueContainer: (styles) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tpadding: null,\n\t\t\tpaddingTop: 0,\n\t\t\tpaddingBottom: 0,\n\t\t\tpaddingLeft: 10,\n\t\t};\n\t},\n\n\tsingleValue: (styles) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tcolor: 'white',\n\t\t};\n\t},\n\n\tplaceholder: (styles) => {\n\t\treturn {\n\t\t\t...styles,\n\t\t\tcolor: mainTheme.ui.colors['dark-300'],\n\t\t};\n\t},\n};\n\nexport const StyledSelectGlobal = createGlobalStyle<{ theme: ThemeType }>`\n\t${`.${REACT_SELECT_CLASS_PREFIX}`} {\n\t\t&__menu-portal {\n\t\t\tz-index: 200!important;\n\t\t}\n\n\t\t&__value-container {\n\t\t\t${inputHeight};\n\t\t}\n\t}\n`;\n\nexport const SelectField: FC = ({\n\tid,\n\toptions,\n\tlabel,\n\tplaceholder,\n\tcomponentName,\n\tclassNames,\n\tcomponents,\n\t...props\n}) => {\n\tconst { errors } = useContext(FormApiErrorsContext);\n\n\tuseAddNamespace({ namespace: TransNamespace.VALIDATION });\n\n\treturn (\n\t\t\n\t\t\t{!!label && {label}}\n\t\t\t\n\t\t\t\t{({ input, ...rest }) => {\n\t\t\t\t\tconst { meta } = rest;\n\n\t\t\t\t\tconst apiErrors = !meta.active ? errors : null;\n\n\t\t\t\t\tconst canShowError = meta.submitFailed && !meta.valid;\n\n\t\t\t\t\tconst message =\n\t\t\t\t\t\tcanShowError && typeof meta.error === 'string'\n\t\t\t\t\t\t\t? simpleTrans(meta.error, undefined, TransNamespace.VALIDATION)\n\t\t\t\t\t\t\t: apiErrors?.[input.name];\n\n\t\t\t\t\tconst onChange = (value) => {\n\t\t\t\t\t\tif (props.onChangePromise) {\n\t\t\t\t\t\t\treturn props.onChangePromise(value).then((result) => {\n\t\t\t\t\t\t\t\tif (result) {\n\t\t\t\t\t\t\t\t\tinput.onChange(value);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\tif (props.onChange) {\n\t\t\t\t\t\t\t\t\tprops.onChange(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tinput.onChange(value);\n\n\t\t\t\t\t\tif (props.onChange) {\n\t\t\t\t\t\t\tprops.onChange(value);\n\t\t\t\t\t\t}\n\t\t\t\t\t};\n\n\t\t\t\t\treturn componentName === 'PersonalDataForm' ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t{canShowError && (\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t{trans({\n\t\t\t\t\t\t\t\t\t\tlabel: message,\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\n\n\t\t\t\t\t\t\t\t null,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t{...props}\n\t\t\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t\n\t\t\n\t);\n};\n","import { createContext } from 'react';\n\nexport const FormApiErrorsContext = createContext<{\n\terrors: Record>;\n}>({\n\terrors: null,\n});\n","import { setIn } from 'final-form';\n\n// To be passed to React Final Form\nexport const validateFormValues = (schema) => (values) => {\n\t// console.log({ schema, values });\n\tif (typeof schema === 'function') {\n\t\tschema = schema();\n\t}\n\treturn schema\n\t\t.validate(values, { abortEarly: false })\n\t\t.then(() => false)\n\t\t.catch((error) => {\n\t\t\treturn error.inner.reduce((formError, innerError) => {\n\t\t\t\treturn setIn(formError, innerError.path, innerError.message);\n\t\t\t}, {});\n\t\t\t// console.log({ error, errors });\n\t\t\t// return errors;\n\t\t});\n};\n","import { createContext } from 'react';\n\ntype PropsType = Record;\n\nexport const ModalSubPageContext = createContext<{\n\topen: (id: string, props?: Record) => void;\n\tclose: () => void;\n\tprops?: PropsType;\n}>({\n\topen: null,\n\tprops: {},\n\tclose: null,\n});\n","import React, {\n\tFC,\n\tPropsWithChildren,\n\tReactNode,\n\tuseCallback,\n\tuseState,\n} from 'react';\nimport { Button } from '@ui/button';\nimport styled, { css } from 'styled-components';\nimport { ArrowLeft } from '@icons/ui/arrow-left';\nimport { useTimeout } from '@legacyApp/hooks/app/useTimeout';\nimport { ButtonStyleType } from '@uiTypes/ButtonStyleType';\nimport { Size } from '@uiTypes/Size';\nimport { useAppDispatch } from '@legacyApp/hooks/store/useAppDispatch';\nimport { second } from '@legacyApp/client/modules/app/time';\nimport { useModalProps } from '@modules/modals/store/modal.selectors';\nimport { modalSetPropsWithoutLsUpdate } from '@modules/modals/store/modal.actions';\nimport {\n\tModalTitle,\n\tStyledModalTitle,\n} from '@modules/modals/components/UI/ModalTitle';\nimport { ModalSubPageContext } from '@modules/modals/components/ModalSubPage/ModalSubPage.context';\n\nexport interface ModalSubPageProps {\n\tconfig: Record<\n\t\tstring,\n\t\t{\n\t\t\tcontent: string | ReactNode;\n\t\t\ttitle: string | ReactNode;\n\t\t\twidth?: string;\n\t\t}\n\t>;\n}\n\nexport const ModalSubPage: FC> = ({\n\tchildren,\n\tconfig,\n}) => {\n\tconst dispatch = useAppDispatch();\n\tconst modalProps = useModalProps();\n\n\tconst [activeId, setActiveId] = useState(null);\n\tconst [content, setContent] = useState(null);\n\tconst [title, setTitle] = useState(null);\n\tconst [props, setProps] = useState({});\n\n\tconst { setTimeout } = useTimeout();\n\n\tconst open = useCallback(\n\t\t(id: string, props?: Record) => {\n\t\t\tif (id !== activeId && id && config?.[id]?.content) {\n\t\t\t\tif (props) {\n\t\t\t\t\tsetProps(props);\n\t\t\t\t}\n\t\t\t\tconst _config = config?.[id];\n\t\t\t\tsetTitle(_config?.title);\n\t\t\t\tsetActiveId(id);\n\t\t\t\tif (_config?.width) {\n\t\t\t\t\tdispatch(\n\t\t\t\t\t\t// WOL-4471 - setting width to the LS produces wrong width for the parent modal when user refresh the page\n\t\t\t\t\t\tmodalSetPropsWithoutLsUpdate({\n\t\t\t\t\t\t\t...modalProps,\n\t\t\t\t\t\t\twidth: _config?.width,\n\t\t\t\t\t\t}),\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tsetContent(_config?.content);\n\t\t\t}\n\t\t},\n\t\t[activeId, config, dispatch, modalProps],\n\t);\n\n\tconst close = useCallback(() => {\n\t\tif (activeId) {\n\t\t\tconst _activeId = activeId;\n\t\t\tsetActiveId(null);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetContent(null);\n\t\t\t\tsetTitle(null);\n\t\t\t\tif (config?.[_activeId]?.width) {\n\t\t\t\t\tdispatch(\n\t\t\t\t\t\tmodalSetPropsWithoutLsUpdate({\n\t\t\t\t\t\t\t...modalProps,\n\t\t\t\t\t\t\twidth: undefined,\n\t\t\t\t\t\t}),\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tsetProps({});\n\t\t\t}, 0.4 * second);\n\t\t}\n\t}, [activeId, config, dispatch, modalProps, setTimeout]);\n\n\treturn (\n\t\t\n\t\t\t\n\t\t\t\t{content && (\n\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t\n\t\t\t\t)}\n\t\t\t\t\n\t\t\t\t\t{content || null}\n\t\t\t\t\n\t\t\t\n\n\t\t\t{!content &&
{children}
}\n\t\t\n\t);\n};\n\nexport const StyledSubPageContentBox = styled.div<{\n\t$isOpen: boolean;\n}>`\n\tpointer-events: none;\n\tposition: relative;\n\ttop: 0;\n\ttransform: translateX(-100%);\n\ttransition: 500ms;\n\n\t${(props) =>\n\t\tprops.$isOpen\n\t\t\t? css`\n\t\t\t\t\tpointer-events: unset;\n\t\t\t\t\ttransform: translateX(0);\n\t\t\t `\n\t\t\t: null};\n`;\n\nexport const StyledSubPageBox = styled.div<{\n\t$isOpen: boolean;\n}>`\n\tposition: relative;\n\n\t${(props) =>\n\t\t!props.$isOpen\n\t\t\t? css`\n\t\t\t\t\tpointer-events: none;\n\t\t\t\t\ttop: 0;\n\t\t\t `\n\t\t\t: null}\n\n\t${StyledModalTitle} {\n\t\talign-items: center;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tgap: 16px;\n\t\tjustify-content: flex-start;\n\t}\n`;\n","import React, { FC, PropsWithChildren } from 'react';\nimport styled from 'styled-components';\n\nexport const ModalTitle: FC> = ({ children }) => {\n\treturn (\n\t\t\n\t\t\t{children}\n\t\t\n\t);\n};\n\nexport const StyledModalTitle = styled.h5`\n\tborder-bottom: 1px solid var(--color-dark-600);\n\tmargin-bottom: 24px;\n\tmargin-top: unset;\n\tpadding-bottom: 24px;\n\ttext-transform: uppercase;\n\twidth: 100%;\n`;\n\nexport const ModalSpaceBetweenTitle = styled.div`\n\t${StyledModalTitle} {\n\t\talign-items: center;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tgap: 16px;\n\t\tjustify-content: space-between;\n\t}\n`;\n","import {\n\tcss,\n\t// eslint-disable-next-line import/named\n\tFlattenInterpolation,\n\t// eslint-disable-next-line import/named\n\tThemedStyledProps,\n} from 'styled-components';\n\nexport const MarginContainerSpacing = (\n\tcallback: (\n\t\ttop: number,\n\t\tright: number,\n\t\tbottom?: number,\n\t\tleft?: number,\n\t) => FlattenInterpolation>,\n) => {\n\treturn css`\n\t\t${callback(24, 24, 32, 24)};\n\n\t\t@media (max-width: ${(props) => props.theme.media_v2.max_tablet_small}) {\n\t\t\t${callback(12, 12, 16, 12)};\n\t\t}\n\t`;\n};\n","import { generateUrl, ROUTE } from '@common/routes';\nimport { FetchProps } from '@legacyApp/hooks/fetch/useFetchApi';\nimport { apiConfig } from '@server/config/api.config';\n\nexport const generatePayUrl = (\n\tmethod: FetchProps['method'],\n\troute: ROUTE,\n\toptions?: {},\n) => {\n\treturn method === 'GET'\n\t\t? `${apiConfig.payUrl}${generateUrl(route, options)}`\n\t\t: generateUrl(route, options);\n};\n","import { FC } from 'react';\nimport { components, type OptionProps } from 'react-select';\n\nimport { Image } from '@common/components/default/Image/Image';\nimport { Option as IOption } from '@modules/form/components/SelectField';\nimport { CustomSelectProps } from '@modules/form/components/SelectFieldWithSearchInside';\n\nconst { Option } = components;\n\nconst OptionWithIcon: FC> = (props) => {\n\tconst { onErrorIcon } = props.selectProps as CustomSelectProps;\n\n\treturn (\n\t\t\n\t);\n};\n\nexport { OptionWithIcon };\n","import { FC } from 'react';\nimport { components, type SingleValueProps } from 'react-select';\n\nimport { Image } from '@common/components/default/Image/Image';\nimport { CustomSelectProps } from '@modules/form/components/SelectFieldWithSearchInside';\n\nconst { SingleValue } = components;\n\nexport type SingleValueItem = {\n\tlabel: string;\n\tvalue: string;\n\ticon: string;\n};\n\nexport type SingleValueWithIconProps = SingleValueProps;\n\nconst SingleValueWithIcon: FC = (props) => {\n\tconst { onErrorIcon } = props.selectProps as CustomSelectProps;\n\n\treturn (\n\t\t\n\t\t\t
\n\t\t\t\t{typeof props.data.icon === 'string' ? (\n\t\t\t\t\t\n\t\t\t\t) : (\n\t\t\t\t\tprops.data.icon\n\t\t\t\t)}\n\t\t\t
\n\n\t\t\t{props.data.label}\n\t\t\n\t);\n};\n\nexport { SingleValueWithIcon };\n","export enum FormFieldNames {\n\tCURRENCY_FIAT = 'currency_fiat',\n\tCURRENCY_TOKEN = 'currency_token',\n\tFROM_AMOUNT = 'from_amount',\n\tAGREEMENT = 'agreement',\n\tSELECTED_OFFER = 'selected_offer',\n}\n","import classNames from 'classnames';\nimport { FC } from 'react';\nimport { useField } from 'react-final-form';\n\nimport { TransWallet } from '@modules/wallet/wallet/WalletsLayout/WalletsLayout';\nimport { ProviderCash } from '@modules/wallet/hooks/useProvidersCash';\nimport { DepositOfferCash } from '@modules/wallet/hooks/useDepositOfferCash';\n\nimport styles from '@modules/wallet/wallet/BuyCrypto/ProviderTile.module.scss';\nimport { FormFieldNames } from '@modules/wallet/wallet/BuyCrypto/constants/FormFieldNames';\nimport { FormValues } from '@modules/wallet/wallet/BuyCrypto/constants/FormValues';\n\ninterface ProviderTileProps {\n\toffer: DepositOfferCash;\n\tclassName?: string;\n\tlist?: ProviderCash[];\n\tdisabled?: boolean;\n}\n\nconst ProviderTile: FC = ({\n\toffer,\n\tlist,\n\tclassName,\n\tdisabled,\n}) => {\n\tconst provider_ = list?.find((item) => item.code === offer.provider);\n\n\tconst toCurrency = useField(\n\t\tFormFieldNames.CURRENCY_TOKEN,\n\t);\n\tconst selectedOffer = useField(\n\t\tFormFieldNames.SELECTED_OFFER,\n\t);\n\n\tconst selected = selectedOffer.input.value === offer.provider;\n\n\treturn (\n\t\t {\n\t\t\t\tselectedOffer.input.onChange(offer.provider);\n\t\t\t}}\n\t\t>\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t{provider_?.name || 'Loading...'}\n\t\t\t\t
\n\t\t\t
\n\n\t\t\t
\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\n\t\t\t\t{offer.toAmount && (\n\t\t\t\t\t\n\t\t\t\t\t\t~ {offer.toAmount}{' '}\n\t\t\t\t\t\t{toCurrency.input?.value?.value.toUpperCase()}\n\t\t\t\t\t\n\t\t\t\t)}\n\t\t\t
\n\t\t\n\t);\n};\n\nconst CSSClassNameProviderTile = 'provider-tile';\n\nexport { ProviderTile, CSSClassNameProviderTile };\n","import { useField } from 'react-final-form';\nimport { FC, useEffect } from 'react';\n\nimport { TransWallet } from '@modules/wallet/wallet/WalletsLayout/WalletsLayout';\nimport { DepositOfferCashReturnType } from '@modules/wallet/hooks/useDepositOfferCash';\nimport { Loader } from '@legacyApp/client/components/loader/loader';\nimport { ProviderTile } from '@modules/wallet/wallet/BuyCrypto/ProviderTile';\nimport { ProviderCash } from '@modules/wallet/hooks/useProvidersCash';\nimport { FormFieldNames } from '@modules/wallet/wallet/BuyCrypto/constants/FormFieldNames';\nimport { FormValues } from '@modules/wallet/wallet/BuyCrypto/constants/FormValues';\nimport { usePrevious } from '@legacyApp/hooks/render/usePrevious';\nimport transactionService from '@modules/transactions/transactionsService';\n\nexport const BuyCryptoOffers: FC<{\n\tlist: ProviderCash[];\n\tdisabled: boolean;\n\toffers: DepositOfferCashReturnType;\n}> = ({ list, disabled, offers: { list: offers, loaded, loading } }) => {\n\tconst offersSorted = offers?.sort(\n\t\t(a, b) => Number(b.toAmount) - Number(a.toAmount),\n\t);\n\tconst prevOffers = usePrevious(offers);\n\n\tconst selectedOffer = useField(\n\t\tFormFieldNames.SELECTED_OFFER,\n\t);\n\n\tuseEffect(() => {\n\t\tif (!transactionService.isListDifferent(offers, prevOffers, ['provider'])) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst bestOffer = offers?.length\n\t\t\t? offers.reduce((prev, curr) =>\n\t\t\t\t\tNumber(prev.toAmount) > Number(curr.toAmount) ? prev : curr,\n\t\t\t )\n\t\t\t: null;\n\n\t\tif (\n\t\t\tbestOffer &&\n\t\t\t(!selectedOffer?.input?.value ||\n\t\t\t\tbestOffer?.provider !== selectedOffer?.input?.value)\n\t\t) {\n\t\t\tselectedOffer.input.onChange(bestOffer.provider);\n\t\t}\n\t}, [offers, prevOffers, selectedOffer.input]);\n\n\treturn (\n\t\t
.provider-tile:not(:last-child)]:mb-3\">\n\t\t\t
\n\t\t\t\t\n\t\t\t
\n\n\t\t\t{(loading || !loaded) && (\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t
\n\t\t\t)}\n\n\t\t\t{!loading && offers.length === 0 && (\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t
\n\t\t\t)}\n\n\t\t\t{!loading &&\n\t\t\t\toffersSorted.map((offer) => (\n\t\t\t\t\t\n\t\t\t\t))}\n\t\t
\n\t);\n};\n","import { FC, useContext } from 'react';\nimport { Field } from 'react-final-form';\nimport { type FieldValidator } from 'final-form';\n\nimport { FormApiErrorsContext } from '@modules/form/context/FormApiErrorsContext';\nimport { TransNamespace } from '@legacyApp/client/modules/translation/TransNamespace';\nimport { useAddNamespace } from '@legacyApp/hooks/translation/useAddNamespace';\nimport { Checkbox } from '@legacyApp/client/components/checkbox';\n\nexport interface CheckboxFieldProps {\n\tlabel?: string | JSX.Element;\n\tid: string;\n\tvalidate?: FieldValidator;\n\tparseValue?: (value: string) => any;\n\tcomponentName?: string;\n\tdisabled?: boolean;\n\tclassName?: string;\n}\n\nexport const CheckboxField: FC = ({\n\tlabel,\n\tid,\n\tvalidate,\n\tparseValue,\n\tcomponentName,\n\tdisabled,\n\tclassName,\n}) => {\n\tconst { errors } = useContext(FormApiErrorsContext);\n\n\tuseAddNamespace({ namespace: TransNamespace.VALIDATION });\n\n\treturn (\n\t\t\n\t\t\t{(props) => {\n\t\t\t\tconst { input, meta } = props;\n\t\t\t\tconst canShowError = meta.submitFailed && !meta.valid;\n\t\t\t\tconst onChange = parseValue\n\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\tinput.onChange(parseValue(value));\n\t\t\t\t\t }\n\t\t\t\t\t: input.onChange;\n\t\t\t\tconst apiErrors = !meta.active ? errors : null;\n\n\t\t\t\treturn (\n\t\t\t\t\t\n\t\t\t\t);\n\t\t\t}}\n\t\t\n\t);\n};\n","import { FC } from 'react';\n\nimport { TransWallet } from '@modules/wallet/wallet/WalletsLayout/WalletsLayout';\n\nexport const BuyCryptoTooltipContent: FC<{\n\tprovider: string;\n}> = ({ provider }) => (\n\t\n);\n","import { FC, useState } from 'react';\nimport { type Props } from 'react-select';\n\nimport {\n\tSelectField,\n\tSelectFieldProps,\n} from '@modules/form/components/SelectField';\nimport { ClickOutsideWrapper } from '@legacyApp/client/components/clickOutSideWrapper';\n\nexport interface CustomSelectProps extends Props {\n\tonErrorIcon: () => void;\n}\n\nexport const SelectFieldWithSearchInside: FC = (props) => {\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [inputValue, setInputValue] = useState('');\n\n\tconst onClickOutside = (e: Event) => {\n\t\tif (\n\t\t\t(e.target as HTMLElement).nodeName === 'INPUT' ||\n\t\t\t(e.target as HTMLElement).classList?.contains('react-select__option')\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsFocused(false);\n\t\tsetInputValue('');\n\t};\n\n\treturn (\n\t\t\n\t\t\t setIsFocused(true)}\n\t\t\t\tonChange={() => {\n\t\t\t\t\tsetIsFocused(false);\n\t\t\t\t}}\n\t\t\t\tonInputChange={setInputValue}\n\t\t\t\t{...{\n\t\t\t\t\tmenuIsOpen: isFocused || undefined,\n\t\t\t\t\tisFocused: isFocused || undefined,\n\t\t\t\t}}\n\t\t\t/>\n\t\t\n\t);\n};\n","import { FC } from 'react';\nimport { components, type Props, type MenuListProps } from 'react-select';\n\nimport { InputStyle } from '@legacyApp/client/components/input/styled/input.style';\nimport { simpleTrans } from '@legacyApp/client/modules/translation/translationService';\n\nconst { MenuList } = components;\n\ninterface CustomSelectProps extends Props {\n\tonMenuInputFocus: () => void;\n}\n\nexport const CustomMenuList: FC = ({\n\tselectProps,\n\t...props\n}) => {\n\tconst { onInputChange, inputValue, onMenuInputFocus } =\n\t\tselectProps as CustomSelectProps;\n\n\treturn (\n\t\t
\n\t\t\t\n\t\t\t\t\tonInputChange(e.currentTarget.value, {\n\t\t\t\t\t\taction: 'input-change',\n\t\t\t\t\t\tprevInputValue: inputValue,\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t\tonMouseDown={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t(e.target as HTMLInputElement).focus();\n\t\t\t\t}}\n\t\t\t\tonTouchEnd={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t(e.target as HTMLInputElement).focus();\n\t\t\t\t}}\n\t\t\t\tonFocus={onMenuInputFocus}\n\t\t\t\tplaceholder={simpleTrans('Search...')}\n\t\t\t/>\n\n\t\t\t\n\t\t
\n\t);\n};\n","import { Children, FC } from 'react';\nimport {\n\tcomponents,\n\ttype PlaceholderProps,\n\ttype ValueContainerProps,\n} from 'react-select';\nimport {\n\tSingleValueItem,\n\tSingleValueWithIcon,\n\tSingleValueWithIconProps,\n} from './SingleValueWithIcon';\n\nconst { ValueContainer, Placeholder } = components;\n\nexport const CustomValueContainerWithIcon: FC = ({\n\tchildren,\n\tselectProps,\n\t...props\n}) => {\n\tconst props_ = {\n\t\t...props,\n\t\tselectProps,\n\t};\n\n\treturn (\n\t\t\n\t\t\t{Children.map(children, (child) =>\n\t\t\t\tchild ? (\n\t\t\t\t\tchild\n\t\t\t\t) : props.hasValue ? (\n\t\t\t\t\t\n\t\t\t\t\t\t{selectProps.getOptionLabel(props.getValue()[0])}\n\t\t\t\t\t\n\t\t\t\t) : (\n\t\t\t\t\t\n\t\t\t\t\t\t{selectProps.placeholder}\n\t\t\t\t\t\n\t\t\t\t),\n\t\t\t)}\n\t\t\n\t);\n};\n","import { FC, useEffect, useState } from 'react';\nimport * as ReactFinalForm from 'react-final-form';\nimport { useDebouncedValue } from 'rooks';\n\nimport { TransWallet } from '@modules/wallet/wallet/WalletsLayout/WalletsLayout';\nimport { Option } from '@modules/form/components/SelectField';\nimport { OptionWithIcon } from '@modules/form/components/OptionWithIcon';\nimport { SingleValueWithIcon } from '@modules/form/components/SingleValueWithIcon';\nimport { InputWrapperField } from '@modules/form/components/InputWrapperField';\nimport { Button } from '@ui/button';\nimport { Size } from '@uiTypes/Size';\nimport { COMPONENT_NAME } from '@modules/wallet/wallet/BuyCrypto/BuyCrypto';\nimport { BuyCryptoOffers } from '@modules/wallet/wallet/BuyCrypto/BuyCryptoOffers';\nimport { useProvidersCash } from '@modules/wallet/hooks/useProvidersCash';\nimport { CheckboxField } from '@modules/form/components/CheckboxField';\nimport { InfoIcon } from '@common/icons/ui/info-icon';\nimport Tooltip from '@legacyApp/client/components/tooltip/tooltip';\nimport { BuyCryptoTooltipContent } from '@modules/wallet/wallet/BuyCrypto/BuyCryptoTooltipContent';\nimport { SelectFieldWithSearchInside } from '@modules/form/components/SelectFieldWithSearchInside';\nimport { CustomMenuList } from '@modules/form/components/CustomMenuList';\nimport { CustomValueContainerWithIcon } from '@modules/form/components/CustomValueContainerWithIcon';\nimport { AuthActionButton } from '@common/components/auth/AuthActionButton';\nimport { simpleTrans } from '@legacyApp/client/modules/translation/translationService';\nimport { useDepositOfferCash } from '@modules/wallet/hooks/useDepositOfferCash';\n\nimport styles from '@modules/wallet/wallet/BuyCrypto/BuyCrypto.module.scss';\nimport { FormFieldNames } from '@modules/wallet/wallet/BuyCrypto/constants/FormFieldNames';\nimport { FormValues } from '@modules/wallet/wallet/BuyCrypto/constants/FormValues';\nimport { roundNumber } from '@common/methods/roundNumber/roundNumber';\n\ninterface BuyCryptoFormProps {\n\tformProps: ReactFinalForm.FormRenderProps;\n\tcurrencies: Array