@zeniai/web-components 3.16.42 → 3.16.43

package/dist/ZeniAccountDetailPage-BdZKe0JE.cjs

@@ -0,0 +1,300 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./vendor-.pnpm-DHyNpoQL.cjs"),r=require("react"),s=require("@emotion/styled"),w=require("@zeniai/client-epic-state"),e=require("./index-DccWx-ku.cjs"),me=require("./BoxItem-3bqCNONS.cjs"),he=require("./downloadPdf-BaSLVg3L.cjs"),ge=require("./DepositAccTransactionItem-BYk9CPJn.cjs"),je=require("./ZeniAccountNavBarPieces-Bby3TMvX.cjs"),Se=require("./MoreMenuButton-EZw_R6qx.cjs");function fe(t){const p=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const d=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(p,n,d.get?d:{enumerable:!0,get:()=>t[n]})}}return p.default=t,Object.freeze(p)}const $=fe(r),ye=t=>$.createElement("svg",{viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t},$.createElement("path",{d:"M21.5348 3H2.31522C1.80976 3 1.4 3.44579 1.4 3.99569V19.9353C1.4 20.4852 1.80976 20.931 2.31522 20.931H21.5348C22.0402 20.931 22.45 20.4852 22.45 19.9353V3.99569C22.45 3.44579 22.0402 3 21.5348 3Z",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),$.createElement("path",{d:"M16 10.8126H19.62",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),$.createElement("path",{d:"M16 13.6245H18.28",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),$.createElement("path",{d:"M13.8276 15.9677C13.4452 15.3772 12.177 14.948 10.5892 14.3603C10.1412 14.1934 10.2143 13.0237 10.413 12.8053C10.7291 12.463 10.9691 12.0577 11.1174 11.6161C11.2657 11.1744 11.3189 10.7064 11.2735 10.2428C11.3006 9.95383 11.2662 9.66242 11.1723 9.3878C11.0785 9.11317 10.9275 8.86159 10.7292 8.64967C10.5309 8.43776 10.2899 8.27033 10.0222 8.15847C9.75438 8.04661 9.4659 7.99286 9.1758 8.00076C8.8857 7.99286 8.59723 8.04661 8.32945 8.15847C8.06166 8.27033 7.82067 8.43776 7.6224 8.64967C7.42412 8.86159 7.27309 9.11317 7.17927 9.3878C7.08544 9.66242 7.05098 9.95383 7.07814 10.2428C7.03273 10.7064 7.08592 11.1744 7.23421 11.6161C7.38251 12.0577 7.62255 12.463 7.93858 12.8053C8.13728 13.0237 8.21039 14.1934 7.76237 14.3603C6.17647 14.948 4.90644 15.3772 4.52402 15.9677",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})),Re=s.div`
+  display: flex;
+  width: 100%;
+  height: 100vh;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  background-color: ${t=>t.theme.colors.grey5};
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+  background-color: ${t=>t.theme.colors.grey4};
+`,G="editNickName-form",N="checkingAccountNickName",$e={tickLabelText:new e.ResponsiveSizedStyle("extraSmallRegular","smallRegular")},u={accountDetailHeaderPaddingRight:new e.ResponsiveSized(e.sp[3],e.sp[8]),accountDetailHeaderPaddingBottom:new e.ResponsiveSized(e.sp[3],e.sp[6]),accountDetailHeaderPaddingLeft:new e.ResponsiveSized(e.sp[3],e.sp[8]),accountDetailContentMarginTop:new e.ResponsiveSized(e.sp[5],e.sp[7]),areaChartHeight:new e.ResponsiveSized(114,209),accountDetailHeaderGap:new e.ResponsiveSized(18,100,184),accBtnsGap:new e.ResponsiveSized(0,e.sp[11]),styledNoTransactionIconSize:new e.ResponsiveSized(60,120)},{common:T,spendManagement:be}=e.appLocale.getLocalizedStrings(),{zeniAccounts:i}=be,L=e.appLocale.getLocalizedStrings().dateFormat,Ce=e.appLocale.getLocalizedStrings().peoplePage,Y=t=>o.jsxRuntimeExports.jsx(nt,{children:t}),X=r.memo(({accountHistory:t})=>{const p=e.useWindowSizeContext(),n=o.useTheme(),[d,j]=r.useState(),S=r.useMemo(()=>t.accountHistoryWithBalance.map(a=>({...a,date:a.date.toISOString()})),[t.accountHistoryWithBalance]),m=r.useCallback(a=>{let x="",c="";return a&&a[0]&&(c=e.amountToString("0,0[.]00",a[0].payload?.balance?.available),x=w.zeniDate(a[0].payload?.date).format(L.visual.DMMMYYYYFormat)),o.jsxRuntimeExports.jsxs(ot,{children:[o.jsxRuntimeExports.jsx(V,{children:x}),o.jsxRuntimeExports.jsx(V,{isSublabel:!0,children:c})]})},[]),h=r.useCallback(a=>{const{x,y:c}=a,{value:y}=a.payload;let b=!1;t.accountHistoryWithBalance.length>360&&(b=!0);const R=b?w.zeniDate(y).format(L.visual.MMMformat):w.zeniDate(y).format(L.visual.MMMDFormat);return o.jsxRuntimeExports.jsx(Ue,{translateX:x,translateY:c,children:o.jsxRuntimeExports.jsx(Ge,{windowSize:p,dy:20,dx:-25,children:R})})},[t.accountHistoryWithBalance.length,p]),f=r.useCallback(({cx:a,cy:x,dataKey:c})=>(c==="balance.available.amount"&&(d?.x!==a||d?.y!==x)&&j({x:a,y:x}),o.jsxRuntimeExports.jsx(st,{cx:a,cy:x,strokeWidth:1,r:e.sp[1]})),[d]),g=r.useMemo(()=>{const a=t.accountHistoryWithBalance.length;return a<=0?0:a>360?Math.floor(a/12):Math.floor(a/7)},[t.accountHistoryWithBalance.length]);return t.fetchState!=="Completed"?null:t.fetchState==="Completed"&&t.accountHistoryWithBalance.length===0?o.jsxRuntimeExports.jsx(yt,{children:o.jsxRuntimeExports.jsx(Rt,{children:T.texts.noData})}):o.jsxRuntimeExports.jsx(Je,{children:o.jsxRuntimeExports.jsx(o.ResponsiveContainer,{height:u.areaChartHeight.value(p),width:"99%",children:o.jsxRuntimeExports.jsxs(o.AreaChart,{data:S,margin:{top:0,right:0,bottom:0,left:0},children:[o.jsxRuntimeExports.jsx("defs",{children:o.jsxRuntimeExports.jsxs(Ye,{id:"colorUv",x1:"0",y1:"0",x2:"0",y2:"1",children:[o.jsxRuntimeExports.jsx(Ve,{offset:"0%",stopColor:e.Colors.brandColorJade,stopOpacity:1}),o.jsxRuntimeExports.jsx(qe,{offset:"100%",stopColor:e.Colors.brandColorJade,stopOpacity:.03})]})}),o.jsxRuntimeExports.jsx(o.CartesianGrid,{vertical:!1,strokeWidth:2,stroke:n.colors.grey3}),o.jsxRuntimeExports.jsx(o.XAxis,{dataKey:"date",stroke:n.colors.grey3,tickSize:0,reversed:!0,tick:a=>h(a),padding:{right:e.sp[4]},interval:g}),o.jsxRuntimeExports.jsx(o.YAxis,{tick:!1,axisLine:!1}),o.jsxRuntimeExports.jsx(o.Tooltip$1,{position:d,content:({payload:a})=>m(a),cursor:{strokeDasharray:"3",stroke:e.Colors.brandColorJade}}),o.jsxRuntimeExports.jsx(o.Area,{activeDot:f,fillOpacity:1,dot:!1,type:"monotone",dataKey:"balance.available.amount",stroke:e.Colors.brandColorJade,fill:"url(#colorUv)"})]})})})});X.displayName="AccountBalanceGraph";const K=r.memo(({zeniAccountDetail:t,getToolTipContent:p,onAccountDetailClick:n,downloadEndPoint:d,authParams:j,showLoader:S,setShowLoader:m,onViewAllTransactionClick:h,showViewAllTransactions:f})=>{const g=e.useWindowSizeContext(),a=r.useMemo(()=>t.accountHistory,[t.accountHistory]);return o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsxs(De,{windowSize:g,children:[o.jsxRuntimeExports.jsx(we,{getToolTipContent:p,zeniAccountDetail:t}),o.jsxRuntimeExports.jsxs(Me,{children:[o.jsxRuntimeExports.jsx(X,{accountHistory:a}),o.jsxRuntimeExports.jsxs(_e,{windowSize:g,children:[o.jsxRuntimeExports.jsxs(Qe,{onClick:n,"data-testid":e.generateDataTestId("view-account-detail-button"),children:[o.jsxRuntimeExports.jsx(mt,{}),g==="small"?o.jsxRuntimeExports.jsx(Z,{className:"btnText",children:i.zeniAccountDetail.accDetails}):o.jsxRuntimeExports.jsx(J,{className:"btnText",children:i.zeniAccountDetail.accDetails})]}),o.jsxRuntimeExports.jsxs(et,{"data-testid":e.generateDataTestId("download-bank-verification-letter"),onClick:()=>he.downloadPdf(`${d}/bank-verification-letter`,`${i.zeniAccountDetail.bankLetterPdf}${t.accountDetail?.accountLast4}.pdf`,j,m),children:[S?o.jsxRuntimeExports.jsx(e.ActivityIndicator,{size:"Standard",start:!0}):o.jsxRuntimeExports.jsx(ht,{}),g==="small"?o.jsxRuntimeExports.jsx(Z,{className:"btnText",children:i.zeniAccountDetail.bankLetter}):o.jsxRuntimeExports.jsx(J,{className:"btnText",children:i.zeniAccountDetail.bankLetter})]})]})]})]}),t.transactionList.length>0?o.jsxRuntimeExports.jsxs(Be,{windowSize:g,children:[o.jsxRuntimeExports.jsxs(Pe,{children:[o.jsxRuntimeExports.jsx(ct,{children:i.zeniAccountDetail.transactions}),f?o.jsxRuntimeExports.jsxs(lt,{onClick:h,"data-testid":e.generateDataTestId("view-all-account-transactions"),children:[o.jsxRuntimeExports.jsx(dt,{children:i.zeniAccountDetail.viewAll}),o.jsxRuntimeExports.jsx(pt,{})]}):null]}),o.jsxRuntimeExports.jsx(Ne,{children:t.transactionList.map((x,c)=>o.jsxRuntimeExports.jsx(ge.DepositAccTransactionItem,{data:x,boxType:me.boxType(c,t.transactionList.length)},x.id))})]}):o.jsxRuntimeExports.jsxs(ve,{children:[o.jsxRuntimeExports.jsx(Te,{windowSize:g}),o.jsxRuntimeExports.jsx(ke,{children:i.zeniAccountDetail.noTransactionText})]})]})});K.displayName="AccountDetailScreen";const Ee=({authParams:t,downloadEndPoint:p,zeniAccountDetail:n,isBillPayEnabled:d,isExpressPayEnabled:j,onViewAllTransactionClick:S,onAccountDetailClick:m,handleMoveMoneyOptionSelection:h,onBackClick:f,onCloseAccountClick:g,onEditNameClick:a,onReloadZeniAccountDetailPage:x})=>{const c=o.useForm({mode:"all"}),{setFocus:y}=c,[b,R]=r.useState(!1),[k,B]=r.useState(!1),[U,Q]=r.useState(!1),H=e.useWindowSizeContext(),W=e.useGlobalInfoContext(),O=W.loggedInUserRoleMap.deposit_accounts_user===!0||w.hasAnyFinOpRole(W.loggedInUserRoleMap);r.useEffect(()=>{const l=setTimeout(()=>{n.fetchState==="Completed"&&n.accountDetail?.accountBalance.available.amount===0&&!O&&h("transfer",n.accountDetail)},500);return()=>{clearTimeout(l)}},[n.accountDetail?.id,n.fetchState,O]),r.useEffect(()=>{U===!0&&setTimeout(()=>{Q(!1)},800)},[U]);const ee=n.transactionList.length>4,P=o.useTheme(),[te,oe]=r.useState(!1),[se,A]=r.useState(!1),D=n.accountUpdateStatus.editName.fetchState,F=e.usePrevious(D),ne=l=>{l==="closeAccount"?R(!0):l==="editNickName"?B(!0):l==="payBill"?A(!0):h(l,n.accountDetail)},ie={onOkClick:()=>{g?.(),R(!1)},onCancelClick:()=>{R(!1)}},ae={onOkClick:()=>{},onCancelClick:()=>{c.reset(),B(!1)}};r.useEffect(()=>{F==="In-Progress"&&D==="Completed"&&(B(!1),c.reset())},[F,D,c]),r.useEffect(()=>{k&&y(N)},[k,y]);const re={pageName:"detailPage",onOptionSelection:ne},ce=n.accountDetail?.accountName??"",C=n.accountSummary,le=c.handleSubmit(l=>{a?.(l.checkingAccountNickName)}),pe={onOkClick:()=>{h("payBill"),A(!1)},onCancelClick:()=>{A(!1)}},de=l=>{switch(l){case"totalBalance":return"320px";case"insuredBalance":return"320px";case"totalInterest":return"280px";default:return"320px"}},xe=r.useCallback(l=>{let E=null;switch(l){case"insuredBalance":E=o.jsxRuntimeExports.jsx(o.jsxRuntimeExports.Fragment,{});break;case"totalInterest":E=o.jsxRuntimeExports.jsx(ft,{children:i.zeniAccountList.yieldTooltip});break;case"totalBalance":E=o.jsxRuntimeExports.jsxs(jt,{children:[o.jsxRuntimeExports.jsx(gt,{children:i.zeniAccountList.balanceTooltip.base}),o.jsxRuntimeExports.jsxs(I,{children:[o.jsxRuntimeExports.jsx(z,{children:i.zeniAccountList.balanceTooltip.balance}),o.jsxRuntimeExports.jsx(M,{children:e.amountToString("0,0[.]00",C?.totalBalance.current)})]}),o.jsxRuntimeExports.jsxs(I,{children:[o.jsxRuntimeExports.jsx(z,{children:i.zeniAccountList.balanceTooltip.processing}),o.jsxRuntimeExports.jsx(M,{children:e.amountToString("0,0[.]00",C?.totalBalance.hold)})]}),o.jsxRuntimeExports.jsxs(I,{children:[o.jsxRuntimeExports.jsx(z,{children:i.zeniAccountList.balanceTooltip.available}),o.jsxRuntimeExports.jsx(M,{children:e.amountToString("0,0[.]00",C?.totalBalance.available)})]})]});break}return o.jsxRuntimeExports.jsx(v,{children:o.jsxRuntimeExports.jsx(e.Tooltip,{style:{textAlign:"left",padding:e.Space.sp1},maxWidth:de(l),display:"flex",placement:H==="small"?"bottom":"top",title:E,children:o.jsxRuntimeExports.jsx(St,{})})})},[C,H]),ue=o.jsxRuntimeExports.jsx(je.ZeniAccountNavBarPieces,{zeniBankProps:re,isBillPayEnabled:d,isExpressPayEnabled:j});return o.jsxRuntimeExports.jsxs(Ae,{children:[o.jsxRuntimeExports.jsx(e.NavBar,{title:ce,subTitle:n?.accountDetail?.maskedAccountNumber??"",onBackClick:f,showMenuIcon:!1,backgroundColor:P.colors.grey4,style:{zIndex:3,...e.textStyles.largeSemiBold.cssObject},rightSideComponent:ue,source:"ZeniAccountDetailPage"}),b?o.jsxRuntimeExports.jsx(e.ConfirmationPopup,{titleComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpTitle,{children:i.zeniAccountDetail.closeAccountPopUp.title}),descriptionComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpDescription,{children:`${i.zeniAccountDetail.closeAccountPopUp.description}${n.accountDetail?.maskedAccountNumber}${T.strings.dot}`}),primaryButtonText:i.zeniAccountDetail.closeAccountPopUp.primaryButtonText,proceedButtonVariant:"danger",secondaryButtonText:i.zeniAccountDetail.closeAccountPopUp.secondaryButtonText,action:ie}):null,se?o.jsxRuntimeExports.jsx(e.ConfirmationPopup,{titleComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpTitle,{children:i.zeniAccountList.billPayupPopUpInfo.title}),descriptionComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpDescription,{children:i.zeniAccountList.billPayupPopUpInfo.description}),primaryButtonText:i.zeniAccountList.billPayupPopUpInfo.primaryButtonText,secondaryButtonText:i.zeniAccountList.billPayupPopUpInfo.secondaryButtonText,action:pe,secondaryButtonWidth:130,primaryButtonWidth:130}):null,k?o.jsxRuntimeExports.jsx(e.ConfirmationPopup,{titleComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpTitle,{children:i.zeniAccountDetail.editNamePopUp.title}),descriptionComponent:o.jsxRuntimeExports.jsx(e.ConfirmationPopUpDescription,{children:i.zeniAccountDetail.editNamePopUp.description}),primaryButtonText:i.zeniAccountDetail.editNamePopUp.primaryButtonText,secondaryButtonText:i.zeniAccountDetail.editNamePopUp.secondaryButtonText,formId:G,action:ae,containerStyle:{width:"100%"},isLoading:n.accountUpdateStatus.editName.fetchState==="In-Progress",children:o.jsxRuntimeExports.jsx(o.FormProvider,{...c,children:o.jsxRuntimeExports.jsx("form",{id:G,onSubmit:le,style:{height:e.Space.sp8,width:"80%",marginBottom:e.Space.sp5},children:o.jsxRuntimeExports.jsx(e.TextField,{type:"text",name:N,defaultValue:n.accountDetail?.accountName,placeholder:n.accountDetail?.accountName??"",style:{display:"flex",flexGrow:1,cursor:"inherit",height:e.Space.sp7,textAlign:"left",width:"100%",background:o.has(c.formState.errors,N)===!0?e.Colors.importantLight:P.colors.background,border:`1px solid ${P.colors.background}`},registerOptions:{required:!0,validate:l=>!!l}})})})}):null,n.fetchState==="Completed"?o.jsxRuntimeExports.jsx(K,{authParams:t,downloadEndPoint:p,getToolTipContent:xe,onAccountDetailClick:m,onViewAllTransactionClick:S,setShowLoader:oe,showLoader:te,showViewAllTransactions:ee,zeniAccountDetail:n}):n.fetchState==="Error"?o.jsxRuntimeExports.jsxs(He,{children:[o.jsxRuntimeExports.jsx(We,{onClick:x,"data-testid":e.generateDataTestId("account-detail-reload"),children:o.jsxRuntimeExports.jsx(Fe,{})}),o.jsxRuntimeExports.jsx(Oe,{children:Ce.reloadPage.label})]}):o.jsxRuntimeExports.jsx(Re,{children:o.jsxRuntimeExports.jsx(e.ActivityIndicator,{size:"ExtraLarge",start:!0})})]})},we=({zeniAccountDetail:t,getToolTipContent:p})=>{const n=e.useWindowSizeContext(),[d,j]=r.useState(!1),[,S]=e.useCopyToClipboard(),[m,h]=r.useState(!1),f=()=>{S(t.accountDetail?.accountNumber??""),h(!0)};return r.useEffect(()=>{m===!0&&setTimeout(()=>{h(!1)},800)},[m]),o.jsxRuntimeExports.jsxs(Le,{children:[o.jsxRuntimeExports.jsxs(Ie,{children:[o.jsxRuntimeExports.jsx(tt,{children:o.jsxRuntimeExports.jsxs(q,{children:[Y(i.zeniAccountList.totalAvailableBalance),p("totalBalance")]})}),o.jsxRuntimeExports.jsx(rt,{windowSize:n,children:t.accountDetail?.accountBalance.available?o.jsxRuntimeExports.jsx(o.jsxRuntimeExports.Fragment,{children:o.jsxRuntimeExports.jsx(e.AmountBalance,{amount:t.accountDetail?.accountBalance.available,integerStyles:e.textStyles.h2Regular.cssObject,decimalStyles:e.textStyles.h5Medium.cssObject})}):null}),d?o.jsxRuntimeExports.jsxs(_,{windowSize:n,children:[t.accountDetail?.accountNumber,o.jsxRuntimeExports.jsx(v,{children:o.jsxRuntimeExports.jsx(e.Tooltip,{display:"flex",placement:"top",title:i.zeniAccountDetail.hide,enterDelay:600,children:o.jsxRuntimeExports.jsx(at,{"data-testid":e.generateDataTestId("hide-account-number"),onClick:()=>{j(!1)}})})}),o.jsxRuntimeExports.jsx(v,{children:o.jsxRuntimeExports.jsx(e.Tooltip,{display:"flex",placement:"right",title:m?T.copyToClipBoard.copied:T.copyToClipBoard.copy,enterDelay:600,children:m===!0?o.jsxRuntimeExports.jsx(ut,{}):o.jsxRuntimeExports.jsx(xt,{onClick:f,"data-testid":e.generateDataTestId("copy-account-number")})})})]}):o.jsxRuntimeExports.jsxs(_,{windowSize:n,children:[t.accountDetail?.maskedAccountNumber,o.jsxRuntimeExports.jsx(v,{children:o.jsxRuntimeExports.jsx(e.Tooltip,{display:"flex",placement:"top",title:i.zeniAccountDetail.show,enterDelay:600,children:o.jsxRuntimeExports.jsx(it,{"data-testid":e.generateDataTestId("show-account-number"),onClick:()=>{j(!0)}})})})]})]}),o.jsxRuntimeExports.jsxs(ze,{children:[o.jsxRuntimeExports.jsxs(q,{children:[Y(i.common.totalYieldEarned),p("totalInterest")]}),o.jsxRuntimeExports.jsxs(Ze,{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[o.jsxRuntimeExports.jsx(e.AmountBalance,{amount:t.accountSummary?.totalInterest.available,integerStyles:e.textStyles.largeRegular.cssObject,decimalStyles:e.textStyles.smallRegular.cssObject}),o.jsxRuntimeExports.jsx(Xe,{}),o.jsxRuntimeExports.jsx(Ke,{children:`${i.common.currentAverageYield} ${t.accountDetail?.annualPercentageYield}`})]})]})]})},ve=s.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+`,Te=s(e.SvgNoTransaction)`
+  width: ${t=>u.styledNoTransactionIconSize.valuePx(t.windowSize)};
+  height: ${t=>u.styledNoTransactionIconSize.valuePx(t.windowSize)};
+  margin-top: 128px;
+  margin-bottom: ${e.Space.sp3};
+`,ke=s(e.StandardRegular)`
+  color: ${t=>t.theme.colors.hero};
+  text-align: center;
+`,Be=s.div`
+  margin-top: ${t=>u.accountDetailContentMarginTop.valuePx(t.windowSize)};
+  margin-right: ${t=>u.accountDetailHeaderPaddingRight.valuePx(t.windowSize)};
+  margin-left: ${t=>u.accountDetailHeaderPaddingLeft.valuePx(t.windowSize)};
+  margin-bottom: ${e.Space.sp0};
+  &:last-child {
+    margin-bottom: ${e.Space.sp8};
+  }
+`,Pe=s.div`
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: ${e.Space.sp3};
+`,Ae=s.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+`,De=s.div`
+  display: flex;
+  gap: ${t=>`${u.accountDetailHeaderGap.valuePx(t.windowSize)}`};
+  flex-direction: ${t=>t.windowSize==="small"?"column":"row"};
+  background: ${t=>t.theme.colors.grey4};
+  padding-top: ${e.Space.sp6};
+  padding-right: ${t=>u.accountDetailHeaderPaddingRight.valuePx(t.windowSize)};
+  padding-bottom: ${t=>u.accountDetailHeaderPaddingBottom.valuePx(t.windowSize)};
+  padding-left: ${t=>u.accountDetailHeaderPaddingLeft.valuePx(t.windowSize)};
+  justify-content: space-between;
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+`,Ne=s.div`
+  box-shadow: ${t=>`${e.Space.sp0} 2px ${e.Space.sp1} ${t.theme.colors.dropShadowNormal}`};
+  border-radius: ${e.Space.sp2};
+`,Le=s.div`
+  display: flex;
+  gap: ${e.Space.sp3};
+  flex-direction: column;
+  justify-content: space-between;
+`,Ie=s.div``,ze=s.div``,Me=s.div`
+  display: flex;
+  gap: ${e.Space.sp3};
+  flex: 1;
+  flex-direction: column;
+  justify-content: flex-end;
+`,Ue=s.g`
+  transform: ${t=>`translate(${t.translateX}px, ${t.translateY}px)`};
+`,He=s.div`
+  display: flex;
+  width: 100%;
+  height: calc(100% - 60px);
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+`,We=s.div`
+  height: ${e.Space.sp12};
+  width: ${e.Space.sp12};
+  background: ${t=>t.theme.colors.background};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 50%;
+  cursor: pointer;
+  & svg {
+    margin: ${e.Space.sp5};
+    color: ${t=>t.theme.colors.grey1};
+  }
+  &:hover {
+    & svg {
+      color: ${t=>t.theme.colors.primary};
+    }
+  }
+`,Oe=s(e.SmallRegularSp)`
+  margin-top: ${e.Space.sp3};
+  color: ${t=>t.theme.colors.hero};
+`,Fe=s(e.SvgReload)`
+  height: ${e.Space.sp5};
+  width: ${e.Space.sp5};
+  margin: ${e.Space.sp5};
+  color: ${t=>t.theme.colors.grey1};
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+  }
+`,Ge=s.text`
+  fill: ${t=>t.theme.colors.hero};
+  ${t=>`${$e.tickLabelText.style(t.windowSize)}`};
+`,Ye=s.linearGradient``,Ve=s.stop``,qe=s.stop``,_e=s.div`
+  display: flex;
+  flex-direction: row;
+  gap: ${t=>u.accBtnsGap.valuePx(t.windowSize)};
+  justify-content: ${t=>t.windowSize==="small"?"space-between":"flex-end"};
+  align-items: center;
+`,Je=s.div`
+  display: flex;
+  justify-content: flex-end;
+  margin-left: -${e.Space.sp8};
+  .recharts-cartesian-grid {
+    .recharts-cartesian-grid-horizontal {
+      line:last-child {
+        display: none;
+      }
+    }
+  }
+`,Ze=s.div`
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+`,Xe=s.div`
+  align-self: center;
+  background-color: ${t=>t.theme.colors.grey1};
+  border-radius: 50%;
+  width: ${e.Space.sp1};
+  height: ${e.Space.sp1};
+  margin: ${e.Space.sp0} ${e.Space.sp1};
+  margin-top: 2px;
+`,Ke=s(e.ExtraSmallRegular)`
+  color: ${t=>t.theme.colors.primary};
+  margin-top: ${e.Space.sp1};
+`,Qe=s.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  cursor: pointer;
+  color: ${t=>t.theme.colors.hero};
+  &:hover {
+    .btnText {
+      color: ${t=>t.theme.colors.primary};
+    }
+    svg {
+      color: ${t=>t.theme.colors.primary};
+    }
+  }
+  margin-left: ${e.Space.sp3};
+`,et=s.div`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  cursor: pointer;
+  color: ${t=>t.theme.colors.hero};
+  &:hover {
+    .btnText {
+      color: ${t=>t.theme.colors.primary};
+    }
+    svg {
+      color: ${t=>t.theme.colors.primary};
+    }
+  }
+  margin-right: ${e.Space.sp3};
+`,tt=s(e.SmallRegular)`
+  display: flex;
+  color: ${t=>t.theme.colors.hero};
+`,ot=s.div`
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  position: relative;
+  top: -22px;
+  right: 103px;
+  min-height: ${e.Space.sp6};
+  min-width: 66px;
+  border-radius: ${e.Space.sp1};
+  padding: ${e.Space.sp0} ${e.Space.sp2};
+  background-color: ${e.Colors.blackColor};
+`,st=s.circle`
+  stroke: ${t=>t.theme.colors.brandColorJade};
+  fill: ${t=>t.theme.colors.grey5};
+`,V=s(e.SmallRegular)`
+  color: ${t=>t.isSublabel===!0?e.Colors.neutralGrey1Light:e.Colors.brandColorPearl};
+`,q=s.div`
+  display: flex;
+  gap: ${e.Space.sp1};
+`,nt=s(e.SmallRegular)`
+  color: ${t=>t.theme.colors.hero};
+`,_=s(e.LargeRegular)`
+  text-transform: capitalize;
+  color: ${t=>`${t.windowSize==="small"?t.theme.colors.hero:t.theme.colors.champion}`};
+  display: flex;
+  align-items: center;
+`,it=s(e.SvgVisibleOn)`
+  height: ${e.Space.sp3};
+  width: ${e.Space.sp3};
+  margin-left: ${e.Space.sp2};
+  margin-right: ${e.Space.sp2};
+  cursor: pointer;
+  color: ${t=>t.theme.colors.hero};
+`,at=s(e.SvgVisibleOff)`
+  height: ${e.Space.sp3};
+  width: ${e.Space.sp3};
+  margin-left: ${e.Space.sp2};
+  margin-right: ${e.Space.sp2};
+  color: ${t=>t.theme.colors.hero};
+`,rt=s.div`
+  display: flex;
+  align-items: baseline;
+  color: ${t=>t.theme.colors.primary};
+`,J=s(e.StandardRegular)`
+  margin-left: ${e.Space.sp2};
+`,Z=s(e.SmallRegular)`
+  margin-left: ${e.Space.sp2};
+`,ct=s(e.LargeSemiBold)`
+  color: ${t=>t.theme.colors.primary};
+`,lt=s.div`
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  &:hover {
+    div {
+      color: ${t=>t.theme.colors.primary};
+    }
+
+    svg {
+      color: ${t=>t.theme.colors.primary};
+    }
+  }
+`,pt=s(e.SvgArrowRight)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  color: ${t=>t.theme.colors.grey1};
+`,dt=s(e.StandardRegular)`
+  color: ${t=>t.theme.colors.hero};
+  margin-right: ${e.Space.sp2};
+`,v=s.div`
+  display: flex;
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+    svg {
+      color: ${t=>t.theme.colors.primary};
+    }
+  }
+`,xt=s(e.SvgCopy)`
+  height: ${e.Space.sp3};
+  width: ${e.Space.sp3};
+  color: ${t=>t.theme.colors.hero};
+  cursor: pointer;
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+  }
+`,ut=s(e.SvgTickRoundFill)`
+  height: ${e.Space.sp3};
+  width: ${e.Space.sp3};
+  color: ${e.Colors.success};
+`,mt=s(ye)`
+  width: ${e.Space.sp4};
+  min-width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+`,ht=s(Se.SvgBankLetter)`
+  width: ${e.Space.sp4};
+  min-width: ${e.Space.sp4};
+  height: ${e.Space.sp4};
+`,gt=s(e.SmallRegular)`
+  margin-bottom: ${e.Space.sp2};
+  display: flex;
+`,jt=s(e.SmallRegular)`
+  padding: 12px ${e.Space.sp3};
+  color: ${t=>t.theme.colors.hero};
+  border-radius: ${e.Space.sp1};
+`,I=s(e.SmallRegular)`
+  color: ${t=>t.theme.colors.brandColorPearl};
+  margin-top: ${e.Space.sp2};
+  display: flex;
+  justify-content: space-between;
+`,z=s.div`
+  color: ${t=>t.theme.colors.hero};
+`,M=s.div`
+  color: ${e.Colors.primaryDark};
+`,St=s(e.SvgInfo)`
+  width: ${e.Space.sp3};
+  height: ${e.Space.sp3};
+  color: ${t=>t.theme.colors.hero};
+  &:hover {
+    color: ${t=>t.theme.colors.primary};
+  }
+`,ft=s(e.SmallRegular)`
+  padding: ${e.Space.sp2};
+  color: ${t=>t.theme.colors.hero};
+`,yt=s.div`
+  height: -webkit-fill-available;
+  align-self: center;
+`,Rt=s(e.StandardMedium)`
+  opacity: 0.25;
+`;exports.default=Ee;