UNPKG

@particle-network/connectkit

Version:
8 lines (7 loc) 6.75 kB
{ "version": 3, "sources": ["../../src/pages/walletconnect/styles.ts", "../../src/pages/walletconnect/index.tsx"], "sourcesContent": ["import { motion } from 'framer-motion';\nimport { styled } from 'styled-components';\n\nexport const Wrapper = styled(motion.div)`\n padding: 15px 30px;\n padding-top: 30px;\n padding-top: 0;\n display: flex;\n flex-direction: column;\n`;\n\nexport const Header = styled(motion.div)`\n text-align: center;\n font-size: 18px;\n line-height: 25px;\n font-weight: 500;\n margin-bottom: 30px;\n`;\n\nexport const Actions = styled(motion.div)`\n display: flex;\n justify-content: space-between;\n gap: 28px;\n margin-top: 20px;\n\n button {\n border-radius: var(--pcm-rounded-lg);\n border: 1px solid var(--pcm-button-border-color);\n background-color: var(--pcm-body-background) !important;\n color: var(--pcm-body-background);\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n height: 36px;\n display: flex;\n justify-content: center;\n align-items: center;\n color: var(--pcm-body-color-secondary);\n\n &:hover {\n background-color: #fff;\n }\n }\n`;\n\nexport const Description = styled.div`\n margin-top: 28px;\n padding: 0 16px;\n color: var(--pcm-body-color-secondary);\n text-align: center;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 16px;\n`;\n", "import { useEffect, useMemo } from 'react';\nimport { RoutePath } from '..';\nimport ShareIcon from '../../assets/icons/ShareIcon';\nimport CustomQRCode from '../../components/CustomQRCode';\nimport Button from '../../components/button';\nimport CopyToClipboard from '../../components/copyToClipboard';\nimport { FlexCenter, PageContent } from '../../components/modal/styles';\nimport { useContext } from '../../context';\nimport { useAccount } from '../../hooks/useAccount';\nimport useIsMobile from '../../hooks/useIsMobile';\nimport useLocales from '../../hooks/useLocales';\nimport { useRouter } from '../../hooks/useRouter';\nimport { useWalletConnectUri } from '../../hooks/useWalletConnectUri';\nimport { type WalletProps } from '../../hooks/useWalletsProps';\nimport { Actions, Description, Wrapper } from './styles';\n\nconst Page = ({ wallet }: { wallet: WalletProps }) => {\n const { navigate } = useRouter();\n const locales = useLocales();\n const mobile = useIsMobile();\n const { uri: walletConnectUri = '', requestUri, error } = useWalletConnectUri(wallet?.connector?.id);\n const { config } = useContext();\n const { isConnected } = useAccount();\n\n useEffect(() => {\n requestUri();\n }, []);\n\n useEffect(() => {\n return () => {\n // connect status -> connected / disconnected\n if (!isConnected) {\n config.setState((x) => ({\n ...x,\n // Keep existing connector connected in case of error\n status: x.current ? 'connected' : 'disconnected',\n }));\n }\n };\n }, [isConnected]);\n\n const visiableWalletButton = useMemo(() => {\n if (mobile || wallet?.id === 'walletConnect') {\n return false;\n } else {\n return true;\n }\n }, [wallet, mobile]);\n\n return (\n <PageContent style={{ marginTop: 0 }}>\n <Wrapper>\n <CustomQRCode\n value={\n walletConnectUri && wallet.getWalletConnectDeeplink\n ? wallet.getWalletConnectDeeplink(walletConnectUri)\n : walletConnectUri\n }\n failed={!!error}\n failedCallback={() => {\n requestUri();\n }}\n image={wallet?.icon}\n />\n {!!walletConnectUri && (\n <Actions>\n <CopyToClipboard variant='button' string={walletConnectUri}>\n {locales.copyQRURI}\n </CopyToClipboard>\n\n {visiableWalletButton && (\n <Button\n style={{\n background: 'none',\n borderColor: 'var(--pcm-button-border-color)',\n }}\n onClick={() => {\n navigate(RoutePath.DownloadApp, { wallet });\n }}\n >\n <FlexCenter\n gap={8}\n style={{\n color: 'var(--pcm-body-color-secondary)',\n }}\n >\n <ShareIcon />\n {locales.getWallet}\n </FlexCenter>\n </Button>\n )}\n </Actions>\n )}\n\n <Description>{locales.scanQRCode}</Description>\n </Wrapper>\n </PageContent>\n );\n};\n\nexport default Page;\n"], "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,cAAc;AACvB,SAAS,cAAc;AADvB,IAGa,SAQA,QAQA,SA0BA;AA7Cb,IAAAA,eAAA;AAAA;AAAA;AAGO,IAAM,UAAU,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQjC,IAAM,SAAS,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQhC,IAAM,UAAU,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BjC,IAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;AC7ClC,SAAS,WAAW,eAAe;AAoD3B,cA4BQ,YA5BR;AApDR,IAgBM,MAoFC;AApGP;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,IAAAC;AAEA,IAAM,OAAO,CAAC,EAAE,OAAO,MAA+B;AACpD,YAAM,EAAE,SAAS,IAAI,UAAU;AAC/B,YAAM,UAAU,WAAW;AAC3B,YAAM,SAAS,YAAY;AAC3B,YAAM,EAAE,KAAK,mBAAmB,IAAI,YAAY,MAAM,IAAI,oBAAoB,QAAQ,WAAW,EAAE;AACnG,YAAM,EAAE,OAAO,IAAI,WAAW;AAC9B,YAAM,EAAE,YAAY,IAAI,WAAW;AAEnC,gBAAU,MAAM;AACd,mBAAW;AAAA,MACb,GAAG,CAAC,CAAC;AAEL,gBAAU,MAAM;AACd,eAAO,MAAM;AAEX,cAAI,CAAC,aAAa;AAChB,mBAAO,SAAS,CAAC,OAAO;AAAA,cACtB,GAAG;AAAA,cAEH,QAAQ,EAAE,UAAU,cAAc;AAAA,YACpC,EAAE;AAAA,UACJ;AAAA,QACF;AAAA,MACF,GAAG,CAAC,WAAW,CAAC;AAEhB,YAAM,uBAAuB,QAAQ,MAAM;AACzC,YAAI,UAAU,QAAQ,OAAO,iBAAiB;AAC5C,iBAAO;AAAA,QACT,OAAO;AACL,iBAAO;AAAA,QACT;AAAA,MACF,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,aACE,oBAAC,eAAY,OAAO,EAAE,WAAW,EAAE,GACjC,+BAAC,WACC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OACE,oBAAoB,OAAO,2BACvB,OAAO,yBAAyB,gBAAgB,IAChD;AAAA,YAEN,QAAQ,CAAC,CAAC;AAAA,YACV,gBAAgB,MAAM;AACpB,yBAAW;AAAA,YACb;AAAA,YACA,OAAO,QAAQ;AAAA;AAAA,QACjB;AAAA,QACC,CAAC,CAAC,oBACD,qBAAC,WACC;AAAA,8BAAC,2BAAgB,SAAQ,UAAS,QAAQ,kBACvC,kBAAQ,WACX;AAAA,UAEC,wBACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,gBACL,YAAY;AAAA,gBACZ,aAAa;AAAA,cACf;AAAA,cACA,SAAS,MAAM;AACb,2DAAgC,EAAE,OAAO,CAAC;AAAA,cAC5C;AAAA,cAEA;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK;AAAA,kBACL,OAAO;AAAA,oBACL,OAAO;AAAA,kBACT;AAAA,kBAEA;AAAA,wCAAC,qBAAU;AAAA,oBACV,QAAQ;AAAA;AAAA;AAAA,cACX;AAAA;AAAA,UACF;AAAA,WAEJ;AAAA,QAGF,oBAAC,eAAa,kBAAQ,YAAW;AAAA,SACnC,GACF;AAAA,IAEJ;AAEA,IAAO,wBAAQ;AAAA;AAAA;", "names": ["init_styles", "init_styles"] }