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

'use strict';

var react = require('react');
var hooks = require('@orderly.network/hooks');
var i18n = require('@orderly.network/i18n');
var types = require('@orderly.network/types');
var ui = require('@orderly.network/ui');
var jsxRuntime = require('react/jsx-runtime');
var reactApp = require('@orderly.network/react-app');
var uiChainSelector = require('@orderly.network/ui-chain-selector');

var te=e=>{let{title:t,description:n,showDivider:o}=e;return jsxRuntime.jsxs(ui.Box,{position:"relative",className:"oui-pl-8",children:[jsxRuntime.jsxs(ui.Box,{children:[jsxRuntime.jsx(ui.Text,{as:"div",intensity:98,size:"sm",children:t}),jsxRuntime.jsx(ui.Text,{as:"div",intensity:54,size:"2xs",children:n})]}),jsxRuntime.jsx("div",{className:"oui-absolute oui-left-0 oui-top-1 oui-z-10",children:jsxRuntime.jsx(Ie,{...e})}),o&&jsxRuntime.jsx(ui.Box,{position:"absolute",left:12,top:23,bottom:-21,zIndex:0,children:jsxRuntime.jsx(ui.Divider,{lineStyle:"dashed",direction:"vertical",intensity:16,className:"oui-h-full"})})]})},Ie=e=>{let{active:t,isLoading:n,isCompleted:o}=e;return n?jsxRuntime.jsx(ui.Spinner,{size:"sm",className:"oui-ml-1"}):o?jsxRuntime.jsx(ui.CheckedCircleFillIcon,{opacity:1,className:"oui-text-primary"}):jsxRuntime.jsx(ve,{active:!!t})},ve=({active:e,className:t})=>jsxRuntime.jsx("div",{className:ui.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 Z=e=>{let{initAccountState:t=types.AccountStatusEnum.NotConnected}=e,[n,o]=react.useState(true),r=hooks.useEventEmitter(),{t:i}=i18n.useTranslation(),{disconnect:g,namespace:d}=hooks.useWalletConnector(),{state:m,account:s}=hooks.useAccount(),[a,p]=react.useState(t),[l,A]=react.useState(0),[x,b]=react.useState(false),[B,T]=react.useState(false),{ledgerWallet:N,setLedgerAddress:ye}=hooks.useStorageLedgerAddress(),C=react.useRef(0),[M]=hooks.useLocalStorage("orderly-first-show-wallet-connector-dialog",void 0);react.useEffect(()=>()=>{localStorage.setItem("orderly-first-show-wallet-connector-dialog","1");},[]),react.useEffect(()=>{p(m.status);},[m]);let F=react.useMemo(()=>{let u=[];return t<types.AccountStatusEnum.SignedIn&&u.push({key:"signIn",title:i("connector.createAccount"),description:i("connector.createAccount.description")}),t<types.AccountStatusEnum.EnableTrading&&u.push({key:"enableTrading",title:i("connector.enableTrading"),description:i("connector.enableTrading.description")}),u},[t,i]);react.useEffect(()=>{if(d!=types.ChainNamespace.solana){T(false);return}if(!N){T(true);return}if(N&&s.address&&!N.includes(s.address)){T(true);return}T(false);},[d,s.address,N]);let Y=()=>(b(true),e.enableTrading(n).then(async u=>{C.current++,b(false),A(y=>y+1);try{await e.enableTradingComplted?.();}catch{}typeof e.onCompleted=="function"?e.onCompleted():typeof e.close=="function"&&e.close();},u=>{if(b(false),u!==-1){if(u.message.indexOf("Signing off chain messages with Ledger is not yet supported")!==-1){r.emit("wallet:sign-message-with-ledger-error",{message:u.message,userAddress:s.address});return}ui.toast.error(ae(u));}}).catch(u=>{b(false);})),Te=async()=>{localStorage.removeItem("orderly_link_device"),g({label:a.connectWallet?.name}).then(()=>{s.disconnect(),typeof e.close=="function"&&e.close();});},xe=()=>(b(true),e.signIn().then(u=>{A(y=>y+1),Y();},u=>{if(b(false),u!==-1){if(u.message.indexOf("Signing off chain messages with Ledger is not yet supported")!==-1){r.emit("wallet:sign-message-with-ledger-error",{message:u.message,userAddress:s.address});return}ui.toast.error(ae(u));}}).catch(u=>{b(false);}));return jsxRuntime.jsxs(ui.Box,{id:"oui-wallet-connect-dialog-content",className:"oui-font-semibold",children:[jsxRuntime.jsx(ui.Text,{intensity:54,size:"xs",children:i("connector.expired")}),jsxRuntime.jsx(ui.Box,{p:4,my:6,intensity:600,r:"lg",className:"oui-space-y-5",position:"relative",children:F.map((u,y)=>{let Se=y===F.length-1;return jsxRuntime.jsx(te,{title:u.title,description:u.description,isCompleted:l>y,active:l===y,isLoading:x&&l===y,showDivider:!Se},u.key)})}),e.showRefCodeInput&&F.length==2&&jsxRuntime.jsx(Ve,{...e}),M&&jsxRuntime.jsxs(ui.Flex,{justify:"between",itemAlign:"center",children:[jsxRuntime.jsx(Ue,{}),jsxRuntime.jsx(ui.Switch,{color:"primary",checked:n,onCheckedChange:o,disabled:x,className:"data-[state=checked]:oui-bg-primary-darken"})]}),jsxRuntime.jsx(ui.Flex,{justify:"center",mt:8,className:"oui-w-full",children:jsxRuntime.jsx(ui.Box,{className:"oui-w-full",children:jsxRuntime.jsx(He,{state:a,signIn:xe,enableTrading:Y,loading:x,disabled:a>=types.AccountStatusEnum.EnableTrading,showLedgerButton:B})})}),a>types.AccountStatusEnum.NotConnected&&jsxRuntime.jsxs(ui.Flex,{justify:"center",mt:4,gap:1,className:"oui-w-full oui-cursor-pointer",onClick:Te,children:[jsxRuntime.jsx(_e,{}),jsxRuntime.jsx(ui.Text,{className:"oui-text-base-contrast-80 oui-text-sm",children:i("connector.disconnectWallet")})]})]})},_e=()=>jsxRuntime.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",children:jsxRuntime.jsx("path",{d:"M2.24219 5.24316C2.24219 3.58641 3.58536 2.24316 5.24219 2.24316H8.24219C9.89894 2.24316 11.2422 3.58641 11.2422 5.24316C11.2422 5.65716 10.9062 5.99316 10.4922 5.99316C10.0782 5.99316 9.74219 5.65716 9.74219 5.24316C9.74219 4.41441 9.07094 3.74316 8.24219 3.74316H5.24219C4.41374 3.74316 3.74219 4.41441 3.74219 5.24316V12.7432C3.74219 13.5719 4.41374 14.2432 5.24219 14.2432H8.24219C9.07094 14.2432 9.74219 13.5719 9.74219 12.7432C9.74219 12.3292 10.0782 11.9932 10.4922 11.9932C10.9062 11.9932 11.2422 12.3292 11.2422 12.7432C11.2422 14.3999 9.89894 15.7432 8.24219 15.7432H5.24219C3.58536 15.7432 2.24219 14.3999 2.24219 12.7432V5.24316ZM7.49219 8.99316C7.49219 8.57916 7.82819 8.24316 8.24219 8.24316H13.9144L12.4377 6.74316L13.4922 5.68866L16.2814 8.45391C16.5739 8.74716 16.5739 9.23915 16.2814 9.5324L13.4922 12.2977L12.4377 11.2432L13.9144 9.74316H8.24219C7.82819 9.74316 7.49219 9.40716 7.49219 8.99316Z",fill:"white",fillOpacity:"0.8"})}),He=({state:e,signIn:t,enableTrading:n,loading:o,disabled:r,showLedgerButton:i})=>{let{t:g}=i18n.useTranslation();return e<=types.AccountStatusEnum.NotSignedIn?jsxRuntime.jsxs(ui.Flex,{direction:"column",gap:3,className:"oui-w-full",children:[jsxRuntime.jsx(ui.Button,{fullWidth:true,onClick:()=>t(),loading:o,disabled:r,children:g("connector.createAccount")}),i&&jsxRuntime.jsx(se,{onClick:()=>t(),content:g("connector.createAccountWithLedger")})]}):jsxRuntime.jsxs(ui.Flex,{direction:"column",gap:3,className:"oui-w-full",children:[jsxRuntime.jsx(ui.Button,{fullWidth:true,onClick:()=>n(),loading:o,disabled:r,children:g("connector.enableTrading")}),i&&jsxRuntime.jsx(se,{onClick:()=>n(),disabled:r,content:g("connector.enableTradingWithLedger")})]})},se=({onClick:e,disabled:t,content:n})=>{let{t:o}=i18n.useTranslation(),{state:r}=hooks.useAccount(),i=r.address,{setLedgerAddress:g}=hooks.useStorageLedgerAddress();return i?jsxRuntime.jsx(ui.Button,{variant:"outlined",color:"primary",fullWidth:true,onClick:()=>{g(i),e();},disabled:t,className:"oui-w-full",children:n}):null},Ve=e=>{let{t}=i18n.useTranslation();return jsxRuntime.jsx(ui.TextField,{placeholder:t("connector.referralCode.placeholder"),fullWidth:true,label:"",value:e.refCode,onChange:n=>{let o=n.target.value.toUpperCase().replace(/[^A-Z0-9]/g,"");e.setRefCode(o);},classNames:{label:"oui-text-base-contrast-54 oui-text-xs",input:"placeholder:oui-text-base-contrast-20 placeholder:oui-text-sm"},formatters:[ui.inputFormatter.createRegexInputFormatter(n=>String(n).replace(/[a-z]/g,o=>o.toUpperCase())),ui.inputFormatter.createRegexInputFormatter(/[^A-Z0-9]/g)],onClear:()=>{e.setRefCode("");},autoComplete:"off",helpText:e.helpText,className:"oui-mb-4",color:e.helpText?"danger":void 0})},Ue=()=>{let{t:e}=i18n.useTranslation(),t=()=>{window.innerWidth>768||ui.modal.alert({title:e("connector.rememberMe"),message:jsxRuntime.jsx("span",{className:"oui-text-2xs oui-text-base-contrast/60",children:e("connector.rememberMe.description")})});};return jsxRuntime.jsx(ui.Tooltip,{content:e("connector.rememberMe.description"),className:"oui-max-w-[300px]",children:jsxRuntime.jsx("button",{onClick:t,children:jsxRuntime.jsx(ui.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 ae(e){Object.keys(e).forEach(n=>{});let t=i18n.i18n.t("connector.somethingWentWrong");return e.toString().includes("rejected")&&(t=i18n.i18n.t("connector.userRejected")),ui.capitalizeFirstLetter(t)??t}var K=()=>{let{account:e,state:t,createOrderlyKey:n,createAccount:o}=hooks.useAccount(),[r,i]=react.useState(""),[g,d]=react.useState(""),{t:m}=i18n.useTranslation(),{trigger:s}=hooks.useLazyQuery(`/v1/public/referral/verify_ref_code?referral_code=${r}`);react.useEffect(()=>{let C=localStorage.getItem("referral_code");C!=null&&i(C);},[]);let{referral_code:a,isLoading:p}=hooks.useGetReferralCode(e.accountId),[l,{error:A,isMutating:x}]=hooks.useMutation("/v1/referral/bind","POST");react.useEffect(()=>{r.length===0&&d("");},[r]);let b=()=>{ui.toast.success(m("connector.walletConnected")),r.length>=4&&r.length<=10&&l({referral_code:r}).finally(()=>{localStorage.removeItem("referral_code");});},B=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:C}=await s();return C===false?Promise.resolve(m("connector.referralCode.notExist")):Promise.resolve(void 0)},T=(a?.length||0)===0&&!p,N=async()=>{if(T){let C=await B();if(typeof C<"u")return d(C),Promise.reject(-1)}return d(""),o()};return {enableTrading:async C=>{if(T){let M=await B();if(typeof M<"u")return d(M),Promise.reject(-1)}return d(""),n(C)},initAccountState:t.status,signIn:N,enableTradingComplted:b,refCode:r,setRefCode:i,helpText:g,showRefCodeInput:T}};var D="walletConnector",G="walletConnectorSheet",Q=e=>{let t=K();return jsxRuntime.jsx(Z,{...t,...e})};ui.registerSimpleDialog(D,Q,{size:"sm",title:()=>i18n.i18n.t("connector.connectWallet")});ui.registerSimpleSheet(G,Q,{title:()=>i18n.i18n.t("connector.connectWallet")});var k=e=>{let{status:t,buttonProps:n,fallback:o,descriptions:r,classNames:i,networkId:g,id:d,bridgeLessOnly:m}=e,{t:s}=i18n.useTranslation(),{state:a}=hooks.useAccount(),{wrongNetwork:p,disabledConnect:l}=reactApp.useAppContext(),A=react.useMemo(()=>t===void 0?a.status===types.AccountStatusEnum.EnableTradingWithoutConnected?types.AccountStatusEnum.EnableTradingWithoutConnected:types.AccountStatusEnum.EnableTrading:t,[t,a.status]),x={connectWallet:s("connector.connectWallet"),switchChain:s("connector.wrongNetwork"),enableTrading:s("connector.enableTrading"),signin:s("connector.createAccount"),...e.labels},b=react.useMemo(()=>typeof o<"u"?o({validating:a.validating,status:a.status,wrongNetwork:p}):a.validating&&!l?jsxRuntime.jsx(L,{angle:45,disabled:true,loading:true,description:r?.connectWallet,id:d,type:"button",...n,children:x.connectWallet}):jsxRuntime.jsx(dt,{bridgeLessOnly:m,status:a.status,buttonProps:{...n,id:d,type:"button"},wrongNetwork:p,networkId:e.networkId,labels:x,descriptions:r,disabledConnect:l}),[a.status,a.validating,n,p]);return jsxRuntime.jsx(ui.Either,{value:a.status>=A&&!p&&!l,left:b,children:e.children})},lt=()=>{let{t:e}=i18n.useTranslation(),{state:t}=hooks.useAccount();return t.status<types.AccountStatusEnum.SignedIn?jsxRuntime.jsx(ui.Text,{children:e("connector.createAccount")}):t.status<types.AccountStatusEnum.EnableTrading?jsxRuntime.jsx(ui.Text,{children:e("connector.enableTrading")}):jsxRuntime.jsx(ui.Text,{children:e("connector.connectWallet")})},dt=e=>{let{buttonProps:t,labels:n,descriptions:o}=e,{t:r}=i18n.useTranslation(),{connectWallet:i}=reactApp.useAppContext(),{account:g}=hooks.useAccount(),{isMobile:d}=ui.useScreen(),m=hooks.useMediaQuery(types.MEDIA_TABLET),s=()=>{ui.modal.show(m?G:D,{title:jsxRuntime.jsx(lt,{})}).then(l=>{},l=>{});},a=async()=>{let l=await i();l&&(l.wrongNetwork?p():(l?.status??types.AccountStatusEnum.NotConnected)<types.AccountStatusEnum.EnableTrading&&s());},p=()=>{g.once("validate:end",l=>{l<types.AccountStatusEnum.EnableTrading?s():ui.toast.success(r("connector.walletConnected"));}),ui.modal.show(d?uiChainSelector.ChainSelectorSheetId:uiChainSelector.ChainSelectorDialogId,{networkId:e.networkId,bridgeLessOnly:e.bridgeLessOnly}).then(l=>{l.wrongNetwork||e.status>=types.AccountStatusEnum.Connected&&(e.status<types.AccountStatusEnum.EnableTrading?s():ui.toast.success(r("connector.walletConnected")));},l=>{});};return e.wrongNetwork&&!e.disabledConnect?jsxRuntime.jsx(L,{color:"warning",onClick:()=>{p();},description:o?.switchChain,...t,children:n.switchChain}):e.status<=types.AccountStatusEnum.NotConnected||e.disabledConnect?jsxRuntime.jsx(L,{size:"lg",onClick:()=>{a();},variant:e.disabledConnect?void 0:"gradient",angle:45,description:o?.connectWallet,disabled:e.disabledConnect,...t,children:n.connectWallet}):e.status<=types.AccountStatusEnum.NotSignedIn?jsxRuntime.jsx(L,{size:"lg",onClick:()=>{s();},angle:45,description:o?.signin,...t,children:n.signin}):jsxRuntime.jsx(L,{size:"lg",description:o?.enableTrading,...t,onClick:()=>s(),children:n.enableTrading})};k.displayName="AuthGuard";var L=e=>{let{description:t,...n}=e;return jsxRuntime.jsxs(ui.Flex,{direction:"column",children:[jsxRuntime.jsx(ui.Button,{...n}),!!t&&jsxRuntime.jsx(ui.Box,{mt:4,className:"oui-leading-none",style:{lineHeight:0},children:jsxRuntime.jsx(ui.Text,{size:"2xs",intensity:36,children:t})})]})};var Tt=e=>{let{status:t,labels:n,description:o,dataSource:r,children:i,...g}=e,{state:d}=hooks.useAccount(),{wrongNetwork:m,disabledConnect:s}=reactApp.useAppContext(),a=react.useMemo(()=>t===void 0?d.status===types.AccountStatusEnum.EnableTradingWithoutConnected?types.AccountStatusEnum.EnableTradingWithoutConnected:types.AccountStatusEnum.EnableTrading:t,[t,d.status]),p=reactApp.useDataTap(r,{accountStatus:a}),l=m||s||d.status<a||e.ignoreLoadingCheck;return jsxRuntime.jsx(ui.DataTable,{dataSource:p,ignoreLoadingCheck:l,emptyView:jsxRuntime.jsx(xt,{status:a,description:o,labels:n,className:e.classNames?.authGuardDescription,visible:!d.validating}),manualPagination:true,...g,children:i})},xt=e=>{let{t}=i18n.useTranslation(),o={...{connectWallet:t("connector.trade.connectWallet.tooltip"),switchChain:t("connector.wrongNetwork.tooltip"),enableTrading:t("connector.trade.enableTrading.tooltip"),signin:t("connector.trade.createAccount.tooltip")},...e.description};return e.visible?jsxRuntime.jsx(ui.Flex,{py:8,children:jsxRuntime.jsx(k,{status:e.status,labels:e.labels,descriptions:o,buttonProps:{size:"md"},children:jsxRuntime.jsx(ui.ExtensionSlot,{position:ui.ExtensionPositionEnum.EmptyDataIdentifier})})}):null};var he=e=>{let{t}=i18n.useTranslation(),{hint:n={connectWallet:t("connector.trade.connectWallet.tooltip"),signIn:t("connector.trade.createAccount.tooltip"),enableTrading:t("connector.trade.enableTrading.tooltip"),wrongNetwork:t("connector.wrongNetwork.tooltip")},status:o}=e;return jsxRuntime.jsx(ui.Box,{my:8,children:jsxRuntime.jsx(k,{status:o,descriptions:{...n,switchChain:n.wrongNetwork},children:e.children||jsxRuntime.jsx(ui.EmptyDataState,{})})})};he.displayName="AuthGuardEmpty";var we=e=>{let{t}=i18n.useTranslation(),{opactiy:n=90,tooltip:o={connectWallet:t("connector.setUp.connectWallet.tooltip"),signIn:t("connector.setUp.createAccount.tooltip"),enableTrading:t("connector.setUp.enableTrading.tooltip"),wrongNetwork:t("connector.wrongNetwork.tooltip")}}=e,[r,i]=react.useState(false),{state:g}=hooks.useAccount(),d=true,{wrongNetwork:m}=reactApp.useAppContext(),s=react.useMemo(()=>{if(m)return o?.wrongNetwork;switch(g.status){case types.AccountStatusEnum.NotConnected:return o?.connectWallet;case types.AccountStatusEnum.NotSignedIn:return o?.signIn;case types.AccountStatusEnum.DisabledTrading:return o?.enableTrading;case types.AccountStatusEnum.EnableTrading:return "";default:return e.content}},[e.content,g,d,o]),a=react.useMemo(()=>{switch(g.status){case types.AccountStatusEnum.NotConnected:case types.AccountStatusEnum.NotSignedIn:return n;case types.AccountStatusEnum.EnableTrading:return;default:return}},[e.opactiy,g,d]);return jsxRuntime.jsx(ui.Tooltip,{open:s?r:false,onOpenChange:i,content:s,className:"oui-text-2xs",align:e.align,alignOffset:e.alignOffset,side:e.side,sideOffset:e.sideOffset,children:jsxRuntime.jsx("div",{style:{opacity:a},children:e.children})})};we.displayName="AuthGuardTooltip";

exports.AuthGuard = k;
exports.AuthGuardDataTable = Tt;
exports.AuthGuardEmpty = he;
exports.AuthGuardTooltip = we;
exports.WalletConnectContent = Z;
exports.WalletConnectorModalId = D;
exports.WalletConnectorSheetId = G;
exports.WalletConnectorWidget = Q;
exports.useWalletConnectorBuilder = K;
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.js.map