import"react";import d from"@emotion/styled";import{Box as n,Button as l,Flex as p,Text as s}from"@chakra-ui/react";var t="https://imagedelivery.net/6iczWBYEbx_1dYNU7ek_bA/49bcce28-c272-46c8-ebf8-6472a9c32e00/medium";import{jsx as e,jsxs as o}from"react/jsx-runtime";var r=d.img`
  width: 100%;
  height: 100%;
  object-fit: cover;
`,i=d(n)`
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid white;
`,x=({onClickConnectWallet:c,clientConfig:a})=>{let{profile:m}=a,b=m?.profileImage;return o(n,{bg:"background",children:[o(p,{justifyContent:"center",children:[e(i,{zIndex:1,children:e(r,{src:b||t,alt:"brand"})}),e(i,{marginLeft:"-10px",children:e(r,{src:t})})]}),o(n,{style:{textAlign:"center"},children:[e(s,{textAlign:"center",fontWeight:500,fontSize:12,marginY:"20px  !important",children:"Choose how you want to connect. There are several wallet providers."}),e(l,{variant:"primary",onClick:c,children:"Connect Wallet"})]})]})},Y=x;export{Y as default};
