@frak-labs/components
Version:
Frak Wallet components, helping any person to interact with the Frak wallet.
89 lines • 6.75 kB
JavaScript
import{C as e,D as t,S as n,d as r,i,l as a,o,r as s,w as c}from"./loader.js";import{a as ee,d as l,f as u,h as d,l as te,m as f,n as p,p as m,s as h,t as g,u as _}from"./defaults.DjBUlRT8.js";import{r as ne,t as re}from"./GiftIcon.DabDdDcp.js";import{t as ie}from"./useGlobalComponents.4DaqvbCn.js";import{t as ae}from"./useLightDomStyles.DNP8gafA.js";import{i as v,r as oe,t as y}from"./rewards.BaTam2j1.js";var se=`PostPurchase_card__5fv5lh0`,b=`PostPurchase_cardLayout__5fv5lh1`,ce=`PostPurchase_cardLeft__5fv5lh2`,le=`PostPurchase_cardRight__5fv5lh3`,ue=`PostPurchase_cta__5fv5lh6 sharedBaseCss_buttonReset__7cswil0`,x=`PostPurchase_customImage__5fv5lha`,de=`PostPurchase_frakLogo__5fv5lhb`,fe=`PostPurchase_giftIcon__5fv5lh8`,pe=`PostPurchase_icon__5fv5lh7`,me=`PostPurchase_imageWrapper__5fv5lh9`,he=`PostPurchase_message__5fv5lh5`;function ge(e,t,n,r){let i=e?.isReferred?`referee`:`referrer`,a=y(t.rewards,{targetInteraction:`purchase`,currency:n,audience:i,products:r});if(!a)return null;let{campaign:o}=a,s=e?.isReferred&&o.referee?`referee`:`referrer`;return{variant:s,reward:s===`referee`?o.referee:o.referrer,merchantDomain:t.onChainMetadata.domain}}function S({customerId:d,orderId:y,token:S,sharingUrl:_e,merchantId:C,placement:w,classname:T=``,variant:E,badgeText:D,referrerText:O,refereeText:k,ctaText:A,preview:j,previewVariant:M,products:N,imageUrl:P}){let F=!!j,{shouldRender:I,isHidden:L,isClientReady:R}=h(),z=p(w),B=ee(),V=_(()=>r(N),[N]);ae(`frak-post-purchase`,w,z?.components?.postPurchase?.css,`.PostPurchase_card__5fv5lh0 {
padding: 16px;
border-radius: 12px;
background-color: var(--surface-background__pbq4akc);
border: 1px solid var(--border-default__pbq4akv);
}
.PostPurchase_cardLayout__5fv5lh1 {
display: flex;
flex-direction: row;
align-items: center;
gap: 32px;
}
.PostPurchase_cardLeft__5fv5lh2 {
flex-grow: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.PostPurchase_cardRight__5fv5lh3 {
flex-shrink: 0;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 8px;
text-align: right;
}
.PostPurchase_badge__5fv5lh4 {
align-self: flex-start;
background-color: #FFF534;
border-radius: 4px;
padding: 4px 8px;
font-size: 12px;
font-weight: 600;
line-height: 12px;
color: var(--text-primary__pbq4ak0);
}
.PostPurchase_message__5fv5lh5 {
margin: 0;
font-size: 16px;
line-height: 22px;
color: var(--text-primary__pbq4ak0);
font-weight: 600;
}
.PostPurchase_cta__5fv5lh6 {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 4px;
padding: 12px 16px;
border-radius: 9999px;
background-color: var(--text-primary__pbq4ak0);
color: var(--text-onAction__pbq4ak6);
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
}
.PostPurchase_cta__5fv5lh6:disabled {
opacity: 0.7;
cursor: default;
}
.PostPurchase_icon__5fv5lh7 {
margin: -2px 0;
}
.PostPurchase_giftIcon__5fv5lh8 {
display: block;
flex-shrink: 0;
}
.PostPurchase_imageWrapper__5fv5lh9 {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
width: 80px;
height: 80px;
overflow: hidden;
}
.PostPurchase_customImage__5fv5lha {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
display: block;
}
.PostPurchase_frakLogo__5fv5lhb {
display: block;
margin-left: auto;
}`,t);let[H,ve]=l(null),[U,W]=l(!1);u(()=>{F||!R||!d||!y||!S||i({customerId:d,orderId:y,token:S,merchantId:C}).catch(()=>{})},[F,R,d,y,S,C]),u(()=>{if(F||!R||U)return;let t=window.FrakSetup?.client;t&&Promise.all([o(t),a(t)]).then(([e,t])=>{W(!0),ve({referralStatus:e,merchantInfo:t})}).catch(t=>{if(t instanceof c&&t.code===e.configError){W(!0);return}})},[F,R,U]);let G=_(()=>H?ge(H.referralStatus,H.merchantInfo,window.FrakSetup?.client?.config?.metadata?.currency,V):null,[H,V]),K=te(null),q=E??G?.variant??(F?M??`referrer`:void 0),J=_e??G?.merchantDomain,Y=_(()=>{if(!G?.reward)return;let e=window.FrakSetup?.client?.config?.metadata?.currency;return oe(G.reward,e)},[G?.reward]),ye=ie(),X=z?.components?.postPurchase??ye?.postPurchase,Z=D??X?.badgeText,Q=P??X?.imageUrl,$=_(()=>{let e=g[B].postPurchase;return{message:q===`referee`?Y?v(k??X?.refereeText??e.refereeText,Y):k??X?.refereeNoRewardText??e.refereeNoRewardText:Y?v(O??X?.referrerText??e.referrerText,Y):O??X?.referrerNoRewardText??e.referrerNoRewardText,cta:Y?v(A??X?.ctaText??e.ctaText,Y):A??X?.ctaNoRewardText??e.ctaNoRewardText}},[B,q,Y,X,O,k,A]);u(()=>{q&&K.current!==q&&R&&(!F&&(!I||L)||(n(window.FrakSetup?.client,`post_purchase_impression`,{placement:w,variant:q,has_reward:!!G?.reward}),K.current=q))},[q,I,L,R,F,w,G?.reward]);let be=m(()=>{q&&(n(window.FrakSetup?.client,`post_purchase_clicked`,{placement:w,variant:q}),s(void 0,w,{link:J,products:V}))},[q,w,J,V]);return!q||!F&&(!I||L||!G)?null:f(`div`,{className:[se,T].filter(Boolean).join(` `),children:f(`div`,{class:b,children:[f(`div`,{class:ce,children:[Z&&f(`span`,{class:`PostPurchase_badge__5fv5lh4`,children:Z}),f(`p`,{class:he,children:$.message}),f(`button`,{type:`button`,className:`${ue} button`,disabled:!F&&!R,onClick:F?void 0:be,children:[$.cta,f(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,className:`${pe} button`,children:f(`path`,{d:`M13.9 11.14C13.99 11.05 14.15 11.11 14.15 11.24V11.64C14.15 13.05 12.63 14.19 10.75 14.19C8.87 14.19 7.34 13.05 7.34 11.64V11.24C7.34 11.11 7.51 11.05 7.59 11.14C8.35 11.93 9.48 12.43 10.75 12.43C12.01 12.43 13.15 11.93 13.9 11.14ZM1.85 9.65C1.85 9.51 2.01 9.44 2.1 9.54C2.85 10.32 3.99 10.82 5.25 10.82C5.52 10.82 5.79 10.8 6.04 10.76C6.26 10.72 6.47 10.88 6.47 11.1V12.17C6.47 12.32 6.37 12.45 6.22 12.48C5.92 12.55 5.59 12.59 5.25 12.59C3.37 12.59 1.85 11.45 1.85 10.04V9.65ZM10.75 6.21C12.63 6.21 14.15 7.35 14.15 8.75C14.15 10.16 12.63 11.3 10.75 11.3C8.87 11.3 7.34 10.16 7.34 8.75C7.34 7.35 8.87 6.21 10.75 6.21ZM1.85 6.85C1.85 6.71 2.01 6.65 2.1 6.74C2.85 7.53 3.99 8.03 5.25 8.03C5.52 8.03 5.79 8 6.04 7.96C6.26 7.92 6.47 8.09 6.47 8.3V9.37C6.47 9.52 6.37 9.65 6.22 9.69C5.92 9.75 5.59 9.79 5.25 9.79C3.37 9.79 1.85 8.65 1.85 7.24V6.85ZM5.25 1.81C7.13 1.81 8.66 2.95 8.66 4.36C8.66 5.76 7.13 6.9 5.25 6.9C3.37 6.9 1.85 5.76 1.85 4.36C1.85 2.95 3.37 1.81 5.25 1.81Z`,fill:`currentColor`})})]})]}),f(`div`,{class:le,children:[Q?f(`span`,{class:me,children:f(`img`,{src:Q,alt:``,class:x})}):f(re,{className:fe,width:80,height:80}),f(ne,{className:de,width:42,height:24})]})]})})}d(S,`frak-post-purchase`,[`customerId`,`orderId`,`token`,`sharingUrl`,`merchantId`,`placement`,`classname`,`variant`,`badgeText`,`referrerText`,`refereeText`,`ctaText`,`products`,`preview`,`previewVariant`,`imageUrl`],{shadow:!1});export{S as PostPurchase};