PageSourceSearch

https://www.income.com.sg/assets/js/widgets/savings-calculator/sav…W2ktZjCHlzmIB-Dtn6e0Q2mdbkjOSxVogLmX9JXrdM0

js income.com.sg collected 2026-09-24 09:16:26 UTC 24,252 bytes, 13 lines download raw bytes

1import{R as ue}from"../../../../vendor/react-mount.js";import{r as v,j as e}from"../../../../vendor/react-vendors.js";import{B as D}from"../../../../vendor/button.js";import{D as I}from"../../../../vendor/dropdown.js";import{F as $}from"../../../../vendor/form-field.js";import{I as B}from"../../../../vendor/input-number.js";import{I as X}from"../../../../vendor/icon.js";import{h as de}from"../tooltip/tooltip.js";import{M as me}from"../../../../vendor/modal.js";import{c as ne}from"../../../../vendor/index.js";import{p as ge}from"../../../../vendor/purify.es.js";import{A as W}from"../../../../vendor/accordion.js";import{C as re,a as ve,L as pe,B as xe,f as he,p as fe,d as be,e as ye}from"../../../../vendor/chart.js";import{l as ae}from"../../../../vendor/helper.js";import"../../../../vendor/bootstrap.esm.js";import"../accordion/accordion.js";const le=v.createContext(void 0),oe=()=>{const t=v.useContext(le);if(!t)throw new Error("SavingsCalculatorContext must be used within a SavingsCalculatorProvider");return t},ie=12,ce=.03;var S=(t=>(t.LUMP_SUM="lump_sum",t.MONTHLY="monthly",t.QUARTERLY="quarterly",t.BI_ANNUALLY="bi_annually",t.ANNUALLY="annually",t))(S||{}),j=(t=>(t.SAVINGS_GOAL="savings_goal",t.REGULAR_SAVINGS="regular_savings",t))(j||{});const Se=30,Q=Array.from({length:Se},(t,a)=>({label:`${a+1} year${a===0?"":"s"}`,year:a+1})),U={[S.LUMP_SUM]:{type:S.LUMP_SUM,label:"as a lump sum",monthsPerDeposit:1/0},[S.MONTHLY]:{type:S.MONTHLY,label:"every month",monthsPerDeposit:1},[S.QUARTERLY]:{type:S.QUARTERLY,label:"every 3 months",monthsPerDeposit:3},[S.BI_ANNUALLY]:{type:S.BI_ANNUALLY,label:"every 6 months",monthsPerDeposit:6},[S.ANNUALLY]:{type:S.ANNUALLY,label:"every year",monthsPerDeposit:12}};function je(t=0,a,l,c,o,m="end"){let s=0;return t>0&&(s+=t/Math.pow(1+a,o)),s}function z(t,a,l,c,o,m="end"){let s=0;if(t>0&&(s+=t*Math.pow(1+a,o)),l>0){const u=a/c,i=c*o;s+=l*((Math.pow(1+u,i)-1)/u),m==="start"&&(s*=1+u)}return s}function Ae(t,a,l,c=0,o="end"){if(t===0)return-(l+c)/a;const m=Math.pow(1+t,a);let s=-(t*(l*m+c))/(m-1);return o==="start"&&(s/=1+t),s}const y=(t,a=0)=>t?t.toLocaleString(void 0,{minimumFractionDigits:a,maximumFractionDigits:a}):void 0,Ie=()=>{const[t,a]=v.useState(null),[l,c]=v.useState(0),[o,m]=v.useState(null),[s,u]=v.useState(.04),[i,g]=v.useState(null),[f,n]=v.useState({labels:[],items:[]}),d=()=>{const x=l>0,b=o!==null,r=s>=0;return x&&b&&r&&i!==null},p=(x,b,r,T,F)=>{const _={labels:[],items:[]},q=ie/U[r].monthsPerDeposit,w=b*q;let k=0;for(let Y=1;Y<=F;Y++){const L=z(x,T,w,1,Y,"start"),P=w*Y,C=L-(x+P),N=(C-k)/L;_.labels=["Year","Interest","Initial savings","Annual savings","Accumulated savings","Accumulated interest","Interest gained","Total accumulation"],_.items.push({index:{value:Y,label:Y.toString()},interestRatePerYear:{value:N,label:(N*100).toFixed(0),suffix:"%"},initialSavings:{prefix:"$",value:x,label:y(x)},annualSavings:{prefix:"$",value:w,label:y(w)},accumulatedAnnualSavings:{prefix:"$",value:P,label:y(P)},accumulatedInterest:{prefix:"$",value:C,label:y(C)},interestGained:{prefix:"$",value:C-k,label:y(C-k)},totalSavings:{prefix:"$",value:L,label:y(L)}}),k=C}return _},A=()=>{if(!d())return;const x=o===S.LUMP_SUM,b=p(x?l:0,x?0:l,o,s,i);a(b.items[b.items.length-1].totalSavings.value),n(b)};return v.useEffect(()=>{n({labels:[],items:[]})},[l,o,s,i]),{savingsTargetAmount:t,setSavingsTargetAmount:a,savingsAmountPerDeposit:l,setSavingsAmountPerDeposit:c,savingsFrequencyType:o,setSavingsFrequencyType:m,savingsInterestRatePerYear:s,setSavingsInterestRatePerYear:u,savingsPeriodInYears:i,setSavingsPeriodInYears:g,breakdownTable:f,isCanCalculate:d,calculate:A}},Ne=()=>{const[t,a]=v.useState(j.SAVINGS_GOAL);return{mode:t,setMode:a}},Ce=()=>{const[t,a]=v.useState(null),[l,c]=v.useState(0),[o,m]=v.useState(null),[s,u]=v.useState(.04),[i,g]=v.useState(null),[f,n]=v.useState(0),[d,p]=v.useState(.04),[A,x]=v.useState({labels:[],items:[]}),b=()=>{const F=t>0,_=o!==null,q=s>=0,w=i!==null,k=f>=0,Y=d>=0,L=f>=(t||0);return F&&_&&q&&w&&k&&Y&&!L},r=()=>{if(!b())return{labels:[],items:[]};const _=U[o].monthsPerDeposit,q=z(t,ce,0,0,i,"start"),w=z(f,d,0,0,i,"start"),k=q-w,Y=o===S.LUMP_SUM;let L={labels:[],items:[]};L.labels=["Year","Interest","Initial savings","Annual savings","Accumulated savings","Accumulated interest","Interest gained","Total accumulation"];let P=0;if(Y){const C=je(k,s,0,0,i,"start");for(let N=1;N<=i;N++){const E=z(C,s,0,0,N,"start"),M=E,R=M-C,G=(R-P)/M;L.items.push({index:{value:N,label:N.toString()},interestRatePerYear:{value:G,label:(G*100).toFixed(0),suffix:"%"},initialSavings:{prefix:"$",value:C,label:y(C)},annualSavings:{prefix:"$",value:E,label:y(E)},accumulatedAnnualSavings:{prefix:"$",value:E,label:y(E)},accumulatedInterest:{prefix:"$",value:R,label:y(R)},interestGained:{prefix:"$",value:R-P,label:y(R-P)},totalSavings:{prefix:"$",value:M,label:y(M)}}),P=R}}else{const C=ie/_,N=-Ae(s,i,0,k,"start"),E=N/C;c(E);for(let M=1;M<=i;M++){const R=N*M,G=z(0,s,N,1,M,"start"),V=G-R,te=(V-P)/G;L.items.push({index:{value:M,label:M.toString()},interestRatePerYear:{value:te,label:(te*100).toFixed(0),suffix:"%"},initialSavings:{prefix:"$",value:0,label:y(0)},annualSavings:{prefix:"$",value:N,label:y(N)},accumulatedAnnualSavings:{prefix:"$",value:R,label:y(R)},accumulatedInterest:{prefix:"$",value:V,label:y(V)},interestGained:{prefix:"$",value:V-P,label:y(V-P)},totalSavings:{prefix:"$",value:G,label:y(G)}}),P=V}}return L},T=()=>{if(!b())return;const F=r();x(F)};return v.useEffect(()=>{x({labels:[],items:[]})}
1,[t,i,o,s,f,d]),{savingsTargetAmount:t,setSavingsTargetAmount:a,savingsAmountPerDeposit:l,setSavingsAmountPerDeposit:c,savingsPeriodInYears:i,setSavingsPeriodInYears:g,savingsFrequencyType:o,setSavingsFrequencyType:m,savingsInterestRatePerYear:s,setSavingsInterestRatePerYear:u,existingSavingsAmount:f,setExistingSavingsAmount:n,existingSavingsInterestRatePerYear:d,setExistingSavingsInterestRatePerYear:p,breakdownTable:A,isCanCalculate:b,calculate:T}},K=({title:t,placement:a,children:l})=>(v.useEffect(()=>{de()},[]),e.jsx("span",{"data-bs-toggle":"tooltip","data-bs-placement":a,title:t,children:l})),Z=t=>t*100,ee=t=>t/100,H=({title:t,subtitle:a,children:l})=>e.jsxs("div",{className:"savings-calculator-control-section",children:[(t||a)&&e.jsxs("div",{className:"savings-calculator-control-section-header",children:[t&&e.jsx("p",{className:"text-color-primary font-subsection fw-bold mb-0",children:t}),a&&e.jsx("p",{className:"text-color-primary font-body-sm mb-0",children:a})]}),l]}),Te=({iconUrl:t,text:a,isActive:l,onClick:c})=>e.jsxs("div",{className:ne("savings-calculator-control-option","cursor-pointer",{active:l}),onClick:c,children:[e.jsx("img",{src:t}),e.jsx("p",{className:"text-color-primary font-body fw-bold mb-0",children:a})]}),J=({children:t})=>e.jsx("div",{className:"savings-calculator-control-options",children:t});J.Option=Te;const Pe=({optionOneLabel:t,optionOneIconUrl:a,optionTwoLabel:l,optionTwoIconUrl:c,assumptionLabel:o,assumptionHeader:m,assumptionDetails:s})=>{var p,A,x,b;const{savingsCalculatorConfig:u,savingsGoalCalculator:i,regularSavingsCalculator:g}=oe(),f=u.mode===j.SAVINGS_GOAL?!i.isCanCalculate():!g.isCanCalculate(),n=()=>{u.mode===j.SAVINGS_GOAL?i.calculate():g.calculate()},d=`As a point of consideration, do note that average inflation rate is about ${(ce*100).toFixed(0)}%.`;return e.jsxs("div",{className:"savings-calculator-control",children:[e.jsx(H,{title:"I want to",children:e.jsxs(J,{children:[e.jsx(J.Option,{iconUrl:a,text:t,isActive:u.mode===j.SAVINGS_GOAL,onClick:()=>u.setMode(j.SAVINGS_GOAL)}),e.jsx(J.Option,{iconUrl:c,text:l,isActive:u.mode===j.REGULAR_SAVINGS,onClick:()=>u.setMode(j.REGULAR_SAVINGS)})]})}),u.mode===j.SAVINGS_GOAL&&e.jsxs(e.Fragment,{children:[e.jsx(H,{title:"My Goal",children:e.jsxs("div",{className:"savings-calculator-control-goal-form",children:[e.jsxs("span",{className:"text-color-primary font-body",children:["I want to accumulate $",e.jsx($,{children:e.jsx(B,{id:"savings-target",className:"input-calculation",placeholder:"goal amount",integerOnly:!0,value:i.savingsTargetAmount,onChange:r=>i.setSavingsTargetAmount(r),useCurrency:!0})})]}),e.jsxs("span",{className:"text-color-primary font-body",children:["in",e.jsxs(I,{variant:"underline",children:[e.jsx(I.Toggle,{children:((p=Q.find(r=>r.year===i.savingsPeriodInYears))==null?void 0:p.label)||"select number of year(s)"}),e.jsx(I.Menu,{children:Q.map(r=>e.jsx(I.Menu.Item,{isActive:r.year===i.savingsPeriodInYears,onClick:()=>i.setSavingsPeriodInYears(r.year),children:r.label},crypto.randomUUID()))})]}),"by contributing"]}),e.jsxs("span",{className:"text-color-primary font-body",children:[e.jsxs(I,{variant:"underline",children:[e.jsx(I.Toggle,{children:((A=U[i.savingsFrequencyType])==null?void 0:A.label)||"select frequency"}),e.jsx(I.Menu,{children:Object.values(U).map((r,T)=>e.jsx(I.Menu.Item,{isActive:r.type===i.savingsFrequencyType,onClick:()=>i.setSavingsFrequencyType(r.type),children:r.label},T))})]}),"to my savings"]}),e.jsxs("span",{className:"text-color-primary font-body",children:["at an interest rate of",e.jsx($,{children:e.jsx(B,{id:"savings-interest-rate",className:"input-calculation",integerOnly:!1,value:Z(i.savingsInterestRatePerYear),onChange:r=>i.setSavingsInterestRatePerYear(ee(r)),maxLength:2})}),"% p.a.",e.jsx(K,{title:d,placement:"top",children:e.jsx(X,{className:"text-color-brand",iconName:"status-info"})})]}),i.savingsInterestRatePerYear<.03&&e.jsx("span",{className:"text-color-secondary font-body-sm",children:"It is recommended to save at an interest rate higher than the average inflation rate of 3%, such that your savings are able to grow as expected."})]})}),e.jsx(H,{title:"My existing savings",subtitle:"Include savings that you have in cash, bank accounts, CPF, investments, and other relevant savings or assets.",children:e.jsxs("div",{children:[e.jsxs("span",{className:"text-color-primary font-body",children:["I have saved $",e.jsx($,{children:e.jsx(B,{id:"existing-savings",className:"input-calculation",integerOnly:!0,value:i.existingSavingsAmount,onChange:r=>i.setExistingSavingsAmount(r),useCurrency:!0})}),"and am"]}),e.jsxs("span",{className:"text-color-primary font-body",children:["growing at the rate of",e.jsx($,{children:e.jsx(B,{id:"existing-savings-interest-rate",className:"input-calculation",integerOnly:!1,value:Z(i.existingSavingsInterestRatePerYear),onChange:r=>i.setExistingSavingsInterestRatePerYear(ee(r)),maxLength:2})}),"% p.a.",e.jsx(K,{title:d,placement:"top",children:e.jsx(X,{className:"text-color-brand",iconName:"status-info"})})]}),i.savingsTargetAmount<=i.existingSavingsAmount&&e.jsx("span",{className:"text-color-secondary font-body-sm",children:"Great work! Your existing savings has already exceeded your savings goal. Enter a higher savings goal to calculate how to reach your next savings milestone."})]})})]}),u.mode===j.REGULAR_SAVINGS&&e.jsx(e.Fragment,{children:e.jsx(H,{title:"My Goal",children:e.jsxs("div",{className:"savings-calculator-control-goal-form",children:[e.jsxs("span",{className:"text-color-primary font-body",children:["I want to save $",e.jsx($,{children:e.jsx(B,{id:"savings-target",className:"input-calculation",integerOnly:!0,value:g.savingsAmountPerDeposit,onChange:r=>g.setSavingsAmountPerDeposit(r),useCurrency:!0})}),e.jsxs(I,{variant:"underline",children:[e.jsx(I.Toggle,{children:((x=U[g.savingsFrequencyType])==null?void 0:x.label)||"select frequency"}),e.jsx(I.Menu,{children:Object.values(U).map((r,T)=>e.jsx(I.Menu.Item,{isActive:r.type===g.savingsFrequencyType,onClick:()=>g.setSavingsFrequencyType(r.type),children:r.label},T))})]})]}),e.jsxs("span",{className:"text-color-primary font-body",children:["at an interest rate of",e.jsx($,{children:e.jsx(B,{id:"savings-interest-rate",className:"input-calculation",integerOnly:!1,value:Z(g.savingsInterestRatePerYear),onChange:r=>g.setSavingsInterestRatePerYear(ee(r)),maxLength:2})}),"% p.a.",e.jsx(K,{title:d,placement:"top",children:e.jsx(X,{className:"text-color-brand",iconName:"status-info"})})]}),g.savingsInterestRatePerYear<.03&&e.jsx("span",{className:"text-color-secondary font-body-sm",children:"It is recommended to save at an interest rate higher than the average inflation rate of 3%, such that your savings are able to grow as expected."}),e.jsxs("span",{className:"text-color-primary font-body",children:["for",e.jsxs(I,{variant:"underline",children:[e.jsx(I.Toggle,{children:((b=Q.find(r=>r.year===g.savingsPeriodInYears))==null?void 0:b.label)||"select number of year
1(s)"}),e.jsx(I.Menu,{children:Q.map(r=>e.jsx(I.Menu.Item,{isActive:r.year===g.savingsPeriodInYears,onClick:()=>g.setSavingsPeriodInYears(r.year),children:r.label},crypto.randomUUID()))})]})]})]})})}),e.jsx(H,{children:e.jsxs("div",{className:"savings-calculator-control-actions spacing-subspacing",children:[e.jsx(D,{style:"primary",size:"default",disabled:f,onClick:n,children:e.jsx(D.Text,{children:"Calculate"})}),e.jsx(me,{id:"savings-calculator-info",toggler:{className:"fw-normal",text:o},header:{title:m},children:e.jsx("div",{dangerouslySetInnerHTML:{__html:ge.sanitize(s)}})})]})})]})},Le=t=>{const a=+t;return a>=1e6?(a/1e6).toFixed(1)+"m":a>=1e3?Math.round(a/1e3)+"k":a.toLocaleString()},O={colors:{active:{0:"#F57100FF",1:"#FFE3CBFF"},inactive:{0:"#F5710026",1:"#FFE3CB26"},fallback:"#ccc"}},se={mobile:{width:311,height:308,tooltipWidth:180},desktop:{width:532,height:308,tooltipWidth:218}},h={family:"'Ubuntu', 'Calibri', sans-serif",size:14,lineHeight:22,color:"#8B8D8E",labelColor:"#262727"},Me=t=>(t.datasets.forEach((a,l)=>{a.backgroundColor=O.colors.active[l]}),t),Ye=t=>({x:{display:!0,stacked:!0,title:{display:!0,text:t.x,font:{family:h.family,size:h.size,lineHeight:h.lineHeight/h.size},color:h.labelColor},ticks:{autoSkip:!1,maxTicksLimit:10,font:{family:h.family,size:h.size,lineHeight:h.lineHeight/h.size},color:h.color},grid:{display:!1}},y:{display:!0,stacked:!0,title:{display:!0,text:t.y,font:{family:h.family,size:h.size,lineHeight:h.lineHeight/h.size},color:h.labelColor,padding:{bottom:8}},ticks:{autoSkip:!1,maxTicksLimit:5,callback:Le,font:{family:h.family,size:h.size,lineHeight:h.lineHeight/h.size},color:h.color,textAlign:"center"}}}),Re=(t,a)=>({title:{display:!1},legend:{display:!1},tooltip:{enabled:!1,external:l=>ke(l,t,a)}}),ke=(t,a,l)=>{const c=t.tooltip,m=t.chart.canvas.parentNode;let s=m.querySelector("#chartjs-tooltip");if(s||(s=document.createElement("div"),s.id="chartjs-tooltip",s.className="custom-tooltip",m.appendChild(s)),c.opacity===0){s.style.opacity="0",s.style.transform="translate(-50%, -50%) scale(0.8)";return}if(c.dataPoints&&c.dataPoints.length>0){const d=c.dataPoints[0].dataIndex+1,p=c.dataPoints.map(r=>({label:r.dataset.tooltip||r.dataset.label,value:r.parsed.y})),A=p.reduce((r,T)=>r+T.value,0),b=`
2                <div class="tooltip-title fw-bold">
3                    ${a.tooltipTitle.replace("%s",d)}
4                </div>
5                ${p.map(r=>`
6                    <div class="tooltip-item">
7                    ${r.label}: <span class="tooltip-value">${ae(r.value)}</span>
8                    </div>
9                `).join("")}
10                <div class="tooltip-item">
11                    ${a.total}: <span class="tooltip-value">${ae(A)}</span>
12                </div>
13            `;s.innerHTML=b}let u=c.caretX;const i=document.body.clientWidth,f=c.caretX+l.tooltipWidth-i;f>0&&(u-=f*.5),s.style.opacity="1",s.style.left=u+"px",s.style.top=c.caretY+"px",s.style.transform="translate(-50%, -50%) scale(1)"},we=({chartData:t})=>{const{datasets:a=[]}=t;return e.jsx("div",{className:"stacker-bar-legend d-flex flex-wrap",children:a.map((l,c)=>e.jsxs("div",{className:"stacker-bar-legend-item d-flex",children:[e.jsx("div",{className:"stacker-bar-legend-item-color",style:{backgroundColor:O.colors.active[c]||O.colors.fallback}}),e.jsx("span",{className:"stacker-bar-legend-item-label font-body-xs",children:l.label})]},c))})};re.register(ve,pe,xe,he,fe,be,ye);const _e=({settings:t})=>{const a=v.useRef(null),l=v.useRef(null),[c,o]=v.useState(!1),{chartLabel:m,chartData:s}=t,u=c?se.mobile:se.desktop,i=(n,d,p)=>{if(d.length>0){const A=d[0].index;p.data.datasets.forEach((x,b)=>{x.backgroundColor=p.data.labels.map((r,T)=>T===A?O.colors.active[b]:O.colors.inactive[b])})}else p.data.datasets.forEach((A,x)=>{A.backgroundColor=O.colors.active[x]});p.update("none")},g=n=>({responsive:!0,maintainAspectRatio:!1,onHover:i,scales:Ye(n),plugins:Re(n,u),interaction:{mode:"nearest",axis:"x",intersect:!1},font:{family:h.family,size:h.size,lineHeight:h.lineHeight/h.size}}),f=n=>{let d=null;const p=()=>{d&&clearTimeout(d),l.current&&(d=setTimeout(()=>
13{l.current.data.datasets.forEach((A,x)=>{A.backgroundColor=O.colors.active[x]}),l.current.update("none")},50))};return n.addEventListener("mouseleave",p),()=>n.removeEventListener("mouseleave",p)};return v.useEffect(()=>{const n=()=>{o(window.innerWidth<=480)};return n(),window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)},[]),v.useEffect(()=>{var p;const n=(p=a.current)==null?void 0:p.getContext("2d");if(!n)return;l.current&&l.current.destroy(),l.current=new re(n,{type:"bar",data:Me(s),options:g(m)});const d=f(a.current);return()=>{l.current&&l.current.destroy(),d()}},[s,c]),e.jsxs("div",{className:"stacker-bar-container d-flex flex-column align-items-center",children:[e.jsx(we,{chartData:s}),e.jsx("div",{className:"stacker-bar-wrapper",children:e.jsx("div",{className:"stacker-bar-canvas-container",children:e.jsx("canvas",{ref:a,width:u.width,height:u.height})})})]})},Ee=t=>({handleOnPrint:l=>{const c=l.target.closest("body");if(!c){console.error("No body element found");return}c.classList.add(t),window.print(),window.addEventListener("afterprint",()=>{c.classList.remove(t)},{once:!0})}}),Ge=({calculatorMode:t,resultGraphHeader:a,resultAccordionLabel:l,savePdfLabel:c,savingsDetail:o})=>{var g,f;const{handleOnPrint:m}=Ee("savings-calculator-print-mode"),s=(g=U[o==null?void 0:o.frequencyType])==null?void 0:g.label,i=(()=>{const n={chartLabel:{y:"Amount ($)",x:"Years",total:"Total",tooltipTitle:"Year %s"},chartData:{labels:[],datasets:[{label:"Accumulated Savings",tooltip:o.frequencyType===S.LUMP_SUM?"Initial Savings":"Savings",data:[]},{label:"Accumulated Interest",tooltip:"Interest",data:[]}]}};return o.breakdownTable.items.forEach(d=>{n.chartData.datasets[0].data.push(o.frequencyType===S.LUMP_SUM?Math.round(d.initialSavings.value):Math.round(d.accumulatedAnnualSavings.value)),n.chartData.datasets[1].data.push(Math.round(d.accumulatedInterest.value)),n.chartData.labels.push(d.index.value%2?"":d.index.value)}),n})();return e.jsxs("div",{className:"savings-calculator-result-content",children:[e.jsxs("div",{className:"savings-calculator-result-content-header",children:[e.jsx("p",{className:"text-color-primary font-subsection fw-bold mb-0",children:"Your results"}),t===j.SAVINGS_GOAL&&e.jsxs("p",{className:"text-color-primary font-body mb-0",children:["You need to save"," ",e.jsxs("span",{className:"text-color-brand fw-bold",children:["$",y(o.frequencyType==S.LUMP_SUM?(f=o.breakdownTable.items[0])==null?void 0:f.initialSavings.value:o.amountPerDeposit,2)," ",s]})," for ",e.jsxs("span",{className:"fw-bold",children:[o.periodInYears," year(s)"]})," ","to reach"," ",e.jsxs("span",{className:"fw-bold",children:["$",y(o.targetAmount)]}),"."]}),t===j.REGULAR_SAVINGS&&e.jsxs("p",{className:"text-color-primary font-body mb-0",children:["You will have"," ",e.jsxs("span",{className:"text-color-brand fw-bold",children:["$",y(o.targetAmount)]})," by saving ",e.jsxs("span",{className:"fw-bold",children:["$",y(o.amountPerDeposit)," ",s]})," for ",e.jsxs("span",{className:"fw-bold",children:[o.periodInYears," year(s)"]}),"."]})]}),e.jsxs("div",{className:"savings-calculator-result-content-graph-header",children:[e.jsx("p",{className:"text-color-primary font-default fw-bold mb-0 text-center",children:a}),e.jsxs("p",{className:"savings-calculator-result-content-graph-header-rotate-device-hint text-color-secondary font-body-sm mb-0 text-center d-lg-none",children:[e.jsx(X,{iconName:"Rotate-device"})," Rotate your screen for a closer view"]})]}),e.jsx("div",{className:"savings-calculator-result-content-graph",children:e.jsx(_e,{settings:i})}),e.jsx("div",{className:"savings-calculator-result-content-detailed-breakdown",children:e.jsx(W,{parentId:"savings-calculator-result-content-accordion",children:e.jsxs(W.Item,{children:[e.jsx(W.Item.Header,{targetId:"savings-calculator-result-content-accordion-item",children:l}),e.jsx(W.Item.Body,{targetId:"savings-calculator-result-content-accordion-item",children:e.jsx("div",{className:"savings-calculator-result-content-table",children:e.jsxs("table",{children:[e.jsx("thead",{children:e.jsx("tr",{children:o.breakdownTable.labels.map(n=>o.frequencyType===S.LUMP_SUM&&["Annual savings","Accumulated savings"].includes(n)||o.frequencyType!==S.LUMP_SUM&&["Initial savings"].includes(n)?null:e.jsx("th",{className:"fw-bold",children:n}))})}),e.jsx("tbody",{children:o.breakdownTable.items.map((n,d)=>e.jsxs("tr",{children:[e.jsx("td",{children:n.index.label}),e.jsxs("td",{children:[n.interestRatePerYear.label,n.interestRatePerYear.suffix]}),o.frequencyType===S.LUMP_SUM&&e.jsxs("td",{className:ne({"text-color-secondary":d!=0}),children:[n.initialSavings.prefix,n.initialSavings.label]}),o.frequencyType!==S.LUMP_SUM&&e.jsxs(e.Fragment,{children:[e.jsxs("td",{children:[n.annualSavings.prefix,n.annualSavings.label]}),e.jsxs("td",{children:[n.accumulatedAnnualSavings.prefix,n.accumulatedAnnualSavings.label]})]}),e.jsxs("td",{children:[n.accumulatedInterest.prefix,n.accumulatedInterest.label]}),e.jsxs("td",{children:[n.interestGained.prefix,n.interestGained.label]}),e.jsxs("td",{children:[n.totalSavings.prefix,n.totalSavings.label]})]},crypto.randomUUID()))})]})})})]})})}),e.jsx("div",{className:"savings-calculator-result-content-download-pdf",children:e.jsxs(D,{style:"link",className:"py-0",onClick:m,children:[e.jsx(D.Icon,{iconName:"download"}),e.jsx(D.Text,{children:c})]})})]})},Ue=({iconUrl:t,message:a})=>e.jsxs("div",{className:"savings-calculator-result-overlay",children:[e.jsx("img",{src:t}),e.jsx("p",{className:"text-color-primary font-body fw-bold text-center mb-0",children:a})]}),Oe=({resultGraphHeader:t,resultAccordionLabel:a,savePdfLabel:l,resultInstruction:c,resultInstructionIconUrl:o})=>{const{savingsCalculatorConfig:m,savingsGoalCalculator:s,regularSavingsCalculator:u}=oe(),i=m.mode===j.SAVINGS_GOAL&&s.breakdownTable.items.length>0,g=m.mode===j.REGULAR_SAVINGS&&u.breakdownTable.items.length>0,f=!(i||g),n=m.mode===j.SAVINGS_GOAL?s.breakdownTable:u.breakdownTable,d=m.mode===j.SAVINGS_GOAL?s.savingsTargetAmount:u.savingsTargetAmount,p=m.mode===j.SAVINGS_GOAL?s.savingsAmountPerDeposit:u.savingsAmountPerDeposit,A=m.mode===j.SAVINGS_GOAL?s.savingsPeriodInYears:u.savingsPeriodInYears,x=m.mode===j.SAVINGS_GOAL?s.savingsFrequencyType:u.savingsFrequencyType,b=v.useRef(null);return v.useEffect(()=>{var r;f||(r=b.current)==null||r.scrollIntoView({behavior:"smooth",block:"center"})},[s.breakdownTable,u.breakdownTable]),e.jsxs("div",{ref:b,className:"savings-calculator-result",children:[f&&e.jsx(Ue,{iconUrl:o,message:c}),e.jsx(Ge,{calculatorMode:m.mode,resultGraphHeader:t,resultAccordionLabel:a,savePdfLabel:l,savingsDetail:{amountPerDeposit:p,frequencyType:x,periodInYears:A,targetAmount:d,breakdownTable:n}})]})},Fe=({optionOneLabel:t,optionOneIconUrl:a,optionTwoLabel:l,optionTwoIconUrl:c,assumptionLabel:o,assumptionHeader:m,assumptionDetail
13s:s,resultInstruction:u,resultInstructionIconUrl:i,resultGraphHeader:g,resultAccordionLabel:f,savePdfLabel:n})=>{const d=Ne(),p=Ce(),A=Ie();return e.jsx(le.Provider,{value:{savingsCalculatorConfig:d,savingsGoalCalculator:p,regularSavingsCalculator:A},children:e.jsxs("div",{className:"savings-calculator",children:[e.jsx(Pe,{optionOneLabel:t,optionOneIconUrl:a,optionTwoLabel:l,optionTwoIconUrl:c,assumptionLabel:o,assumptionHeader:m,assumptionDetails:s}),e.jsx(Oe,{resultGraphHeader:g,resultAccordionLabel:f,savePdfLabel:n,resultInstruction:u,resultInstructionIconUrl:i})]})})},Ve=()=>{ue({id:"#savings-calculator",Component:Fe})};document.addEventListener("DOMContentLoaded",()=>Ve());

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.