@spicenet-io/spiceflow-ui 1.12.2 → 1.12.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/auth-dynamic.js +1 -1
  2. package/dist/auth-privy.js +1 -1
  3. package/dist/index.cjs.js +28 -28
  4. package/dist/index.js +26 -26
  5. package/dist/types/lock.d.ts +6 -1
  6. package/package.json +1 -1
  7. /package/dist/{Button-WjpgErig.js → Button-4ryz2e1P.js} +0 -0
package/dist/auth-dynamic.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use client";
2
- import{jsxs as o,jsx as t}from"react/jsx-runtime";import re,{useEffect as B,useState as b,useCallback as _}from"react";import{c as A,B as m}from"./Button-WjpgErig.js";import{useDynamicContext as oe,useConnectWithOtp as ie}from"@dynamic-labs/sdk-react-core";const J=({label:s,error:n,helper:y,fullWidth:p=!1,startAdornment:h,endAdornment:c,className:e="",style:i,theme:E,...C})=>{const r=E||A("light"),k={width:p?"100%":"auto",display:"flex",flexDirection:"column",gap:r.spacing.xs},R={position:"relative",display:"flex",alignItems:"center"},g={backgroundColor:r.colors.surface,border:`1px solid ${n?r.colors.error:r.colors.border}`,borderRadius:r.borderRadius.md,color:r.colors.text,fontSize:r.typography.fontSize.base,padding:r.spacing.md,paddingLeft:h?r.spacing.xl:r.spacing.md,paddingRight:c?r.spacing.xl:r.spacing.md,width:"100%",outline:"none",transition:`border-color ${r.animation.normal}`,":focus":{borderColor:n?r.colors.error:r.colors.primary},":hover":{borderColor:n?r.colors.error:r.colors.borderHover},"::placeholder":{color:r.colors.textMuted}},d={fontSize:r.typography.fontSize.sm,fontWeight:r.typography.fontWeight.medium,color:r.colors.textSecondary},f={fontSize:r.typography.fontSize.xs,color:n?r.colors.error:r.colors.textMuted},u={position:"absolute",top:"50%",transform:"translateY(-50%)",color:r.colors.textMuted,pointerEvents:"none"};return o("div",{style:k,children:[s&&t("label",{style:d,children:s}),o("div",{style:R,children:[h&&t("div",{style:{...u,left:r.spacing.md},children:h}),t("input",{style:{...g,...i},className:e,...C}),c&&t("div",{style:{...u,right:r.spacing.md},children:c})]}),(n||y)&&t("span",{style:f,children:n||y})]})},K=({isOpen:s,onClose:n,title:y,children:p,maxWidth:h="32rem",className:c="",theme:e})=>{const i=e||A("light");if(B(()=>{const d=f=>{f.key==="Escape"&&n()};return s&&(document.addEventListener("keydown",d),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",d),document.body.style.overflow="unset"}},[s,n]),!s)return null;const E={position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(0, 0, 0, 0.5)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,padding:i.spacing.md},C={backgroundColor:i.colors.background,border:`1px solid ${i.colors.border}`,borderRadius:i.borderRadius.lg,boxShadow:i.shadows.lg,maxWidth:h,width:"100%",maxHeight:"90vh",overflow:"auto"},r={padding:i.spacing.lg,borderBottom:`1px solid ${i.colors.border}`,display:"flex",alignItems:"center",justifyContent:"space-between"},k={fontSize:i.typography.fontSize.lg,fontWeight:i.typography.fontWeight.semibold,color:i.colors.text,margin:0},R={background:"none",border:"none",color:i.colors.textMuted,cursor:"pointer",padding:i.spacing.sm,borderRadius:i.borderRadius.sm,display:"flex",alignItems:"center",justifyContent:"center",transition:`color ${i.animation.normal}`,":hover":{color:i.colors.text}},g={padding:i.spacing.lg};return t("div",{style:E,onClick:n,children:o("div",{style:C,className:c,onClick:d=>d.stopPropagation(),children:[y&&o("div",{style:r,children:[t("h2",{style:k,children:y}),t("button",{style:R,onClick:n,children:o("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),t("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),t("div",{style:g,children:p})]})})},ne=({onAuthSuccess:s,onAuthError:n,theme:y="light",className:p="",buttonText:h="Login with Dynamic",autoTrigger:c=!1})=>{const e=A(y),[i,E]=b(!1),[C,r]=b(c),[k,R]=b(!1),[g,d]=b(""),[f,u]=b(""),[z,a]=b(null),[W,T]=b(null),[V,$]=b(!1),[q,x]=b("options");let M=null,N=null,w=!1,D=null;try{M=oe(),N=ie(),w=!0}catch(l){D=l instanceof Error?l.message:String(l)}const L=N?.connectWithEmail,P=N?.verifyOneTimePassword,F=M?.handleLogOut,{user:j,primaryWallet:O}=M||{user:null,primaryWallet:null},I=!!j,v=O?.address,S=I&&!!v;B(()=>{E(!0)},[]),B(()=>{c&&i&&w&&!S&&!k&&(R(!0),r(!0))},[c,i,w,S,k]),B(()=>{if(i&&!w&&D){const l=setTimeout(()=>{a(null)},2e3);return()=>clearTimeout(l)}},[i,w,D]),B(()=>{if(W){const l=setTimeout(()=>{$(!0)},3e4);return()=>clearTimeout(l)}},[W]),B(()=>{S&&v&&(r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1),s&&s(v))},[S,v,s]);const Q=_(async l=>{if(l.preventDefault(),!g.trim()){a("Please enter a valid email address");return}if(!L){a("Dynamic context not ready. Please try again.");return}a(null);try{await L(g),x("otp")}catch(H){a("Failed to send verification code. Please try again."),n&&n(`Failed to send verification code: ${String(H)}`)}},[g,L,n]),U=_(async l=>{if(l.preventDefault(),!f.trim()){a("Please enter the verification code");return}if(!P){a("Dynamic context not ready. Please try again.");return}a(null);try{await P(f),j&&!O&&T(Date.now())}catch(H){a("Invalid verification code. Please try again."),n&&n(`OTP verification failed: ${String(H)}`)}},[f,P,j,O,n]),Y=_(async()=>{try{F&&await F(),r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1)}catch{r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1)}},[F]);if(!i)return t("div",{className:p,children:t(m,{variant:"primary",disabled:!0,theme:e,children:h})});if(!w)return o("div",{className:p,children:[t(m,{variant:"primary",disabled:!0,theme:e,children:"Loading Dynamic..."}),D&&t("div",{style:{marginTop:"8px",fontSize:"12px",color:e.colors.error,padding:e.spacing.xs,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,borderRadius:e.borderRadius.sm},children:"Initializing Dynamic context..."})]});const X=()=>o("div",{className:"w-full max-w-[450px] space-y-8",children:[t("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:t("h1",{style:{fontSize:"1.875rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Get Started"})}),t("div",{style:{marginBottom:e.spacing.md},children:t(m,{variant:"primary",fullWidth:!0,onClick:()=>x("email"),theme:e,children:"Continue with Email"})}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginTop:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})})]}),Z=()=>o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.primary,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("span",{style:{fontSize:"1.25rem"},children:"\u2709\uFE0F"})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Email Authentication"}),t("p",{style:{color:e.colors.textMuted},children:"Enter your email to get started"})]}),o("form",{onSubmit:Q,style:{marginBottom:e.spacing.md},children:[o("div",{style:{marginBottom:e.spacing.md},children:[t("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Email Address"}),t(J,{type:"email",value:g,onChange:l=>d(l.target.value),placeholder:"Enter your email address",required:!0,theme:e})]}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{type:"submit",variant:"primary",fullWidth:!0,disabled:!g.trim(),theme:e,children:"Send Verification Code"}),t(m,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{x("options"),a(null),d("")},theme:e,children:"\u2190 Back"})]})]})]}),ee=()=>o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.success,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("span",{style:{fontSize:"1.25rem",color:"#ffffff"},children:"\u2713"})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Check Your Email"}),o("p",{style:{color:e.colors.textMuted},children:["Enter the verification code sent to"," ",t("span",{style:{color:e.colors.primary,fontWeight:"medium"},children:g})]})]}),o("form",{onSubmit:U,style:{marginBottom:e.spacing.md},children:[o("div",{style:{marginBottom:e.spacing.md},children:[t("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Verification Code"}),t(J,{type:"text",value:f,onChange:l=>u(l.target.value),placeholder:"Enter 6-digit code",maxLength:6,required:!0,theme:e,className:"ibm-plex-mono",style:{textAlign:"center",fontSize:"1.3rem",letterSpacing:"0.2em",fontFamily:"IBM Plex Mono"}})]}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{type:"submit",variant:"primary",fullWidth:!0,disabled:!f.trim(),theme:e,children:"Verify Code"}),t(m,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{a(null),u(""),x("email")},theme:e,children:"\u2190 Back to Email"})]})]})]}),te=()=>{const l=V||W&&Date.now()-(W||0)>3e4;return o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.warning,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("div",{style:{width:"1.5rem",height:"1.5rem",border:`2px solid ${e.colors.text}`,borderTop:"2px solid transparent",borderRadius:"50%",animation:"spin 1s linear infinite"}})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Setting up your wallet..."}),t("p",{style:{color:e.colors.textMuted},children:"Creating your wallet automatically. This may take a few moments."}),W&&o("div",{style:{fontSize:e.typography.fontSize.sm,color:e.colors.textMuted,marginTop:e.spacing.sm},children:[o("p",{children:["Waiting time:"," ",Math.floor((Date.now()-(W||0))/1e3),"s"]}),V&&t("p",{style:{color:e.colors.warning,fontWeight:"medium"},children:"\u26A0\uFE0F Taking longer than expected"})]})]}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{variant:"secondary",fullWidth:!0,onClick:()=>window.location.reload(),theme:e,children:"Retry Automatic Creation"}),t(m,{variant:"secondary",fullWidth:!0,onClick:Y,theme:e,children:"Cancel & Start Over"})]}),l&&o("div",{style:{marginTop:e.spacing.md,padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef3c7":`${e.colors.warning}20`,border:`1px solid ${e.mode==="light"?"#fde68a":e.colors.warning}`,borderRadius:e.borderRadius.md},children:[t("p",{style:{color:e.colors.warning,fontSize:e.typography.fontSize.sm,marginBottom:e.spacing.sm},children:"\u26A0\uFE0F Wallet creation is taking longer than expected. This might be due to network issues."}),o("div",{style:{fontSize:e.typography.fontSize.xs,color:e.colors.textMuted},children:[t("p",{children:"\u2022 Try refreshing the page to restart automatic creation"}),t("p",{children:"\u2022 Check your internet connection"}),t("p",{children:"\u2022 If the issue persists, start over with a new email"})]})]})]})},G=()=>w?I&&!v?te():q==="otp"?ee():q==="email"?Z():X():o("div",{style:{textAlign:"center",padding:e.spacing.xl},children:[t("div",{style:{width:"2.5rem",height:"2.5rem",border:`2px solid ${e.colors.border}`,borderTop:`2px solid ${e.colors.primary}`,borderRadius:"50%",animation:"spin 1s linear infinite",margin:`0 auto ${e.spacing.md}`}}),t("p",{style:{color:e.colors.textMuted},children:"Initializing Dynamic..."})]});return S&&v?t("div",{className:p,children:o(m,{variant:"primary",onClick:Y,theme:e,children:["Logout (",v.slice(0,6),"...",v.slice(-4),")"]})}):c?o("div",{className:p,children:[o("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"20px",flexDirection:"column",gap:"12px"},children:[t("div",{style:{width:"40px",height:"40px",border:"3px solid #e5e7eb",borderTop:"3px solid #3b82f6",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t("p",{style:{color:"#6b7280",fontSize:"14px"},children:"Opening login..."})]}),t(K,{isOpen:C,onClose:()=>{(!I||S)&&(r(!1),x("options"),d(""),u(""),a(null))},title:"",theme:e,children:G()}),t("style",{dangerouslySetInnerHTML:{__html:`
2
+ import{jsxs as o,jsx as t}from"react/jsx-runtime";import re,{useEffect as B,useState as b,useCallback as _}from"react";import{c as A,B as m}from"./Button-4ryz2e1P.js";import{useDynamicContext as oe,useConnectWithOtp as ie}from"@dynamic-labs/sdk-react-core";const J=({label:s,error:n,helper:y,fullWidth:p=!1,startAdornment:h,endAdornment:c,className:e="",style:i,theme:E,...C})=>{const r=E||A("light"),k={width:p?"100%":"auto",display:"flex",flexDirection:"column",gap:r.spacing.xs},R={position:"relative",display:"flex",alignItems:"center"},g={backgroundColor:r.colors.surface,border:`1px solid ${n?r.colors.error:r.colors.border}`,borderRadius:r.borderRadius.md,color:r.colors.text,fontSize:r.typography.fontSize.base,padding:r.spacing.md,paddingLeft:h?r.spacing.xl:r.spacing.md,paddingRight:c?r.spacing.xl:r.spacing.md,width:"100%",outline:"none",transition:`border-color ${r.animation.normal}`,":focus":{borderColor:n?r.colors.error:r.colors.primary},":hover":{borderColor:n?r.colors.error:r.colors.borderHover},"::placeholder":{color:r.colors.textMuted}},d={fontSize:r.typography.fontSize.sm,fontWeight:r.typography.fontWeight.medium,color:r.colors.textSecondary},f={fontSize:r.typography.fontSize.xs,color:n?r.colors.error:r.colors.textMuted},u={position:"absolute",top:"50%",transform:"translateY(-50%)",color:r.colors.textMuted,pointerEvents:"none"};return o("div",{style:k,children:[s&&t("label",{style:d,children:s}),o("div",{style:R,children:[h&&t("div",{style:{...u,left:r.spacing.md},children:h}),t("input",{style:{...g,...i},className:e,...C}),c&&t("div",{style:{...u,right:r.spacing.md},children:c})]}),(n||y)&&t("span",{style:f,children:n||y})]})},K=({isOpen:s,onClose:n,title:y,children:p,maxWidth:h="32rem",className:c="",theme:e})=>{const i=e||A("light");if(B(()=>{const d=f=>{f.key==="Escape"&&n()};return s&&(document.addEventListener("keydown",d),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",d),document.body.style.overflow="unset"}},[s,n]),!s)return null;const E={position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(0, 0, 0, 0.5)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,padding:i.spacing.md},C={backgroundColor:i.colors.background,border:`1px solid ${i.colors.border}`,borderRadius:i.borderRadius.lg,boxShadow:i.shadows.lg,maxWidth:h,width:"100%",maxHeight:"90vh",overflow:"auto"},r={padding:i.spacing.lg,borderBottom:`1px solid ${i.colors.border}`,display:"flex",alignItems:"center",justifyContent:"space-between"},k={fontSize:i.typography.fontSize.lg,fontWeight:i.typography.fontWeight.semibold,color:i.colors.text,margin:0},R={background:"none",border:"none",color:i.colors.textMuted,cursor:"pointer",padding:i.spacing.sm,borderRadius:i.borderRadius.sm,display:"flex",alignItems:"center",justifyContent:"center",transition:`color ${i.animation.normal}`,":hover":{color:i.colors.text}},g={padding:i.spacing.lg};return t("div",{style:E,onClick:n,children:o("div",{style:C,className:c,onClick:d=>d.stopPropagation(),children:[y&&o("div",{style:r,children:[t("h2",{style:k,children:y}),t("button",{style:R,onClick:n,children:o("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),t("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),t("div",{style:g,children:p})]})})},ne=({onAuthSuccess:s,onAuthError:n,theme:y="light",className:p="",buttonText:h="Login with Dynamic",autoTrigger:c=!1})=>{const e=A(y),[i,E]=b(!1),[C,r]=b(c),[k,R]=b(!1),[g,d]=b(""),[f,u]=b(""),[z,a]=b(null),[W,T]=b(null),[V,$]=b(!1),[q,x]=b("options");let M=null,N=null,w=!1,D=null;try{M=oe(),N=ie(),w=!0}catch(l){D=l instanceof Error?l.message:String(l)}const L=N?.connectWithEmail,P=N?.verifyOneTimePassword,F=M?.handleLogOut,{user:j,primaryWallet:O}=M||{user:null,primaryWallet:null},I=!!j,v=O?.address,S=I&&!!v;B(()=>{E(!0)},[]),B(()=>{c&&i&&w&&!S&&!k&&(R(!0),r(!0))},[c,i,w,S,k]),B(()=>{if(i&&!w&&D){const l=setTimeout(()=>{a(null)},2e3);return()=>clearTimeout(l)}},[i,w,D]),B(()=>{if(W){const l=setTimeout(()=>{$(!0)},3e4);return()=>clearTimeout(l)}},[W]),B(()=>{S&&v&&(r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1),s&&s(v))},[S,v,s]);const Q=_(async l=>{if(l.preventDefault(),!g.trim()){a("Please enter a valid email address");return}if(!L){a("Dynamic context not ready. Please try again.");return}a(null);try{await L(g),x("otp")}catch(H){a("Failed to send verification code. Please try again."),n&&n(`Failed to send verification code: ${String(H)}`)}},[g,L,n]),U=_(async l=>{if(l.preventDefault(),!f.trim()){a("Please enter the verification code");return}if(!P){a("Dynamic context not ready. Please try again.");return}a(null);try{await P(f),j&&!O&&T(Date.now())}catch(H){a("Invalid verification code. Please try again."),n&&n(`OTP verification failed: ${String(H)}`)}},[f,P,j,O,n]),Y=_(async()=>{try{F&&await F(),r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1)}catch{r(!1),x("options"),d(""),u(""),a(null),T(null),$(!1)}},[F]);if(!i)return t("div",{className:p,children:t(m,{variant:"primary",disabled:!0,theme:e,children:h})});if(!w)return o("div",{className:p,children:[t(m,{variant:"primary",disabled:!0,theme:e,children:"Loading Dynamic..."}),D&&t("div",{style:{marginTop:"8px",fontSize:"12px",color:e.colors.error,padding:e.spacing.xs,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,borderRadius:e.borderRadius.sm},children:"Initializing Dynamic context..."})]});const X=()=>o("div",{className:"w-full max-w-[450px] space-y-8",children:[t("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:t("h1",{style:{fontSize:"1.875rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Get Started"})}),t("div",{style:{marginBottom:e.spacing.md},children:t(m,{variant:"primary",fullWidth:!0,onClick:()=>x("email"),theme:e,children:"Continue with Email"})}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginTop:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})})]}),Z=()=>o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.primary,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("span",{style:{fontSize:"1.25rem"},children:"\u2709\uFE0F"})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Email Authentication"}),t("p",{style:{color:e.colors.textMuted},children:"Enter your email to get started"})]}),o("form",{onSubmit:Q,style:{marginBottom:e.spacing.md},children:[o("div",{style:{marginBottom:e.spacing.md},children:[t("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Email Address"}),t(J,{type:"email",value:g,onChange:l=>d(l.target.value),placeholder:"Enter your email address",required:!0,theme:e})]}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{type:"submit",variant:"primary",fullWidth:!0,disabled:!g.trim(),theme:e,children:"Send Verification Code"}),t(m,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{x("options"),a(null),d("")},theme:e,children:"\u2190 Back"})]})]})]}),ee=()=>o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.success,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("span",{style:{fontSize:"1.25rem",color:"#ffffff"},children:"\u2713"})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Check Your Email"}),o("p",{style:{color:e.colors.textMuted},children:["Enter the verification code sent to"," ",t("span",{style:{color:e.colors.primary,fontWeight:"medium"},children:g})]})]}),o("form",{onSubmit:U,style:{marginBottom:e.spacing.md},children:[o("div",{style:{marginBottom:e.spacing.md},children:[t("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Verification Code"}),t(J,{type:"text",value:f,onChange:l=>u(l.target.value),placeholder:"Enter 6-digit code",maxLength:6,required:!0,theme:e,className:"ibm-plex-mono",style:{textAlign:"center",fontSize:"1.3rem",letterSpacing:"0.2em",fontFamily:"IBM Plex Mono"}})]}),z&&t("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:z})}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{type:"submit",variant:"primary",fullWidth:!0,disabled:!f.trim(),theme:e,children:"Verify Code"}),t(m,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{a(null),u(""),x("email")},theme:e,children:"\u2190 Back to Email"})]})]})]}),te=()=>{const l=V||W&&Date.now()-(W||0)>3e4;return o("div",{className:"w-full max-w-[450px] space-y-6",children:[o("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.warning,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t("div",{style:{width:"1.5rem",height:"1.5rem",border:`2px solid ${e.colors.text}`,borderTop:"2px solid transparent",borderRadius:"50%",animation:"spin 1s linear infinite"}})}),t("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Setting up your wallet..."}),t("p",{style:{color:e.colors.textMuted},children:"Creating your wallet automatically. This may take a few moments."}),W&&o("div",{style:{fontSize:e.typography.fontSize.sm,color:e.colors.textMuted,marginTop:e.spacing.sm},children:[o("p",{children:["Waiting time:"," ",Math.floor((Date.now()-(W||0))/1e3),"s"]}),V&&t("p",{style:{color:e.colors.warning,fontWeight:"medium"},children:"\u26A0\uFE0F Taking longer than expected"})]})]}),o("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t(m,{variant:"secondary",fullWidth:!0,onClick:()=>window.location.reload(),theme:e,children:"Retry Automatic Creation"}),t(m,{variant:"secondary",fullWidth:!0,onClick:Y,theme:e,children:"Cancel & Start Over"})]}),l&&o("div",{style:{marginTop:e.spacing.md,padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef3c7":`${e.colors.warning}20`,border:`1px solid ${e.mode==="light"?"#fde68a":e.colors.warning}`,borderRadius:e.borderRadius.md},children:[t("p",{style:{color:e.colors.warning,fontSize:e.typography.fontSize.sm,marginBottom:e.spacing.sm},children:"\u26A0\uFE0F Wallet creation is taking longer than expected. This might be due to network issues."}),o("div",{style:{fontSize:e.typography.fontSize.xs,color:e.colors.textMuted},children:[t("p",{children:"\u2022 Try refreshing the page to restart automatic creation"}),t("p",{children:"\u2022 Check your internet connection"}),t("p",{children:"\u2022 If the issue persists, start over with a new email"})]})]})]})},G=()=>w?I&&!v?te():q==="otp"?ee():q==="email"?Z():X():o("div",{style:{textAlign:"center",padding:e.spacing.xl},children:[t("div",{style:{width:"2.5rem",height:"2.5rem",border:`2px solid ${e.colors.border}`,borderTop:`2px solid ${e.colors.primary}`,borderRadius:"50%",animation:"spin 1s linear infinite",margin:`0 auto ${e.spacing.md}`}}),t("p",{style:{color:e.colors.textMuted},children:"Initializing Dynamic..."})]});return S&&v?t("div",{className:p,children:o(m,{variant:"primary",onClick:Y,theme:e,children:["Logout (",v.slice(0,6),"...",v.slice(-4),")"]})}):c?o("div",{className:p,children:[o("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"20px",flexDirection:"column",gap:"12px"},children:[t("div",{style:{width:"40px",height:"40px",border:"3px solid #e5e7eb",borderTop:"3px solid #3b82f6",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t("p",{style:{color:"#6b7280",fontSize:"14px"},children:"Opening login..."})]}),t(K,{isOpen:C,onClose:()=>{(!I||S)&&(r(!1),x("options"),d(""),u(""),a(null))},title:"",theme:e,children:G()}),t("style",{dangerouslySetInnerHTML:{__html:`
3
3
  @keyframes spin {
4
4
  0% { transform: rotate(0deg); }
5
5
  100% { transform: rotate(360deg); }
package/dist/auth-privy.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use client";
2
- import{jsx as r,jsxs as p}from"react/jsx-runtime";import{useState as x,useEffect as d}from"react";import{B as c,c as T}from"./Button-WjpgErig.js";import{usePrivy as w,useLogin as P,useLogout as $}from"@privy-io/react-auth";const j=({onAuthSuccess:m,onAuthError:n,theme:v="light",className:a="",buttonText:f="Login with Privy",autoTrigger:u=!1})=>{const l=T(v),[h,b]=x(!1),[g,L]=x(!1),{ready:o,authenticated:s,user:t}=w(),{login:N}=P(),{logout:S}=$();d(()=>{b(!0)},[]),d(()=>{u&&o&&!s&&h&&!g&&(L(!0),y())},[u,o,s,h,g]),d(()=>{if(o&&s&&t&&m){const e=t.wallet?.address||t.email?.address;e&&m(e)}},[o,s,t,m]),d(()=>{},[o,s,n]);const y=()=>{try{N()}catch(e){const i=`Login failed: ${String(e)}`;n?n(i):console.error(i)}},C=()=>{try{S()}catch(e){const i=`Logout failed: ${String(e)}`;n?n(i):console.error(i)}};if(!h)return r("div",{className:a,children:r(c,{variant:"primary",disabled:!0,theme:l,children:f})});if(!o)return r("div",{className:a,children:r(c,{variant:"primary",disabled:!0,theme:l,children:"Loading..."})});if(s&&t){const e=t.wallet?.address||t.email?.address,i=e?`${e.slice(0,6)}...${e.slice(-4)}`:"Connected";return r("div",{className:a,children:p(c,{variant:"primary",onClick:C,theme:l,children:["Logout (",i,")"]})})}return u?p("div",{className:a,children:[p("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"20px",flexDirection:"column",gap:"12px"},children:[r("div",{style:{width:"40px",height:"40px",border:"3px solid #e5e7eb",borderTop:"3px solid #3b82f6",borderRadius:"50%",animation:"spin 1s linear infinite"}}),r("p",{style:{color:"#6b7280",fontSize:"14px"},children:"Opening login..."})]}),r("style",{dangerouslySetInnerHTML:{__html:`
2
+ import{jsx as r,jsxs as p}from"react/jsx-runtime";import{useState as x,useEffect as d}from"react";import{B as c,c as T}from"./Button-4ryz2e1P.js";import{usePrivy as w,useLogin as P,useLogout as $}from"@privy-io/react-auth";const j=({onAuthSuccess:m,onAuthError:n,theme:v="light",className:a="",buttonText:f="Login with Privy",autoTrigger:u=!1})=>{const l=T(v),[h,b]=x(!1),[g,L]=x(!1),{ready:o,authenticated:s,user:t}=w(),{login:N}=P(),{logout:S}=$();d(()=>{b(!0)},[]),d(()=>{u&&o&&!s&&h&&!g&&(L(!0),y())},[u,o,s,h,g]),d(()=>{if(o&&s&&t&&m){const e=t.wallet?.address||t.email?.address;e&&m(e)}},[o,s,t,m]),d(()=>{},[o,s,n]);const y=()=>{try{N()}catch(e){const i=`Login failed: ${String(e)}`;n?n(i):console.error(i)}},C=()=>{try{S()}catch(e){const i=`Logout failed: ${String(e)}`;n?n(i):console.error(i)}};if(!h)return r("div",{className:a,children:r(c,{variant:"primary",disabled:!0,theme:l,children:f})});if(!o)return r("div",{className:a,children:r(c,{variant:"primary",disabled:!0,theme:l,children:"Loading..."})});if(s&&t){const e=t.wallet?.address||t.email?.address,i=e?`${e.slice(0,6)}...${e.slice(-4)}`:"Connected";return r("div",{className:a,children:p(c,{variant:"primary",onClick:C,theme:l,children:["Logout (",i,")"]})})}return u?p("div",{className:a,children:[p("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"20px",flexDirection:"column",gap:"12px"},children:[r("div",{style:{width:"40px",height:"40px",border:"3px solid #e5e7eb",borderTop:"3px solid #3b82f6",borderRadius:"50%",animation:"spin 1s linear infinite"}}),r("p",{style:{color:"#6b7280",fontSize:"14px"},children:"Opening login..."})]}),r("style",{dangerouslySetInnerHTML:{__html:`
3
3
  @keyframes spin {
4
4
  0% { transform: rotate(0deg); }
5
5
  100% { transform: rotate(360deg); }