@orderly.network/ui-connector/dist/index.mjs

import { useState, useEffect, useMemo } from 'react';
import { registerSimpleDialog, registerSimpleSheet, Box, Text, Divider, Flex, Switch, toast, TextField, inputFormatter, Tooltip, Match, Button, CheckedCircleFillIcon, Spinner, modal, capitalizeFirstLetter, cn, Either, useScreen, DataTable, ExtensionSlot, ExtensionPositionEnum, EmptyDataState } from '@orderly.network/ui';
import { AccountStatusEnum, MEDIA_TABLET } from '@orderly.network/types';
import { jsx, jsxs } from 'react/jsx-runtime';
import { useAccount, useLazyQuery, useGetReferralCode, useMutation, useEventEmitter, useLocalStorage, useMediaQuery } from '@orderly.network/hooks';
import { i18n, useTranslation } from '@orderly.network/i18n';
import { useAppContext, useDataTap } from '@orderly.network/react-app';
import { ChainSelectorSheetId, ChainSelectorDialogId } from '@orderly.network/ui-chain-selector';

var Q=e=>{let{title:t,description:n}=e;return jsxs(Box,{position:"relative",className:"oui-pl-8",children:[jsxs(Box,{children:[jsx(Text,{as:"div",intensity:98,size:"sm",children:t}),jsx(Text,{as:"div",intensity:54,size:"2xs",children:n})]}),jsx(he,{...e})]})},he=e=>{let{active:t,isLoading:n,isCompleted:o}=e;return jsx(Match,{className:"oui-absolute oui-left-0 oui-top-1 oui-z-10",value:()=>o?"completed":n?"loading":t?"active":"normal",case:{loading:jsx("div",{children:jsx(Spinner,{size:"sm",className:"oui-ml-1"})}),completed:jsx("div",{children:jsx(CheckedCircleFillIcon,{opacity:1,className:"oui-text-primary"})})},default:jsx(be,{active:!!t})})},be=({active:e,className:t})=>jsx("div",{className:cn("oui-w-[8.3px] oui-h-[8.3px] oui-rounded-full oui-ml-2 oui-mt-1",t,e?"oui-bg-primary-light":"oui-bg-base-2")});var O=e=>{let{initAccountState:t=AccountStatusEnum.NotConnected}=e,[n,o]=useState(true),r=useEventEmitter(),{t:c}=useTranslation(),{state:g,account:d}=useAccount(),[m,a]=useState(t),[l,f]=useState(0),[s,h]=useState(false),[I]=useLocalStorage("orderly-first-show-wallet-connector-dialog",void 0);useEffect(()=>()=>{localStorage.setItem("orderly-first-show-wallet-connector-dialog","1");},[]),useEffect(()=>{a(g.status);},[g]);let T=useMemo(()=>{let i=[];return t<AccountStatusEnum.SignedIn&&i.push({key:"signIn",title:c("connector.signIn"),description:c("connector.signIn.description")}),t<AccountStatusEnum.EnableTrading&&i.push({key:"enableTrading",title:c("connector.enableTrading"),description:c("connector.enableTrading.description")}),i},[t,c]),k=()=>(h(true),e.enableTrading(n).then(async i=>{h(false),f(w=>w+1);try{await e.enableTradingComplted?.();}catch{}typeof e.onCompleted=="function"?e.onCompleted():typeof e.close=="function"&&e.close();},i=>{if(h(false),i!==-1){if(i.message.indexOf("Signing off chain messages with Ledger is not yet supported")!==-1){r.emit("wallet:sign-message-with-ledger-error",{message:i.message,userAddress:d.address});return}toast.error(X(i));}}).catch(i=>{h(false);})),W=()=>(h(true),e.signIn().then(i=>{f(w=>w+1),k();},i=>{if(h(false),i!==-1){if(i.message.indexOf("Signing off chain messages with Ledger is not yet supported")!==-1){r.emit("wallet:sign-message-with-ledger-error",{message:i.message,userAddress:d.address});return}toast.error(X(i));}}).catch(i=>{h(false);}));return jsxs(Box,{id:"oui-wallet-connect-dialog-content",className:"oui-font-semibold",children:[jsx(Text,{intensity:54,size:"xs",children:c("connector.expired")}),jsxs(Box,{p:4,my:6,intensity:600,r:"lg",className:"oui-space-y-5",position:"relative",children:[T.map((i,w)=>jsx(Q,{title:i.title,description:i.description,isCompleted:l>w,active:l===w,isLoading:s&&l===w},i.key)),T.length>1&&jsx(Box,{position:"absolute",height:"38px",left:28,top:18,zIndex:0,children:jsx(Divider,{lineStyle:"dashed",direction:"vertical",intensity:16,className:"oui-h-full"})})]}),e.showRefCodeInput&&T.length==2&&jsx(ve,{...e}),I&&jsxs(Flex,{justify:"between",itemAlign:"center",children:[jsx(Me,{}),jsx(Switch,{color:"primary",checked:n,onCheckedChange:o,disabled:s,className:"data-[state=checked]:oui-bg-primary-darken"})]}),jsx(Flex,{justify:"center",mt:8,children:jsx(Box,{width:"45%",children:jsx(Ee,{state:m,signIn:W,enableTrading:k,loading:s,disabled:m>=AccountStatusEnum.EnableTrading})})})]})},Ee=({state:e,signIn:t,enableTrading:n,loading:o,disabled:r})=>{let{t:c}=useTranslation();return jsx(Match,{value:()=>e<=AccountStatusEnum.NotSignedIn?"signIn":"enableTrading",case:{signIn:jsx(Button,{fullWidth:true,onClick:()=>t(),loading:o,disabled:r,children:c("connector.signIn")}),enableTrading:jsx(Button,{fullWidth:true,onClick:()=>n(),loading:o,disabled:r,children:c("connector.enableTrading")})}})},ve=e=>{let{t}=useTranslation();return jsx(TextField,{placeholder:t("connector.referralCode.placeholder"),fullWidth:true,label:"",value:e.refCode,onChange:n=>{e.setRefCode(n.target.value);},classNames:{label:"oui-text-base-contrast-54 oui-text-xs",input:"placeholder:oui-text-base-contrast-20 placeholder:oui-text-sm"},formatters:[inputFormatter.createRegexInputFormatter(/[^A-Z0-9]/g)],onClear:()=>{e.setRefCode("");},autoComplete:"off",helpText:e.helpText,className:"oui-mb-4",color:e.helpText?"danger":void 0})},Me=()=>{let{t:e}=useTranslation(),t=()=>{window.innerWidth>768||modal.alert({title:e("connector.rememberMe"),message:jsx("span",{className:"oui-text-2xs oui-text-base-contrast/60",children:e("connector.rememberMe.description")})});};return jsx(Tooltip,{content:e("connector.rememberMe.description"),className:"oui-max-w-[300px]",children:jsx("button",{onClick:t,children:jsx(Text,{intensity:54,size:"xs",className:"oui-underline oui-underline-offset-4 oui-decoration-dashed oui-decoration-base-contrast-36",children:e("connector.rememberMe")})})})};function X(e){Object.keys(e).forEach(n=>{});let t=i18n.t("connector.somethingWentWrong");return e.toString().includes("rejected")&&(t=i18n.t("connector.userRejected")),capitalizeFirstLetter(t)??t}var L=()=>{let{account:e,state:t,createOrderlyKey:n,createAccount:o}=useAccount(),[r,c]=useState(""),[g,d]=useState(""),{t:m}=useTranslation(),{trigger:a}=useLazyQuery(`/v1/public/referral/verify_ref_code?referral_code=${r}`);useEffect(()=>{let y=localStorage.getItem("referral_code");y!=null&&c(y);},[]);let{referral_code:l,isLoading:f}=useGetReferralCode(e.accountId),[s,{error:h,isMutating:I}]=useMutation("/v1/referral/bind","POST");useEffect(()=>{r.length===0&&d("");},[r]);let T=()=>{toast.success(m("connector.walletConnected")),r.length>=4&&r.length<=10&&s({referral_code:r}).finally(()=>{localStorage.removeItem("referral_code");});},k=async()=>{if(r.length===0)return Promise.resolve(void 0);if(r.length>0&&(r.length<4||r.length>10))return Promise.resolve(m("connector.referralCode.invalid"));let{exist:y}=await a();return y===false?Promise.resolve(m("connector.referralCode.notExist")):Promise.resolve(void 0)},W=(l?.length||0)===0&&!f,i=async()=>{if(W){let y=await k();if(typeof y<"u")return d(y),Promise.reject(-1)}return d(""),o()};return {enableTrading:async y=>{if(W){let _=await k();if(typeof _<"u")return d(_),Promise.reject(-1)}return d(""),n(y)},initAccountState:t.status,signIn:i,enableTradingComplted:T,refCode:r,setRefCode:c,helpText:g,showRefCodeInput:W}};var B="walletConnector",G="walletConnectorSheet",D=e=>{let t=L();return jsx(O,{...t,...e})};registerSimpleDialog(B,D,{size:"sm",title:()=>i18n.t("connector.connectWallet")});registerSimpleSheet(G,D,{title:()=>i18n.t("connector.connectWallet")});var S=e=>{let{status:t,buttonProps:n,fallback:o,descriptions:r,classNames:c,networkId:g,id:d,bridgeLessOnly:m}=e,{t:a}=useTranslation(),{state:l}=useAccount(),{wrongNetwork:f,disabledConnect:s}=useAppContext(),h=useMemo(()=>t===void 0?l.status===AccountStatusEnum.EnableTradingWithoutConnected?AccountStatusEnum.EnableTradingWithoutConnected:AccountStatusEnum.EnableTrading:t,[t,l.status]),I={connectWallet:a("connector.connectWallet"),switchChain:a("connector.wrongNetwork"),enableTrading:a("connector.enableTrading"),signin:a("connector.signIn"),...e.labels},T=useMemo(()=>typeof o<"u"?o({validating:l.validating,status:l.status,wrongNetwork:f}):l.validating&&!s?jsx(A,{angle:45,disabled:true,loading:true,description:r?.connectWallet,id:d,type:"button",...n,children:I.connectWallet}):jsx(je,{bridgeLessOnly:m,status:l.status,buttonProps:{...n,id:d,type:"button"},wrongNetwork:f,networkId:e.networkId,labels:I,descriptions:r,disabledConnect:s}),[l.status,l.validating,n,f]);return jsx(Either,{value:l.status>=h&&!f&&!s,left:T,children:e.children})},je=e=>{let{buttonProps:t,labels:n,descriptions:o}=e,{t:r}=useTranslation(),{connectWallet:c}=useAppContext(),{account:g}=useAccount(),{isMobile:d}=useScreen(),m=useMediaQuery(MEDIA_TABLET),a=()=>{modal.show(m?G:B).then(s=>{},s=>{});},l=async()=>{let s=await c();s&&(s.wrongNetwork?f():(s?.status??AccountStatusEnum.NotConnected)<AccountStatusEnum.EnableTrading&&a());},f=()=>{g.once("validate:end",s=>{s<AccountStatusEnum.EnableTrading?a():toast.success(r("connector.walletConnected"));}),modal.show(d?ChainSelectorSheetId:ChainSelectorDialogId,{networkId:e.networkId,bridgeLessOnly:e.bridgeLessOnly}).then(s=>{s.wrongNetwork||e.status>=AccountStatusEnum.Connected&&(e.status<AccountStatusEnum.EnableTrading?a():toast.success(r("connector.walletConnected")));},s=>{});};return e.wrongNetwork&&!e.disabledConnect?jsx(A,{color:"warning",onClick:()=>{f();},description:o?.switchChain,...t,children:n.switchChain}):jsx(Match,{value:e.status,case:s=>{if(s<=AccountStatusEnum.NotConnected||e.disabledConnect)return jsx(A,{size:"lg",onClick:()=>{l();},variant:e.disabledConnect?void 0:"gradient",angle:45,description:o?.connectWallet,disabled:e.disabledConnect,...t,children:n.connectWallet});if(s<=AccountStatusEnum.NotSignedIn)return jsx(A,{size:"lg",onClick:()=>{a();},angle:45,description:o?.signin,...t,children:n.signin})},default:jsx(A,{size:"lg",description:o?.enableTrading,...t,onClick:()=>a(),children:n.enableTrading})})};S.displayName="AuthGuard";var A=e=>{let{description:t,...n}=e;return jsxs(Flex,{direction:"column",children:[jsx(Button,{...n}),!!t&&jsx(Box,{mt:4,className:"oui-leading-none",style:{lineHeight:0},children:jsx(Text,{size:"2xs",intensity:36,children:t})})]})};var dt=e=>{let{status:t,labels:n,description:o,dataSource:r,...c}=e,{state:g}=useAccount(),{wrongNetwork:d,disabledConnect:m}=useAppContext(),a=useMemo(()=>t===void 0?g.status===AccountStatusEnum.EnableTradingWithoutConnected?AccountStatusEnum.EnableTradingWithoutConnected:AccountStatusEnum.EnableTrading:t,[t,g.status]),l=useDataTap(r,{accountStatus:a}),f=d||m||g.status<a||e.ignoreLoadingCheck;return jsx(DataTable,{dataSource:l,ignoreLoadingCheck:f,emptyView:jsx(ut,{status:a,description:o,labels:n,className:e.classNames?.authGuardDescription,visible:!g.validating}),manualPagination:true,...c})},ut=e=>{let{t}=useTranslation(),o={...{connectWallet:t("connector.connectWallet"),switchChain:t("connector.wrongNetwork"),enableTrading:t("connector.enableTrading"),signin:t("connector.signIn")},...e.description};return e.visible?jsx(Flex,{py:8,children:jsx(S,{status:e.status,labels:e.labels,descriptions:o,buttonProps:{size:"md"},children:jsx(ExtensionSlot,{position:ExtensionPositionEnum.EmptyDataIdentifier})})}):null};var le=e=>{let{t}=useTranslation(),{hint:n={connectWallet:t("connector.trade.connectWallet.tooltip"),signIn:t("connector.trade.signIn.tooltip"),enableTrading:t("connector.trade.enableTrading.tooltip"),wrongNetwork:t("connector.wrongNetwork.tooltip")},status:o}=e;return jsx(Box,{my:8,children:jsx(S,{status:o,descriptions:{...n,switchChain:n.wrongNetwork},children:e.children||jsx(EmptyDataState,{})})})};le.displayName="AuthGuardEmpty";var ue=e=>{let{t}=useTranslation(),{opactiy:n=90,tooltip:o={connectWallet:t("connector.setUp.connectWallet.tooltip"),signIn:t("connector.setUp.signIn.tooltip"),enableTrading:t("connector.setUp.enableTrading.tooltip"),wrongNetwork:t("connector.wrongNetwork.tooltip")}}=e,[r,c]=useState(false),{state:g}=useAccount(),d=true,{wrongNetwork:m}=useAppContext(),a=useMemo(()=>{if(m)return o?.wrongNetwork;switch(g.status){case AccountStatusEnum.NotConnected:return o?.connectWallet;case AccountStatusEnum.NotSignedIn:return o?.signIn;case AccountStatusEnum.DisabledTrading:return o?.enableTrading;case AccountStatusEnum.EnableTrading:return "";default:return e.content}},[e.content,g,d,o]),l=useMemo(()=>{switch(g.status){case AccountStatusEnum.NotConnected:case AccountStatusEnum.NotSignedIn:return n;case AccountStatusEnum.EnableTrading:return;default:return}},[e.opactiy,g,d]);return jsx(Tooltip,{open:a?r:false,onOpenChange:c,content:a,className:"oui-text-2xs",align:e.align,alignOffset:e.alignOffset,side:e.side,sideOffset:e.sideOffset,children:jsx("div",{style:{opacity:l},children:e.children})})};ue.displayName="AuthGuardTooltip";

export { S as AuthGuard, dt as AuthGuardDataTable, le as AuthGuardEmpty, ue as AuthGuardTooltip, O as WalletConnectContent, B as WalletConnectorModalId, G as WalletConnectorSheetId, D as WalletConnectorWidget, L as useWalletConnectorBuilder };
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.mjs.map