@privy-io/react-auth
Version:
React client for the Privy Auth API
17 lines (15 loc) • 3.06 kB
JavaScript
import{jsx as e,jsxs as r,Fragment as o}from"react/jsx-runtime";import t from"qrcode";import l from"react";import{styled as i}from"styled-components";import{u as c}from"./context-DLtU3JQy.mjs";import{D as n,E as g}from"./use-export-wallet-_wu5ex5t.mjs";const a=()=>/*#__PURE__*/e("svg",{width:"200",height:"200",viewBox:"-77 -77 200 200",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{height:"28px",width:"28px"},children:/*#__PURE__*/e("rect",{width:"50",height:"50",fill:"black",rx:10,ry:10})});let h=(e,r,o,t,l)=>{for(let i=r;i<r+t;i++)for(let r=o;r<o+l;r++){let o=e?.[r];o&&o[i]&&(o[i]=0)}return e},m=(e,r)=>{let o=t.create(e,{errorCorrectionLevel:r}).modules,l=g(Array.from(o.data),o.size);return l=h(l,0,0,7,7),l=h(l,l.length-7,0,7,7),h(l,0,l.length-7,7,7)},d=({x:r,y:t,cellSize:l,bgColor:i,fgColor:c})=>
/*#__PURE__*/e(o,{children:[0,1,2].map((o=>/*#__PURE__*/e("circle",{r:l*(7-2*o)/2,cx:r+7*l/2,cy:t+7*l/2,fill:o%2!=0?i:c},`finder-${r}-${t}-${o}`)))}),p=({cellSize:r,matrixSize:t,bgColor:l,fgColor:i})=>/*#__PURE__*/e(o,{children:[[0,0],[(t-7)*r,0],[0,(t-7)*r]].map((([o,t])=>/*#__PURE__*/e(d,{x:o,y:t,cellSize:r,bgColor:l,fgColor:i},`finder-${o}-${t}`)))}),s=({matrix:r,cellSize:t,color:i})=>/*#__PURE__*/e(o,{children:r.map(((r,o)=>r.map(((r,c)=>r?/*#__PURE__*/e("rect",{height:t-.4,width:t-.4,x:o*t+.1*t,y:c*t+.1*t,rx:.5*t,ry:.5*t,fill:i},`cell-${o}-${c}`):/*#__PURE__*/e(l.Fragment,{},`circle-${o}-${c}`)))))}),u=({cellSize:t,matrixSize:l,element:i,sizePercentage:c,bgColor:n})=>{if(!i)/*#__PURE__*/return e(o,{});let g=l*(c||.14),a=Math.floor(l/2-g/2),h=Math.floor(l/2+g/2);(h-a)%2!=l%2&&(h+=1);let m=(h-a)*t,d=m-.2*m,p=a*t;/*#__PURE__*/return r(o,{children:[/*#__PURE__*/e("rect",{x:a*t,y:a*t,width:m,height:m,fill:n}),/*#__PURE__*/e(i,{x:p+.1*m,y:p+.1*m,height:d,width:d})]})},f=o=>{let t=o.outputSize,l=m(o.url,o.errorCorrectionLevel),i=t/l.length,c=n(2*i,{min:.025*t,max:.036*t});/*#__PURE__*/return r("svg",{height:o.outputSize,width:o.outputSize,viewBox:`0 0 ${o.outputSize} ${o.outputSize}`,style:{height:"100%",width:"100%",padding:`${c}px`},children:[/*#__PURE__*/e(s,{matrix:l,cellSize:i,color:o.fgColor}),/*#__PURE__*/e(p,{cellSize:i,matrixSize:l.length,fgColor:o.fgColor,bgColor:o.bgColor}),/*#__PURE__*/e(u,{cellSize:i,element:o.logo?.element,bgColor:o.bgColor,matrixSize:l.length})]})},x=i.div.attrs({className:"ph-no-capture"})`
display: flex;
justify-content: center;
align-items: center;
height: ${e=>`${e.$size}px`};
width: ${e=>`${e.$size}px`};
margin: auto;
background-color: ${e=>e.$bgColor};
&& {
border-width: 2px;
border-color: ${e=>e.$borderColor};
border-radius: var(--privy-border-radius-md);
}
`;const C=r=>{let{appearance:o}=c(),t=r.bgColor||"#FFFFFF",l=r.fgColor||"#000000",i=r.size||160,n="dark"===o.palette.colorScheme?t:l;/*#__PURE__*/return e(x,{$size:i,$bgColor:t,$fgColor:l,$borderColor:n,children:/*#__PURE__*/e(f,{url:r.url,logo:{element:r.squareLogoElement??a},outputSize:i,bgColor:t,fgColor:l,errorCorrectionLevel:r.errorCorrectionLevel||"Q"})})};export{C as Q};