@zeniai/web-cockpit-ui 1.14.82-qa → 1.14.83-dev

package/dist/assets/ZeniAccountListViewPage-D1I68D9x-zovkBtXJ.js

@@ -0,0 +1,441 @@
+import{u as J,a8 as Me,bB as Ie,i as _e,bv as Ee,a as K,bo as De,j as n,dc as W,C as o,aa as Fe,b as t,fF as Re,dN as Ge,dd as te,de as ie,iN as Ne,bn as R,cH as fe,cf as Ue,t as S,as as Oe,ah as We,L as Ye,cP as Ve,cq as ye,af as b,a$ as Ze,d4 as qe,gC as F,bm as G,R as j,ai as X,iO as He,d as Qe,e as Je,aj as Ke,dP as Xe,d6 as en,hr as nn,s as u,f4 as tn,h3 as on,iP as rn,B as sn,iQ as an,cz as cn,bq as ln}from"./index-2CdI-B2B.js";import{a as g}from"./core-tlHkQPPu.js";import{n as i}from"./mui-kiGMfX4-.js";import{fS as dn}from"./zeni-epic-state-Bo1aGezX.js";import{t as pn}from"./auto-transfer-rule-D1bNopxW-BXcmbJh5.js";import{t as un}from"./shield-E_rJ2OWj-kTEIYW8Q.js";import{h as mn}from"./ZeniAccountNavBarPieces-2a3O6Mrv-CEltxOUL.js";import{d as hn}from"./ZeniTransferAmountSlider-CPHnjZJx-BmCI7vMf.js";import"./sentry-Dhk5jNhq.js";import"./liveblocks-BrzOBACZ.js";import"./utils-BLUF9kAp.js";import"./analytics-CeQu-r45.js";const{spendManagement:{treasury:{promoBanner:m,promoPage:oe}}}=K.getLocalizedStrings(),gn=({yieldPercentage:e=4.35,insuredAmount:s=5e5,onGetStartedClick:y,style:z})=>{const r=J(),C=(l,M)=>Object.entries(M).reduce((I,[A,w])=>I.replace(new RegExp(`__${A}__`,"g"),w),l),B=`${e}%`,T=(f=s,`$${Intl.NumberFormat("en",{notation:"compact"}).format(f)}`);var f;const v=[{icon:n.jsx(An,{}),title:C(m.features.yield,{yieldPercentage:B}),id:"yield"},{icon:n.jsx(Sn,{}),title:C(m.features.insured,{insuredAmount:T}),id:"insured"},{icon:n.jsx(zn,{}),title:m.features.liquidity,showAsterisk:!0,id:"liquidity"},{icon:n.jsx(Cn,{}),title:m.features.automation,id:"automation"}];return n.jsxs(xn,{style:z,children:[n.jsx(wn,{}),r!=="small"&&n.jsxs(n.Fragment,{children:[n.jsx($n,{}),n.jsx(fn,{})]}),n.jsx(yn,{windowSize:r,children:r==="small"?n.jsxs(n.Fragment,{children:[n.jsxs(kn,{children:[n.jsx(re,{windowSize:r,children:n.jsx(se,{windowSize:r})}),n.jsx(ae,{children:m.title})]}),n.jsx(ce,{windowSize:r,children:v.map(l=>n.jsxs(le,{windowSize:r,children:[n.jsx(de,{children:l.icon}),n.jsxs(pe,{children:[l.title,l.showAsterisk===!0&&n.jsx(ue,{children:"*"})]})]},l.id))}),n.jsx(jn,{children:n.jsx(me,{children:n.jsx(he,{variant:"primary",label:m.button,onClick:y,size:"small",style:{padding:`${t.sp1} 12px`}})})}),n.jsx(ge,{windowSize:r,children:n.jsxs(xe,{windowSize:r,children:[m.disclaimer.split("__termsLink__")[0],n.jsx(we,{href:oe.zeniTermsOfServiceLink,target:"_blank",rel:"noopener noreferrer",children:m.termsLink}),m.disclaimer.split("__termsLink__")[1]]})})]}):n.jsxs(n.Fragment,{children:[n.jsx(re,{windowSize:r,children:n.jsx(se,{windowSize:r})}),n.jsxs(bn,{windowSize:r,children:[n.jsx(ae,{children:m.title}),n.jsx(ce,{windowSize:r,children:v.map(l=>n.jsxs(le,{windowSize:r,children:[n.jsx(de,{children:l.icon}),n.jsxs(pe,{children:[l.title,l.showAsterisk===!0&&n.jsx(ue,{children:"*"})]})]},l.id))}),n.jsx(ge,{windowSize:r,children:n.jsxs(xe,{windowSize:r,children:[m.disclaimer.split("__termsLink__")[0],n.jsx(we,{href:oe.zeniTermsOfServiceLink,target:"_blank",rel:"noopener noreferrer",children:m.termsLink}),m.disclaimer.split("__termsLink__")[1]]})})]}),n.jsx(me,{children:n.jsx(he,{variant:"primary",label:m.button,onClick:y,size:"small",style:{padding:`${t.sp1} 12px`}})})]})})]})},xn=i.div`
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  background: ${o.neutralGrey5Light};
+  border: 1px solid ${o.brandColorGold};
+  border-radius: ${t.sp2};
+  overflow: hidden;
+  width: 100%;
+`,wn=i.div`
+  position: absolute;
+  top: ${t.sp0};
+  left: ${t.sp0};
+  right: ${t.sp0};
+  bottom: ${t.sp0};
+  background: ${o.brandColorGold};
+  opacity: 0.2;
+
+  &::before {
+    content: "";
+    position: absolute;
+    top: ${t.sp0};
+    left: ${t.sp0};
+    right: ${t.sp0};
+    bottom: ${t.sp0};
+    background: ${o.brandColorGoldDark};
+    opacity: 0.45;
+    background-image: repeating-linear-gradient(
+      45deg,
+      transparent,
+      transparent ${t.sp2},
+      rgba(199, 116, 25, 0.1) ${t.sp2},
+      rgba(199, 116, 25, 0.1) ${t.sp3}
+    );
+  }
+`,$n=i.div`
+  position: absolute;
+  top: ${t.sp0};
+  right: ${t.sp0};
+  width: 200px;
+  height: 150px;
+  z-index: 0;
+  pointer-events: none;
+  overflow: hidden;
+  background-image: url("https://storage.googleapis.com/zeni-apis.appspot.com/images/treasury-promo-right-pattern.png");
+  background-repeat: no-repeat;
+  background-position: top right;
+  background-size: contain;
+`,fn=i.div`
+  position: absolute;
+  bottom: -${t.sp1};
+  left: -${t.sp1};
+  width: 150px;
+  height: 100px;
+  z-index: 0;
+  pointer-events: none;
+  overflow: hidden;
+  background-image: url("https://storage.googleapis.com/zeni-apis.appspot.com/images/treasury-promo-left-pattern.png");
+  background-repeat: no-repeat;
+  background-position: bottom left;
+  background-size: contain;
+`,yn=i.div`
+  position: relative;
+  display: flex;
+  flex-direction: ${e=>e.windowSize==="small"?"column":"row"};
+  align-items: ${e=>e.windowSize==="small"?"stretch":"center"};
+  gap: ${e=>e.windowSize==="small"?t.sp2:"12px"};
+  padding: ${e=>e.windowSize==="small"?t.sp3:`${t.sp3} ${t.sp4}`};
+  z-index: 1;
+`,re=i.div`
+  display: flex;
+  align-self: flex-start;
+  justify-content: center;
+  width: ${e=>e.windowSize==="small"?t.sp6:t.sp9};
+  height: ${e=>e.windowSize==="small"?t.sp6:t.sp9};
+  flex-shrink: 0;
+`,kn=i.div`
+  display: flex;
+  align-items: center;
+  gap: ${t.sp2};
+`,jn=i.div`
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  margin-top: ${t.sp2};
+  margin-left: ${t.sp7};
+`,se=i(on)`
+  width: ${e=>e.windowSize==="small"?t.sp6:t.sp9};
+  height: ${e=>e.windowSize==="small"?t.sp6:t.sp9};
+  color: ${o.brandColorGoldDark};
+
+  & path {
+    stroke: ${o.brandColorGoldDark};
+    stroke-width: 1px;
+  }
+`,bn=i.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${t.sp1};
+  flex: 1;
+`,ae=i(rn)`
+  color: ${o.brandColorGoldDark};
+  margin-bottom: ${t.sp1};
+`,ce=i.div`
+  display: ${e=>e.windowSize==="small"?"flex":"grid"};
+  ${e=>e.windowSize==="small"?`
+      flex-direction: column;
+      gap: ${t.sp2};
+      margin-left: ${t.sp7};
+    `:`
+      grid-template-columns: 1fr 1fr;
+      gap: ${t.sp1};
+    `}
+`,le=i.div`
+  display: flex;
+  align-items: ${e=>e.windowSize==="small"?"flex-start":"center"};
+  gap: ${t.sp1};
+`,de=i.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: ${t.sp3};
+  height: ${t.sp3};
+  flex-shrink: 0;
+`,pe=i(b)`
+  color: ${o.primaryLight};
+`,ue=i.span`
+  color: ${o.primaryLight};
+`,me=i.div`
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+`,he=i(sn)`
+  background: ${o.brandColorGoldDark};
+  border-color: ${o.brandColorGoldDark};
+  color: ${o.neutralGrey5Light};
+  :hover {
+    background: ${o.brandColorGoldDark};
+    border-color: ${o.brandColorGoldDark};
+    color: ${o.neutralGrey5Light};
+  }
+`,ge=i.div`
+  position: relative;
+  margin-top: ${e=>e.windowSize==="small"?t.sp2:"0"};
+  padding: ${e=>e.windowSize==="small"?`0 ${t.sp2}`:"0"};
+`,xe=i(X)`
+  color: ${o.heroLight};
+  white-space: pre-line;
+  text-align: ${e=>e.windowSize==="small"?"center":"left"};
+`,we=i.a`
+  color: ${o.heroLight};
+  text-decoration: underline;
+  text-decoration-color: ${o.neutralGrey2Light};
+  cursor: pointer;
+
+  &:hover {
+    color: ${o.primaryLight};
+    text-decoration-color: ${o.primaryLight};
+  }
+`,An=i(e=>g.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},g.createElement("path",{d:"M23.0041 11.8483C23.0373 14.1699 22.335 16.4424 20.9979 18.3405C19.6607 20.2386 17.7572 21.665 15.5599 22.4153C13.3627 23.1656 10.9844 23.2014 8.76551 22.5175C6.54667 21.8337 4.60111 20.4653 3.20741 18.6083C1.81371 16.7513 1.04335 14.5009 1.00664 12.1794C0.969926 9.85784 1.66875 7.58422 3.00303 5.68407C4.33732 3.78392 6.23864 2.3547 8.43475 1.60106C10.6309 0.84741 13.0091 0.807991 15.229 1.48844",stroke:"#757D7E",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),g.createElement("path",{d:"M7.17736 14.8498L12.3225 8.44116C12.431 8.30616 12.5835 8.21419 12.7532 8.1815C12.9228 8.14882 13.0985 8.17753 13.2493 8.26255L16.2512 9.95329C16.4047 10.0398 16.5839 10.0678 16.7561 10.0324C16.9283 9.99691 17.0819 9.90029 17.1889 9.76018L21.3745 4.27979",stroke:"#757D7E",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),g.createElement("path",{d:"M18.4739 4.60986L21.3623 4.13001L21.845 7.03577",stroke:"#757D7E",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})))`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${o.brandColorGoldDark};
+
+  & path {
+    stroke: currentColor;
+  }
+`,Sn=i(un)`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${o.brandColorGoldDark};
+`,zn=i(tn)`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${o.brandColorGoldDark};
+`,Cn=i(pn)`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${o.brandColorGoldDark};
+`,x={bankAccListBottomMargin:new j(u[7],u[6]),containerWidth:new j(96,67),containerTopMargin:new j(u[4],u[6]),BankAccListTopMargin:new j(u[4],u[8]),containerSidePadding:new j(u[3],u[0]),accountRowTopBottomPadding:new j(u[3],u[4]),accountRowBottomMargin:new j(u[3],u[5]),totalInsuredAndYieldContainerTopMargin:new j(u[3],u[0])},vn={bankAccountName:new Qe("standardRegular","largeMedium")},d=K.getLocalizedStrings(),Y=e=>n.jsx(Nn,{children:e}),Ln=({fetchState:e,onReloadTransactions:s})=>e==="Error"?n.jsxs(rt,{children:[n.jsx(st,{onClick:s,"data-testid":G("zeni-account-list-reload"),children:n.jsx(at,{})}),n.jsx(ct,{children:d.peoplePage.reloadPage.label})]}):n.jsx(nn,{fetchState:e,styles:{margin:"auto"}}),Pn=({zeniAccountListView:e,zeniAccountsConfigDetail:s,maxInsuredAmountString:y,analytics:z,onZeniAccountRowClick:r,onReloadTransactions:C,handleAddInternalAccountClick:B,onAddFundClick:T,onTreasuryGetStartedClick:f,treasuryYieldPercentage:v,treasuryInsuredAmount:l,showTreasuryPromo:M})=>{const{depositAccountsSelectorView:I,fetchState:A,summary:w}=e,p=J(),_=Ze(),k=_.loggedInUserRoleMap.deposit_accounts_user===!0||dn(_.loggedInUserRoleMap),E=a=>{switch(a){case"totalBalance":case"insuredBalance":default:return"320px";case"totalInterest":return"290px"}},L=a=>{let $=n.jsx(n.Fragment,{});switch(a){case"insuredBalance":$=n.jsx(Z,{style:{width:"300px"},children:d.spendManagement.zeniAccounts.zeniAccountList.insuranceTooltip.replace("__amount__",y)});break;case"totalInterest":$=n.jsx(Z,{children:d.spendManagement.zeniAccounts.zeniAccountList.yieldTooltip});break;case"totalBalance":$=n.jsxs(Z,{style:{paddingTop:"12px",paddingBottom:"12px"},children:[n.jsx(mt,{children:d.spendManagement.zeniAccounts.zeniAccountList.balanceTooltip.base}),n.jsxs(q,{children:[n.jsx(H,{children:d.spendManagement.zeniAccounts.zeniAccountList.balanceTooltip.balance}),n.jsx(Q,{children:R("0,0[.]00",w?.totalBalance.current)})]}),n.jsxs(q,{children:[n.jsx(H,{children:d.spendManagement.zeniAccounts.zeniAccountList.balanceTooltip.processing}),n.jsx(Q,{children:R("0,0[.]00",w?.totalBalance.hold)})]}),n.jsxs(q,{children:[n.jsx(H,{children:d.spendManagement.zeniAccounts.zeniAccountList.balanceTooltip.available}),n.jsx(Q,{children:R("0,0[.]00",w?.totalBalance.available)})]})]})}return n.jsx(dt,{children:n.jsx(fe,{style:{textAlign:"left",padding:t.sp1},maxWidth:E(a),display:"flex",placement:p==="small"?"bottom":"top",title:$,children:a==="insuredBalance"?n.jsx(ut,{}):n.jsx(pt,{})})})},D=a=>n.jsx(Rn,{color:He(a)});return qe({componentName:"checking.list",enabled:A==="Completed"}),n.jsx(Bn,{children:A==="Completed"?n.jsxs(lt,{windowSize:p,children:[n.jsxs(_n,{windowSize:p,children:[n.jsxs(Gn,{windowSize:p,children:[n.jsxs(V,{children:[Y(d.spendManagement.zeniAccounts.zeniAccountList.totalAvailableBalance),L("totalBalance")]}),n.jsx(F,{amount:w?.totalBalance.available})]}),n.jsxs(Tn,{windowSize:p,children:[n.jsxs(Vn,{children:[n.jsxs(V,{children:[Y(d.spendManagement.zeniAccounts.zeniAccountList.insuredFund),L("insuredBalance")]}),n.jsx(F,{amount:w?.insuredBalance.available,integerStyles:S.largeMedium.cssObject,decimalStyles:S.smallMedium.cssObject}),n.jsx(Wn,{children:d.spendManagement.zeniAccounts.zeniAccountList.insuranceInfo.replace("__amount__",y)})]}),n.jsxs(Zn,{children:[n.jsxs(V,{children:[Y(d.spendManagement.zeniAccounts.common.totalYieldEarned),L("totalInterest")]}),n.jsx(F,{amount:w?.totalInterest.available,integerStyles:S.largeMedium.cssObject,decimalStyles:S.smallMedium.cssObject}),n.jsxs(Un,{children:[d.spendManagement.zeniAccounts.zeniAccountList.currentAverageYield,n.jsx(On,{children:s.zeniAccountsConfigDetail.annualPercentageYield})]})]})]})]}),M===!0&&n.jsx(ht,{windowSize:p,children:n.jsx(gn,{yieldPercentage:v,insuredAmount:l,onGetStartedClick:()=>{z.trackAccountsListPageClicked("Move Money"),f?.()}})}),n.jsxs(Fn,{windowSize:p,children:[I.depositAccounts.map((a,$)=>n.jsxs(qn,{isClickEnabled:!0,windowSize:p,onClick:()=>r?.(a.id,a.accountName),"data-testid":G("deposit-account-clicked",a.id),children:[n.jsxs(Yn,{children:[D($),n.jsxs(Hn,{children:[n.jsx(Qn,{windowSize:p,children:a.accountName}),n.jsxs(Jn,{windowSize:p,children:[n.jsx(En,{children:n.jsx(Kn,{children:a.maskedAccountNumber})}),n.jsxs(Dn,{children:[p==="small"?null:n.jsx(Xn,{}),n.jsx(et,{windowSize:p,children:d.spendManagement.zeniAccounts.zeniAccountList.active})]})]})]})]}),n.jsxs(nt,{children:[n.jsx(F,{amount:a.accountBalance.available,integerStyles:S.largeMedium.cssObject,decimalStyles:S.smallMedium.cssObject}),k?null:n.jsx(Mn,{onClick:N=>{N.stopPropagation(),(P=>{z.trackAccountsListPageClicked("Add Funds",P.accountName,"active"),T("transfer",P)})(a)},"data-testid":G("add-fund",a.id),children:n.jsx(In,{children:d.spendManagement.zeniAccounts.zeniAccountList.addFundBtnText})})]})]},a.id)),n.jsxs(tt,{onClick:B,"data-testid":G("add-new-internal-zeni-account"),children:[n.jsx(it,{}),n.jsx(ot,{children:d.spendManagement.zeniAccounts.zeniAccountList.addAccountText})]})]})]}):n.jsx(Ln,{fetchState:A,onReloadTransactions:C})})},Bn=i.div`
+  display: block;
+  height: 100%;
+`,Tn=i.div`
+  display: flex;
+  justify-content: space-between;
+  gap: ${t.sp5};
+  margin: ${e=>`${x.totalInsuredAndYieldContainerTopMargin.valuePx(e.windowSize)} ${t.sp0} ${t.sp0} ${t.sp0}`};
+`,Mn=i.button`
+  cursor: pointer;
+  border-radius: ${t.sp1};
+  background-color: ${e=>e.theme.colors.grey5};
+  border: 1px solid ${e=>e.theme.colors.grey2};
+  padding: 1px 6px;
+  :hover {
+    border: 1px solid ${e=>e.theme.colors.hero};
+  }
+`,In=i(Ke)`
+  color: ${e=>e.theme.colors.hero};
+`,_n=i.div`
+  margin: ${e=>x.containerTopMargin.valuePx(e.windowSize)}
+    ${t.sp0} ${t.sp0} ${t.sp0};
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  flex-direction: ${e=>e.windowSize==="small"?"column":"row"};
+  padding: ${e=>`${t.sp0} ${x.containerSidePadding.valuePx(e.windowSize)} ${t.sp0} ${x.containerSidePadding.valuePx(e.windowSize)}`};
+`,En=i.div`
+  display: flex;
+`,Dn=i.div`
+  display: flex;
+  align-items: center;
+`,Fn=i.div`
+  margin: ${e=>`${x.BankAccListTopMargin.valuePx(e.windowSize)} ${t.sp0} 
+    ${x.bankAccListBottomMargin.valuePx(e.windowSize)} ${t.sp0}`};
+  width: 100%;
+  padding: ${e=>`${t.sp0}  ${x.containerSidePadding.valuePx(e.windowSize)}`};
+`,Rn=i(an)`
+  min-width: ${t.sp7};
+  width: ${t.sp7};
+  height: ${t.sp7};
+  margin-right: 12px;
+`,Gn=i.div`
+  ${e=>e.windowSize!=="small"?`
+        width: 50%;
+`:null}
+`,V=i.div`
+  display: flex;
+`,Nn=i(b)`
+  color: ${e=>e.theme.colors.hero};
+  margin-right: ${t.sp1};
+`,Un=i(X)`
+  color: ${e=>e.theme.colors.hero};
+`,On=i.span`
+  margin-left: 2px;
+`,Wn=i(X)`
+  color: ${e=>e.theme.colors.hero};
+`,Yn=i.div`
+  display: flex;
+  align-items: center;
+  width: calc(100% - 96px);
+`,Vn=i.div``,Zn=i.div``,qn=i.div`
+  padding-left: ${e=>x.accountRowTopBottomPadding.valuePx(e.windowSize)};
+  padding-right: ${e=>x.accountRowTopBottomPadding.valuePx(e.windowSize)};
+  padding-top: ${e=>x.accountRowTopBottomPadding.valuePx(e.windowSize)};
+  padding-bottom: ${e=>x.accountRowTopBottomPadding.valuePx(e.windowSize)};
+  background: ${e=>e.theme.colors.grey5};
+  border: 1px solid ${e=>e.theme.colors.grey3};
+  box-shadow: ${e=>`${t.sp0} 2px ${t.sp1} ${e.theme.colors.dropShadowNormal} `};
+  border-radius: ${t.sp2};
+  margin-bottom: ${e=>x.accountRowBottomMargin.valuePx(e.windowSize)};
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  cursor: ${e=>e.isClickEnabled?"pointer":"default"};
+  &:hover {
+    border-color: ${e=>e.theme.colors.primary};
+    color: ${e=>e.isClickEnabled?e.theme.colors.champion:e.theme.colors.hero};
+  }
+`,Hn=i.div`
+  max-width: calc(100% - 30px);
+  width: calc(100% - 40px);
+  white-space: nowrap;
+  overflow: hidden;
+`,Qn=i(Je)`
+  ${e=>`${vn.bankAccountName.style(e.windowSize)}`};
+  color: ${e=>e.theme.colors.primary};
+  max-width: ${`calc(100% - ${t.sp3})`};
+  text-transform: capitalize;
+  overflow: hidden;
+`,Jn=i.div`
+  display: flex;
+  color: ${e=>e.theme.colors.hero};
+  flex-direction: ${e=>e.windowSize==="small"?"column":"row"};
+  align-items: ${e=>e.windowSize==="small"?"start":"center"};
+`,Kn=i(b)`
+  margin-left: ${t.sp1};
+`,Xn=i.div`
+  width: ${t.sp1};
+  height: ${t.sp1};
+  border-radius: 50%;
+  background-color: ${e=>e.theme.colors.grey1};
+  margin-left: ${t.sp2};
+  margin-right: ${t.sp2};
+`,et=i(b)`
+  color: ${o.success};
+  border-radius: 50px;
+`,nt=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  justify-content: center;
+`,tt=i.div`
+  padding: ${t.sp3};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid ${e=>e.theme.colors.hero};
+  border-radius: ${t.sp2};
+  color: ${e=>e.theme.colors.hero};
+  cursor: pointer;
+  margin-top: ${t.sp4};
+  pointer-events: ${e=>e.isLoading===!0?"none":"auto"};
+  &:hover {
+    svg {
+      color: ${e=>e.theme.colors.primary};
+    }
+    color: ${e=>e.theme.colors.primary};
+    border: 1px solid ${e=>e.theme.colors.primary};
+  }
+`,it=i(Xe)`
+  margin-right: ${t.sp2};
+  width: ${t.sp4};
+  height: ${t.sp4};
+  color: ${e=>e.theme.colors.hero};
+`,ot=i(en)``,rt=i.div`
+  display: flex;
+  width: 100%;
+  height: calc(100% - 60px);
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+`,st=i.div`
+  height: ${t.sp12};
+  width: ${t.sp12};
+  background: ${e=>e.theme.colors.background};
+  border-radius: 50%;
+  cursor: pointer;
+  & svg {
+    margin: ${t.sp5};
+    color: ${e=>e.theme.colors.grey1};
+  }
+  &:hover {
+    & svg {
+      color: ${e=>e.theme.colors.primary};
+    }
+  }
+`,at=i(cn)`
+  height: ${t.sp5};
+  width: ${t.sp5};
+  color: ${e=>e.theme.colors.grey1};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`,ct=i(ln)`
+  margin-top: ${t.sp3};
+  color: ${e=>e.theme.colors.hero};
+`,lt=i.div`
+  max-width: 726px;
+  width: ${e=>x.containerWidth.valuePercentage(e.windowSize)};
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin: auto;
+`,dt=i.div`
+  display: flex;
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+    svg {
+      color: ${e=>e.theme.colors.primary};
+    }
+  }
+`,pt=i(ye)`
+  width: ${t.sp3};
+  height: ${t.sp3};
+  color: ${e=>e.theme.colors.hero};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`,ut=i(e=>g.createElement("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},g.createElement("path",{d:"M1.50005 3.41819V11.3868C1.49582 13.9724 2.27853 16.4989 3.74542 18.6344C5.2123 20.77 7.29478 22.4147 9.71941 23.3528L10.8398 23.7848C11.5863 24.0717 12.4137 24.0717 13.1602 23.7848L14.2806 23.3528C16.7052 22.4147 18.7877 20.77 20.2546 18.6344C21.7215 16.4989 22.5042 13.9724 22.4999 11.3868V3.41819C22.5025 3.11029 22.4157 2.80819 22.2499 2.54802C22.0842 2.28785 21.8466 2.08063 21.5655 1.95114C18.5518 0.635546 15.2915 -0.0291648 12 0.000981362C8.70855 -0.0291648 5.44817 0.635546 2.43455 1.95114C2.15343 2.08063 1.91579 2.28785 1.75007 2.54802C1.58435 2.80819 1.49755 3.11029 1.50005 3.41819Z",fill:"#36B37E"}),g.createElement("path",{d:"M16.5194 8.42881L11.3671 13.3387C11.3022 13.4007 11.2254 13.4489 11.1414 13.4802C11.0573 13.5116 10.9677 13.5256 10.8781 13.5212C10.7897 13.517 10.703 13.4951 10.6232 13.4568C10.5434 13.4185 10.4721 13.3646 10.4135 13.2982L8.06814 10.6339",stroke:"#FAFAFA",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})))`
+  width: ${t.sp3};
+  height: ${t.sp3};
+`,Z=i(b)`
+  padding: ${t.sp2} ${t.sp3};
+  color: ${e=>e.theme.colors.hero};
+  border-radius: ${t.sp1};
+`,q=i(b)`
+  color: ${e=>e.theme.colors.brandColorPearl};
+  margin-top: ${t.sp2};
+  display: flex;
+  justify-content: space-between;
+`,mt=i(b)`
+  margin-bottom: ${t.sp2};
+  display: flex;
+`,H=i.div`
+  color: ${e=>e.theme.colors.hero};
+`,Q=i.div`
+  color: ${o.primaryDark};
+`,ht=i.div`
+  margin-top: ${t.sp4};
+`,{common:gt,spendManagement:{zeniAccounts:c}}=K.getLocalizedStrings(),$e="checkingAccountCreation-form",Ft=({zeniAccountListView:e,analytics:s,maxInsuredAmount:y,isBillPayEnabled:z,isExpressPayEnabled:r,onBackClick:C,onZeniAccountClick:B,onSettingsClick:T,handleMoveMoneyOptionSelection:f,onReloadTransactions:v,onCreateCheckingClick:l,onClickMenuIcon:M,onTreasuryGetStartedClick:I,showTreasuryPromo:A,treasuryYieldPercentage:w,treasuryInsuredAmount:p})=>{const _=J(),k=Me({mode:"all"}),E=e.newCheckingAccount.fetchState,L=Ie(E);g.useEffect(()=>{L==="In-Progress"&&E==="Completed"&&($(!1),P(!0),k.reset())},[L,E,k]);const D=_e(),[a,$]=g.useState(!1),[N,P]=g.useState(!1),[ke,U]=g.useState(!1),[je,be]=g.useState(0),[Ae,Se]=g.useState(0),ze={pageName:"listPage",onOptionSelection:h=>{h==="payBill"?(s.trackAccountsListPageClicked("Pay Someone"),U(!0)):(h==="sendMoney"?s.trackSendMoneyClick():h==="checkDeposit"?s.trackAccountsListPageClicked("Deposit a Check"):h==="transfer"&&s.trackAccountsListPageClicked("Transfer Between Accounts"),f(h))}},Ce={onOkClick:()=>{},onCancelClick:()=>{s.trackAccountsListPageClicked("Add Business Account Cancel"),k.reset(),$(!1)}},ve={onOkClick:()=>{const h=e.depositAccountsSelectorView.depositAccounts.find(O=>O.id===e.newCheckingAccount.accountId);s.trackAccountsListPageClicked("Add Business Account Add Funds"),f("transfer",h),P(!1)},onCancelClick:()=>{s.trackAccountsListPageClicked("Add Business Account Not Now"),P(!1)}},Le={onOkClick:()=>{s.trackAccountsListPageClicked("Proceed on Bills pop up"),f("payBill"),U(!1)},onCancelClick:()=>{s.trackAccountsListPageClicked("Not Now on Bills pop up"),U(!1)}},Pe=k.handleSubmit(h=>{s.trackAccountsListPageClicked("Add Business Account Create"),l?.(h.checkingAccountNickName)}),ee=e.zeniAccountsConfig.zeniAccountsConfigDetail.depositProductConfig.depositProducts,Be=ee[ee.length-1].annualPercentageYield.toString(),ne=Ee(De(y),y,gt.currency.currencySymbol).toUpperCase(),Te=n.jsx(mn,{onSettingsClick:T,isBillPayEnabled:z,isExpressPayEnabled:r,zeniBankProps:ze,analytics:s});return n.jsxs(xt,{children:[a?n.jsx(W,{titleComponent:n.jsx(ie,{children:c.zeniAccountList.createPopUpInfo.title}),descriptionComponent:n.jsx(te,{children:c.zeniAccountList.createPopUpInfo.description}),primaryButtonText:c.zeniAccountList.createPopUpInfo.primaryButtonText,isLoading:e.newCheckingAccount.fetchState==="In-Progress",formId:$e,secondaryButtonText:c.zeniAccountList.createPopUpInfo.secondaryButtonText,style:{background:o.overlayLight},action:Ce,children:n.jsx(Fe,{...k,children:n.jsx("form",{id:$e,onSubmit:Pe,style:{height:t.sp8,width:"80%",marginBottom:t.sp5},children:n.jsx(Re,{type:"text",name:"checkingAccountNickName",placeholder:c.zeniAccountList.createPopUpInfo.placeholder,style:{display:"flex",flexGrow:1,cursor:"inherit",height:t.sp7,textAlign:"left",width:"100%",background:Ge(k.formState.errors,"checkingAccountNickName")===!0?o.importantLight:D.colors.grey5,border:`1px solid ${D.colors.grey2}`},registerOptions:{required:!0,validate:h=>!!h}})})})}):null,N?n.jsx(W,{titleComponent:n.jsx(n.Fragment,{}),descriptionComponent:n.jsx(n.Fragment,{}),primaryButtonText:c.zeniAccountList.addFundsPopUpInfo.primaryButtonText,secondaryButtonText:c.zeniAccountList.addFundsPopUpInfo.secondaryButtonText,action:ve,primaryButtonWidth:130,secondaryButtonWidth:130,containerStyle:{minWidth:352,maxWidth:544,width:"90%"},children:n.jsxs($t,{children:[n.jsx(Ne,{width:150,height:150,shouldDisplay:!0,animationInLoop:1,styles:{marginBottom:-t.sp4}}),n.jsx(ft,{children:c.zeniAccountList.addFundsPopUpInfo.title}),n.jsx(yt,{children:c.zeniAccountList.addFundsPopUpInfo.description.replace("__rate__",Be).replace("__amount__",ne)}),n.jsx(hn,{transferAmount:5e5,currentAccountBalance:0,zeniAccountsConfigDetail:e.zeniAccountsConfig,minStep:.1,setTotalBalance:Se,setYieldEarned:be}),n.jsxs(kt,{children:[n.jsxs(bt,{children:[c.zeniAccountList.transferDrawer.calculator.footerText.annualYieldEarned,n.jsx(jt,{children:R("0,0",{amount:je,currencySymbol:"$"})}),n.jsx(fe,{variant:"small-description",maxWidth:"280px",data:c.zeniAccountList.transferDrawer.calculator.footerText.annualYieldEarnedTooltipText,display:"flex",placement:"left",children:n.jsx(St,{})})]}),n.jsxs(At,{children:[c.zeniAccountList.transferDrawer.calculator.footerText.for,Intl.NumberFormat("en",{currency:"USD",notation:"compact",style:"currency",minimumFractionDigits:0}).format(Ae)]})]})]})}):null,ke?n.jsx(W,{titleComponent:n.jsx(ie,{children:c.zeniAccountList.billPayupPopUpInfo.title}),descriptionComponent:n.jsx(te,{children:c.zeniAccountList.billPayupPopUpInfo.description}),primaryButtonText:c.zeniAccountList.billPayupPopUpInfo.primaryButtonText,secondaryButtonText:c.zeniAccountList.billPayupPopUpInfo.secondaryButtonText,action:Le,primaryButtonWidth:130,secondaryButtonWidth:130}):null,n.jsx(Ue,{title:c.zeniAccountList.tabsById.zeniAccounts,onBackClick:C,showMenuIcon:_==="medium-compact"||_==="small",backgroundColor:D.colors.grey4,style:{zIndex:3,...S.largeSemiBold.cssObject},rightSideComponent:Te,onClickMenuIcon:M,hideSearchBtn:!0,source:"ZeniAccountListViewPage"}),n.jsx(wt,{isLoading:e.fetchState==="In-Progress",children:n.jsx(Pn,{zeniAccountsConfigDetail:e.zeniAccountsConfig,zeniAccountListView:e,onZeniAccountRowClick:(h,O)=>{B(h,O)},onAddFundClick:f,handleAddInternalAccountClick:()=>{s.trackAccountsListPageClicked("Add Business Account"),$(!0)},analytics:s,onReloadTransactions:v,maxInsuredAmountString:ne,onTreasuryGetStartedClick:I,treasuryYieldPercentage:w,treasuryInsuredAmount:p,showTreasuryPromo:A})})]})},xt=i.div`
+  display: flex;
+  min-height: 100%;
+  flex-direction: column;
+  width: 100%;
+`,wt=i.div`
+  display: ${e=>e.isLoading?"flex":"block"};
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+  min-height: ${e=>e.isLoading?`calc(100vh - ${t.sp10})`:"100vh"};
+  height: ${e=>e.isLoading?`calc(100vh - ${t.sp10})`:"100%"};
+`,$t=i.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: ${t.sp4};
+`,ft=i(Oe)`
+  padding-left: ${t.sp8};
+  padding-right: ${t.sp8};
+  color: ${e=>e.theme.colors.primary};
+  word-break: break-word;
+`,yt=i(We)`
+  color: ${e=>e.theme.colors.hero};
+  padding-left: ${t.sp6};
+  padding-right: ${t.sp6};
+  margin-bottom: ${t.sp3};
+  margin-top: ${t.sp3};
+  white-space: pre-line;
+`,kt=i.div`
+  min-height: ${t.sp10};
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`,jt=i.span`
+  font-weight: ${Ve.medium};
+  margin-left: ${t.sp1};
+`,bt=i(Ye)`
+  color: ${o.success};
+  display: flex;
+  align-items: center;
+`,At=i(b)`
+  color: ${e=>e.theme.colors.grey1};
+  display: block;
+`,St=i(ye)`
+  width: ${t.sp3};
+  color: ${e=>e.theme.colors.hero};
+  height: ${t.sp3};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`;export{Ft as default};

package/dist/assets/ZeniAccountNavBarPieces-2a3O6Mrv-CEltxOUL.js

@@ -0,0 +1,14 @@
+import{a$ as O,hd as P,a as j,j as i,ij as p,iR as u,bm as $,b as s,im as z}from"./index-2CdI-B2B.js";import{n as y}from"./mui-kiGMfX4-.js";import{bW as B}from"./zeni-epic-state-Bo1aGezX.js";const o=j.getLocalizedStrings().spendManagement.zeniAccounts,m=[{value:"editNickName",label:o.moveMoney.editNickName},{value:"accountStatement",label:o.moveMoney.accountStatement}],d={value:"payBill",label:o.moveMoney.payBills},g={value:"transfer",label:o.moveMoney.transfer},v={value:"sendMoney",label:o.moveMoney.sendMoney,isNew:!0},M={value:"checkDeposit",label:o.moveMoney.checkDeposit},w=[d,g,v,M],A=[v,g,d,M],_=({zeniBankProps:e,isBillPayEnabled:h,isExpressPayEnabled:S,analytics:b,onSettingsClick:f})=>{const a=O(),l=a.loggedInUserRoleMap.deposit_accounts_user===!0||P(a),x=B(a.loggedInUserRoleMap),k=m.filter(t=>t.value==="accountStatement"),c=h===!0?w:A,r=S===!0?c:c.filter(t=>t.value!=="sendMoney"),N=x?r:r.filter(t=>t.value!=="payBill");return i.jsxs(C,{isTopAlign:e.pageName==="detailPage",children:[e.pageName!=="listPage"||l?e.pageName==="detailPage"&&i.jsx(p,{entity:"zeni_accounts",onOptionSelection:t=>{const n=u(t);n!=null&&e.onOptionSelection(n)},isMoreOption:!0,options:l?k:m,title:o.moveMoney.title}):i.jsx(R,{onClick:f,"data-testid":$("zeni-accounts-settings-button")}),l?null:i.jsx(p,{entity:"zeni_accounts",onOptionSelection:t=>{const n=u(t);n!=null&&e.onOptionSelection(n)},isMoreOption:!1,options:N,title:o.moveMoney.title,onMenuOpen:()=>b?.trackAccountsListPageClicked("Move Money")})]})},R=y(z)`
+  cursor: pointer;
+  min-width: ${s.sp4};
+  width: ${s.sp4};
+  height: ${s.sp4};
+  color: ${e=>e.theme.colors.hero};
+  &:hover {
+    color: ${e=>e.theme.colors.primary};
+  }
+`,C=y.div`
+  display: flex;
+  flex-direction: row;
+  align-items: ${({isTopAlign:e})=>e?"flex-start":"center"};
+`;export{_ as h};