@frak-labs/components
Version:
Frak Wallet components, helping any person to interact with the Frak wallet.
40 lines (37 loc) • 2.46 kB
JavaScript
import{a as e,d as t,f as n,g as r,h as i,m as a,n as o,r as s,s as c,t as l,u}from"./defaults.DjBUlRT8.js";import{t as d}from"./useReward.Bi4Hs7kk.js";import{t as f}from"./embeddedWallet.Bt2bp_-q.js";function p(e){return a(`svg`,{fill:`none`,height:`1em`,viewBox:`0 0 28 28`,width:`1em`,xmlns:`http://www.w3.org/2000/svg`,...e,children:[a(`title`,{children:`Gift icon`}),a(`path`,{d:`m23.14 14v11.43h-18.29v-11.43m9.14 11.43v-17.14m0 0h-5.14c-0.76 0-1.48-0.3-2.02-0.84s-0.84-1.26-0.84-2.020.3-1.480.84-2.02 1.26-0.84 2.02-0.84c4 0 5.14 5.71 5.14 5.71zm0 0h5.14c0.76 0 1.48-0.3 2.02-0.84s0.84-1.260.84-2.02-0.3-1.48-0.84-2.02-1.26-0.84-2.02-0.84c-4 0-5.14 5.71-5.14 5.71zm-11.43 0h22.86v5.71h-22.86z`,stroke:`#fff`,"stroke-linecap":`round`,"stroke-linejoin":`round`})]})}function m(){`vibrate`in navigator&&navigator.vibrate(10)}function h(e,t){m(),f(e,t)}function g({placement:i,classname:f=``,useReward:m,targetInteraction:g}){let _=e(),v=o(i),y=u(()=>v?.targetInteraction===void 0?g:v.targetInteraction,[v?.targetInteraction,g]),b=u(()=>m===!0,[m]),{shouldRender:x,isHidden:S,isClientReady:C}=c(),{reward:w}=d(b&&C,y),[T,E]=t(`right`);if(n(()=>{let e=v?.components?.buttonWallet?.position,t=window.FrakSetup?.modalWalletConfig?.metadata?.position;E(e??t??`right`)},[v?.components?.buttonWallet?.position]),!x||S)return null;let D=[`button`,`button__fadeIn`,T===`left`?`button__left`:`button__right`,f].filter(Boolean).join(` `);return a(r,{children:[a(`style`,{children:s(`
.button {
all: unset;
position: fixed;
bottom: 20px;
z-index: 2000000;
display: flex;
justify-content: center;
align-items: center;
background-color: #3e557e;
width: 45px;
height: 45px;
border-radius: 50%;
cursor: pointer;
text-align: center;
font-size: 24px;
}
.button__left {
left: 20px;
}
.button__right {
right: 20px;
}
.reward {
position: absolute;
top: -4px;
right: 27px;
padding: 2px 3px;
border-radius: 5px;
background: #ff3f3f;
font-size: 9px;
color: #fff;
font-weight: 600;
white-space: nowrap;
line-height: 9px;
}
`,v?.components?.buttonWallet?.css)}),a(`button`,{type:`button`,"aria-label":l[_].buttonWallet.ariaLabel,part:`button`,disabled:!C,class:D,onClick:()=>{h(y,i)},children:[a(p,{}),w&&a(`span`,{class:`reward`,children:w})]})]})}i(g,`frak-button-wallet`,[`placement`,`classname`,`useReward`,`targetInteraction`],{shadow:!0});export{g as ButtonWallet};