UNPKG

@privy-io/react-auth

Version:

React client for the Privy Auth API

77 lines (74 loc) • 9.27 kB
"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("react-device-detect"),i=require("styled-components"),a=require("./useActiveWallet-Cn6zOXx5.js"),o=require("./OpenLink-L5LZ-pEm.js"),s=require("./QrCode-CE12LRBB.js"),n=require("lucide-react"),l=require("./ModalHeader-BCPQgekO.js"),c=require("./LabelXs-C8rLnCfU.js"),d=require("./context-D-ZJYjUg.js"),u=require("./internal-context-BJv4f_bO.js"),p=require("./get-is-unified-wallet-UpdjHxOV.js"),h=require("./shouldProceedtoEmbeddedWalletCreationFlow-DADJI9f0.js"),y=require("./ScreenLayout-CMb-Fua0.js"),v=require("./farcaster-CWHXGAib.js");require("zustand"),require("./use-export-wallet-B5ujV5Nk.js"),require("@privy-io/js-sdk-core"),require("eventemitter3"),require("viem/utils"),require("./useWallets-CKAypPZB.js"),require("./events-context-Di6--rDg.js"),require("viem"),require("./getPublicClient-BsmZyCGX.js"),require("qrcode"),require("@heroicons/react/24/outline/ArrowLeftIcon"),require("@heroicons/react/24/outline/ArrowRightIcon"),require("@heroicons/react/24/outline/QuestionMarkCircleIcon"),require("@heroicons/react/24/outline/XMarkIcon"),require("tinycolor2"),require("ofetch"),require("@privy-io/are-addresses-equal"),require("./index-C8lpxYDX.js"),require("uuid"),require("jose"),require("@coinbase/wallet-sdk"),require("@privy-io/ethereum"),require("mipd"),require("@privy-io/popup"),require("./paths-DizMb-lU.js"),require("./usePrivy-cfS6o4tX.js"),require("@scure/base"),require("@headlessui/react"),require("@walletconnect/ethereum-provider"),require("@privy-io/urls"),require("./PrivyPluginContext-DsgaS6n9.js"),require("./getEmbeddedConnectedWallet-pJd-l936.js"),require("js-cookie"),require("./frame-Oz7volks.js"),require("@privy-io/routes"),require("x402/client"),require("@privy-io/api-base"),require("viem/accounts"),require("./use-sign-with-user-signer-Cu_6Bx7m.js"),require("./Screen-BfKedqka.js"),require("./index-ByFhjjzH.js");let m=i.styled.div` width: 100%; `,g=i.styled.div` display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.75rem; height: 56px; background: ${e=>e.$disabled?"var(--privy-color-background-2)":"var(--privy-color-background)"}; border: 1px solid var(--privy-color-foreground-4); border-radius: var(--privy-border-radius-md); &:hover { border-color: ${e=>e.$disabled?"var(--privy-color-foreground-4)":"var(--privy-color-foreground-3)"}; } `,x=i.styled.div` flex: 1; min-width: 0; display: flex; align-items: center; `,f=i.styled.span` display: block; font-size: 16px; line-height: 24px; color: ${e=>e.$disabled?"var(--privy-color-foreground-2)":"var(--privy-color-foreground)"}; overflow: hidden; text-overflow: ellipsis; /* Use single-line truncation without nowrap to respect container width */ display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all; @media (min-width: 441px) { font-size: 14px; line-height: 20px; } `,q=i.styled(f)` color: var(--privy-color-foreground-3); font-style: italic; `,C=i.styled(c.LabelXs)` margin-bottom: 0.5rem; `,S=i.styled(l.SecondaryButton)` && { gap: 0.375rem; font-size: 14px; flex-shrink: 0; } `;const j=({value:t,title:i,placeholder:a,className:o,showCopyButton:s=!0,truncate:l,maxLength:c=40,disabled:d=!1})=>{let[u,p]=r.useState(!1),h=l&&t?((e,r,t)=>{if((e=e.startsWith("https://")?e.slice(8):e).length<=t)return e;if("middle"===r){let r=Math.ceil(t/2)-2,i=Math.floor(t/2)-1;return`${e.slice(0,r)}...${e.slice(-i)}`}return`${e.slice(0,t-3)}...`})(t,l,c):t;return r.useEffect((()=>{if(u){let e=setTimeout((()=>p(!1)),3e3);return()=>clearTimeout(e)}}),[u]),/*#__PURE__*/e.jsxs(m,{className:o,children:[i&&/*#__PURE__*/e.jsx(C,{children:i}),/*#__PURE__*/e.jsxs(g,{$disabled:d,children:[/*#__PURE__*/e.jsx(x,{children:t?/*#__PURE__*/e.jsx(f,{$disabled:d,title:t,children:h}):/*#__PURE__*/e.jsx(q,{$disabled:d,children:a||"No value"})}),s&&t&&/*#__PURE__*/e.jsx(S,{onClick:function(e){e.stopPropagation(),navigator.clipboard.writeText(t).then((()=>p(!0))).catch(console.error)},size:"sm",children:u?/*#__PURE__*/e.jsxs(e.Fragment,{children:["Copied",/*#__PURE__*/e.jsx(n.Check,{size:14})]}):/*#__PURE__*/e.jsxs(e.Fragment,{children:["Copy",/*#__PURE__*/e.jsx(n.Copy,{size:14})]})})]})]})},E=({connectUri:r,loading:i,success:n,errorMessage:l,onBack:c,onClose:d,onOpenFarcaster:u})=>t.isMobile||i?t.isIOS?/*#__PURE__*/e.jsx(y.ScreenLayout,{title:l?l.message:"Sign in with Farcaster",subtitle:l?l.detail:"To sign in with Farcaster, please open the Farcaster app.",icon:v.Farcaster,iconVariant:"loading",iconLoadingStatus:{success:n,fail:!!l},primaryCta:r&&u?{label:"Open Farcaster app",onClick:u}:void 0,onBack:c,onClose:d,watermark:!0}):/*#__PURE__*/e.jsx(y.ScreenLayout,{title:l?l.message:"Signing in with Farcaster",subtitle:l?l.detail:"This should only take a moment",icon:v.Farcaster,iconVariant:"loading",iconLoadingStatus:{success:n,fail:!!l},onBack:c,onClose:d,watermark:!0,children:r&&t.isMobile&&/*#__PURE__*/e.jsx(w,{children:/*#__PURE__*/e.jsx(o.OpenLinkButton,{text:"Take me to Farcaster",url:r,color:"#8a63d2"})})}): /*#__PURE__*/e.jsx(y.ScreenLayout,{title:"Sign in with Farcaster",subtitle:"Scan with your phone's camera to continue.",onBack:c,onClose:d,watermark:!0,children:/*#__PURE__*/e.jsxs(T,{children:[/*#__PURE__*/e.jsx(k,{children:r?/*#__PURE__*/e.jsx(s.QrCode,{url:r,size:275,squareLogoElement:v.Farcaster}):/*#__PURE__*/e.jsx(_,{children:/*#__PURE__*/e.jsx(a.Loader,{})})}),/*#__PURE__*/e.jsxs(A,{children:[/*#__PURE__*/e.jsx(F,{children:"Or copy this link and paste it into a phone browser to open the Farcaster app."}),r&&/*#__PURE__*/e.jsx(j,{value:r,truncate:"end",maxLength:30,showCopyButton:!0,disabled:!0})]})]})}),b={component:()=>{let{authenticated:t,logout:i,ready:a,user:o}=p.usePrivyContext(),{lastScreen:s,navigate:n,navigateBack:l,setModalData:c}=p.usePrivyModal(),y=d.useAppConfig(),{getAuthFlow:v,loginWithFarcaster:m,closePrivyModal:g,createAnalyticsEvent:x}=u.usePrivyInternal(),[f,q]=r.useState(void 0),[C,S]=r.useState(!1),[j,b]=r.useState(!1),w=r.useRef([]),T=v(),k=T?.meta.connectUri;return r.useEffect((()=>{let e=Date.now(),r=setInterval((async()=>{let t=await T.pollForReady.execute(),i=Date.now()-e;if(t){clearInterval(r),S(!0);try{await m(),b(!0)}catch(e){let r={retryable:!1,message:"Authentication failed"};if(e?.privyErrorCode===u.PrivyErrorCode.ALLOWLIST_REJECTED)return void n("AllowlistRejectionScreen");if(e?.privyErrorCode===u.PrivyErrorCode.USER_LIMIT_REACHED)return console.error(new u.PrivyUserLimitReachedError(e).toString()),void n("UserLimitReachedScreen");if(e?.privyErrorCode===u.PrivyErrorCode.USER_DOES_NOT_EXIST)return void n("AccountNotFoundScreen");if(e?.privyErrorCode===u.PrivyErrorCode.LINKED_TO_ANOTHER_USER)r.detail=e.message??"This account has already been linked to another user.";else{if(e?.privyErrorCode===u.PrivyErrorCode.ACCOUNT_TRANSFER_REQUIRED&&e.data?.data?.nonce)return c({accountTransfer:{nonce:e.data?.data?.nonce,account:e.data?.data?.subject,displayName:e.data?.data?.account?.displayName,linkMethod:"farcaster",embeddedWalletAddress:e.data?.data?.otherUser?.embeddedWalletAddress,farcasterEmbeddedAddress:e.data?.data?.otherUser?.farcasterEmbeddedAddress}}),void n("LinkConflictScreen");e?.privyErrorCode===u.PrivyErrorCode.INVALID_CREDENTIALS?(r.retryable=!0,r.detail="Something went wrong. Try again."):e?.privyErrorCode===u.PrivyErrorCode.TOO_MANY_REQUESTS&&(r.detail="Too many requests. Please wait before trying again.")}q(r)}}else i>12e4&&(clearInterval(r),q({retryable:!0,message:"Authentication failed",detail:"The request timed out. Try again."}))}),2e3);return()=>{clearInterval(r),w.current.forEach((e=>clearTimeout(e)))}}),[]),r.useEffect((()=>{if(a&&t&&j&&o){if(y?.legal.requireUsersAcceptTerms&&!o.hasAcceptedTerms){let e=setTimeout((()=>{n("AffirmativeConsentScreen")}),d.DEFAULT_SUCCESS_SCREEN_DURATION_MS);return()=>clearTimeout(e)}j&&(h.shouldProceedtoEmbeddedWalletCreationFlow(o,y.embeddedWallets)?w.current.push(setTimeout((()=>{c({createWallet:{onSuccess:()=>{},onFailure:e=>{console.error(e),x({eventName:"embedded_wallet_creation_failure_logout",payload:{error:e,screen:"FarcasterConnectStatusScreen"}}),i()},callAuthOnSuccessOnClose:!0}}),n("EmbeddedWalletOnAccountCreateScreen")}),d.DEFAULT_SUCCESS_SCREEN_DURATION_MS)):w.current.push(setTimeout((()=>g({shouldCallAuthOnSuccess:!0,isSuccess:!0})),d.DEFAULT_SUCCESS_SCREEN_DURATION_MS)))}}),[j,a,t,o]),/*#__PURE__*/e.jsx(E,{connectUri:k,loading:C,success:j,errorMessage:f,onBack:s?l:void 0,onClose:g,onOpenFarcaster:()=>{k&&(window.location.href=k)}})}};let w=i.styled.div` margin-top: 24px; `,T=i.styled.div` display: flex; flex-direction: column; align-items: center; gap: 24px; `,k=i.styled.div` display: flex; align-items: center; justify-content: center; min-height: 275px; `,A=i.styled.div` display: flex; flex-direction: column; align-items: center; gap: 16px; `,F=i.styled.div` font-size: 0.875rem; text-align: center; color: var(--privy-color-foreground-2); `,_=i.styled.div` position: relative; width: 82px; height: 82px; `;exports.FarcasterConnectStatusScreen=b,exports.FarcasterConnectStatusView=E,exports.default=b;