https://my.bnc.bank/en/js/bannoweb-account-fscc-payments-CmW_O5Ev.js

1import{r as e,t}from"./standalone-app-Bj-IdwrG.js";import{E as n,_ as r,x as i}from"./institution-DyFDvNu6.js";import{t as a}from"./display-strings-MZHh2uw2.js";import{t as o}from"./paths-BjKNBopk.js";import{t as s}from"./page-B8YwBOEr.js";import{t as c}from"./date-URgChy6n.js";import{X as l,_r as u,o as d,vr as f}from"./main-5Sl8yySz.js";import"./jha-progress-CjUOO3no.js";import"./jha-card-DC-UH8vN.js";import"./jha-card-header-D2XWRnD9.js";import"./jha-button-Dyau4S4K.js";import"./jha-form-radio-button-5hrlF8c6.js";import{t as p}from"./language-utils-DMDnwVwz.js";import"./bannoweb-confirmation-DnbjNe7C.js";import{i as m,n as h,t as g}from"./banno-styles-B3iGgKv1.js";import"./jha-list-UCQUTbOQ.js";import"./jha-slider-pane-CG5LkspN.js";import"./bannoweb-page-container-G_uPsQAr.js";import{t as _}from"./format-currency-DWww8Snc.js";import"./bannoweb-currency-B8mbcVJL.js";import{t as v}from"./observable-models-lit-Conecq5s.js";import"./jha-form-currency-input-CKJz-yxs.js";import{t as y}from"./async-dialog-Bj6--dJf.js";import"./bannoweb-account-search-bar--S425cBf.js";var b={FORM:`form`,ACCOUNTS_LIST:`accounts-list`,SUCCESS:`success`},x={SINGLE:`make-payment`,AUTOPAY:`autopay`},S={STATEMENT_BALANCE:`statement-balance`,CURRENT_BALANCE:`current-balance`,MINIMUM:`minimum-payment`,OTHER:`specific-amount`},C={ENROLL_AUTOPAY:`By clicking “Enroll” you authorize us to debit your account the indicated amount monthly, on your credit card due date. You can edit or cancel autopay at least 1 business day before your next payment.`,MANAGE_AUTOPAY:`Your next automatic payment will be made on your due date.`,EXTERNAL_PAYMENT:`Payments submitted after the cut off time will begin processing the next business day and may take up to 72 hours to process.
2
3By clicking “Submit”, you authorize us to debit the indicated amount from the account selected.`,NO_BALANCE:`Your current balance is $0.00 so no payments can be made at this time.`,SINGLE_PAYMENT:`Payments submitted after the cut-off time will be processed the next business day.
4
5By clicking “Submit”, you authorize us to debit the indicated amount from the account selected.`},w={ZERO:`Amount must be greater than $0.00.`,ABOVE_BALANCE:`Amount must not be greater than current balance.`,ABOVE_FROM_ACCOUNT_BALANCE:`That's more than you have available.`},T=f(v(p(r)),`fadeinup`);window.BannowebAccountFsccPaymentsElement=class extends T{static get is(){return`bannoweb-account-fscc-payments`}static get properties(){return{accountid:{attribute:`accountid`,type:String},accounts:{type:Object},transferAccounts:{type:Object},account:{type:Object},selectedFromAccountId:{type:String},fsccPaymentsController:{type:Object},fetchController:{type:Object},mode:{attribute:`mode`,type:String},focusedPane:{type:String},queryAccounts:{type:Array},queryTransferAccounts:{type:Array},institution:{type:Object},showSearch:{type:Boolean},loading:{type:Boolean},paymentType:{type:String},amount:{type:String},isSubmitting:{type:Boolean},confirmation:{type:Object},loadingFailed:{type:Boolean}}}constructor(){super(),t(()=>import(`./bannoweb-accounts-card-list-item-Bz1P_ZQE.js`),[]),t(()=>import(`./jha-icon-chevron-back-qAPV11jO.js`),[]),t(()=>import(`./jha-icon-search-CqPVH16d.js`),[]),t(()=>import(`./jha-icon-wallet-0h2NszeM.js`),[]),t(()=>import(`./jha-icon-chevron-right-CycLQfHr.js`).then(e=>e.t),[]),t(()=>import(`./jha-icon-information-CdfV0b31.js`),[]),t(()=>import(`./jha-icon-automatic-payment-B2sn_vHB.js`),[]),this.focusedPane=b.FORM,this.accounts=d.store.accounts,this.transferAccounts=d.store.transferAccounts,this.queryAccounts=[],this.queryTransferAccounts=[],this.account=null,this.institution=d.store.institution,this.fsccPaymentsController=d.fsccPaymentsController,this.fetchController=d.fetchController,this.accountid,this.mode,this.showSearch=!1,this.loading=!0,this.selectedFromAccountId=null,this.paymentType=null,this.amount=``,this.isSubmitting=!1,this.confirmation,this.loadingFailed=!1}connectedCallback(){super.connectedCallback(),this.setAccount_(this.accountid)}async ensureFSCCDetailsLoaded(t){this.focusedPane=b.FORM,this.loading=!0,this.loadingFailed=!1;

5try{await this.fsccPaymentsController.ensureFSCCDetailsLoaded(t),this.setAutoPay()}catch(t){e.console.log(t),this.loadingFailed=!0}finally{this.loading=!1}}updated(e){e.has(`mode`)&&e.get(`mode`)?this.initiateAutopay():e.has(`accountid`)&&this.ensureFSCCDetailsLoaded(this.accountid)}initiateAutopay(){this.resetData(),this.ensureFSCCDetailsLoaded(this.accountid)}setAccount_(e){if(!this.accounts||!e){history.back();return}this.findItemInCollection(this.accounts,t=>t.id===e,e=>{if(!e){history.back();return}this.account=e})}setAutoPay(){if(!this.managingAutopay)return;let{amount:e,autopayType:t,fromAccount:n}=(this.fsccDetails||{}).autopay;this.selectedFromAccountId=(n||{}).accountId,this.paymentType=t,this.paymentType===S.OTHER&&window.requestAnimationFrame(()=>{this.amount=e,this.otherAmountInput&&(this.otherAmountInput.amount=e)})}resetData(){this.loading=!0,this.fsccPaymentsController.clearPaymentDetails(this.accountid),this.paymentType=null,this.amount=``}get fromAccountBalance(){if(this.isExternal||!this.fromAccount)return null;let e=this.institution.id===(this.fromAccount.institution||{}).id,{accountType:t,balance:n,availableBalance:r}=this.fromAccount;return l.getBalance(e,this.institution.balanceDisplaySettings,t,n,r)}async routeEnter(e,t,n,r){return s.setTitleAndTrack(this.isSinglePayment?`Make a payment`:`Autopay`,u.getRouteUrlWithoutParams(r),n),super.routeEnter(e,t,n,r)}async routeExit(e,t,n,r){return this.resetData(),super.routeExit(e,t,n,r)}resolveAccountById_(e){if(e)return[...this.accounts.items,...this.transferAccounts.items].find(t=>t.id===e)}get fromAccount(){return[...this.availableAccounts,...this.availableTransferAccounts].find(e=>e.id===this.selectedFromAccountId)}set fromAccount(e){this.selectedFromAccountId=e.id}get isExternal(){return this.fromAccount&&!!this.fromAccount.institutionName}get confirmedFromAccount(){return this.resolveAccountById_((this.confirmation||{}).from)||this.resolveAccountById_(this.selectedFromAccountId)||null}get isSinglePayment(){return this.mode===x.SINGLE}get hasAutopay(){return!!(this.fsccDetails||{}).autopay}get isEnrolling(){return!this.isSinglePayment&&!this.hasAutopay}get managingAutopay(){return!this.isSinglePayment&&this.hasAutopay}get modeHeader(){return this.isSinglePayment?`Make a payment`:this.hasAutopay?`Manage autopay`:`Enroll in autopay`}get header(){return this.focusedPane===b.ACCOUNTS_LIST?`Pay from`:this.modeHeader}get fsccDetails(){return(this.account||{}).fsccDetails}get availableAccounts(){let e=(this.fsccDetails||{}).fromInternalAccounts||[];return this.accounts.items.filter(t=>e.includes(t.id)&&t.showBalanceAndActivity)}get availableTransferAccounts(){let e=(this.fsccDetails||{}).fromExternalAccounts||[];return this.transferAccounts.items.filter(t=>e.includes(t.id))}get hasAccounts(){return this.availableAccounts.length||this.availableTransferAccounts.length}get otherAmountInput(){return this.shadowRoot?.querySelector(`jha-form-currency-input`)}get searchComponent(){return this.shadowRoot?.querySelector(`bannoweb-account-search-bar`)}get paymentOptions(){if(!this.fsccDetails)return[];let{minimumPayment:e,lastStatementBalance:t,lastStatementDate:n,currentBalance:r}=this.fsccDetails,i=n&&c.UTCDateTimeAsLocalDate(n),a=[{id:S.STATEMENT_BALANCE,label:`Statement balance`,dateInfo:i&&`As of ${c.getShortMonthDate(i)}`,amount:t,disabled:parseFloat(t)===0||parseFloat(r)===0},{id:S.CURRENT_BALANCE,label:`Current balance`,amount:r,disabled:parseFloat(r)===0},{id:S.MINIMUM,label:`Minimum amount due`,amount:e,disabled:parseFloat(e)===0},{id:S.OTHER,label:`Other amount`,disabled:parseFloat(r)===0}];return this.isSinglePayment?a:a.filter(e=>e.id!==S.CURRENT_BALANCE).map(e=>({id:e.id,label:e.label}))}get amountErrors(){if(this.paymentType!==S.OTHER||!this.fromAccount||!this.amount)return[];let e=[],t=parseFloat(this.amount),n=parseFloat(this.fsccDetails.currentBalance);return t===0&&e.push(w.ZERO),this.isSinglePayment&&t>n&&e.push(w.ABOVE_BALANCE),this.amountExceedsFromAccountBalance(t)&&e.push(w.ABOVE_FROM_ACCOUNT_BALANCE),e}amountExceedsFromAccountBalance(e){return this.isSinglePayment&&!this.isExternal&&e>this.fromAccountBalance}get submitDisabled(){return!this.accountid||!this.fromAccount||this.managingAutopay&&!this.autoPayChanged?!0:this.isSinglePayment||this.paymentType===S.OTHER?!this.amount||!parseFloat(this.amount)||this.amountErrors.length>0||this.amountExceedsFromAccountBalance(this.amount):!this.paymentType}get autoPayChanged(){if(!this.managingAutopay)return!1;let{amount:e,autopayType:t,fromAccount:n}

5=(this.fsccDetails||{}).autopay;return parseFloat(e)!==parseFloat(this.amount||0)||this.paymentType!==t||this.selectedFromAccountId!==(n||{}).accountId}get helperText(){if(this.isEnrolling)return C.ENROLL_AUTOPAY;if(this.managingAutopay)return C.MANAGE_AUTOPAY;if(this.isExternal)return C.EXTERNAL_PAYMENT;if(!this.fsccDetails)return``;let{minimumPayment:e,lastStatementBalance:t,currentBalance:n}=this.account.fsccDetails;return parseFloat(e)===0&&parseFloat(t)===0&&parseFloat(n)===0?C.NO_BALANCE:C.SINGLE_PAYMENT}get autopayConfirmationLabel(){let e=(this.paymentOptions.find(e=>e.id===this.paymentType)||{}).label||``;return this.paymentType===S.STATEMENT_BALANCE&&(e=`Monthly statement balance`),e}onSelectAccount(e){this.fromAccount=e,this.focusedPane=b.FORM}onClickBack(e){if(this.focusedPane===b.FORM){history.back();return}this.focusedPane=b.FORM}onQueryChange(e){if(!(e||{}).detail)return;let{accounts:t,transferAccounts:n}=e.detail;this.queryAccounts=t,this.queryTransferAccounts=n}async onAddExternalAccount(){let t={title:`External accounts require setup`,description:`Adding an external account may take up to 5 business days.
6        If your payment is due within that time, you will need to make a payment with a different account.`,confirmButtonText:`Add external account`,cancelButtonText:this.hasAccounts?`Select a different account`:`Cancel`,showWarningIcon:!1,alternativeIcon:`alarm-clock`};try{await y.showDialog(t),window.requestAnimationFrame(()=>{u.go(o.BANNOWEB_ADD_ACCOUNT)})}catch(t){e.console.log(t)}}async onTurnOffAutopay(){let t={title:`Turn off autopay?`,description:`Turning off autopay will cancel your next payment.`,confirmButtonText:`Turn off autopay`,cancelButtonText:`Cancel`,preventClosing:!0};try{await y.showDialog(t)}catch(t){e.console.log(t);return}try{await this.fsccPaymentsController.autoPayDelete(this.accountid),y.closeDialog(),this.performFetch(),u.go(o.BANNOWEB_ACCOUNT_DETAIL,{accountId:this.accountid})}catch{this.displayErrorDialog()}}onOptionSelected(e){e.disabled||(this.paymentType=e.id,e.id===S.OTHER?(this.managingAutopay&&!this.otherAmountInput.amount&&parseFloat(this.fsccDetails.autopay.amount)!==0&&(this.otherAmountInput.amount=this.fsccDetails.autopay.amount),this.amount=this.otherAmountInput.amount,this.otherAmountInput.focus()):(this.otherAmountInput.amount=``,this.amount=e.amount||``))}sortSelectedFirst(e,t){return Number(t.id===this.selectedFromAccountId)-Number(e.id===this.selectedFromAccountId)}async submitPayment(){try{this.isSubmitting=!0,this.isSinglePayment?await this.oneTimePayment():await this.submitAutopay(),this.focusedPane=b.SUCCESS,this.performFetch()}catch(t){e.console.log(t);let n=t.response?.reason===`existing-autopay`?`Oops! Autopay is already setup.`:void 0,r=t.response?.reason===`existing-autopay`?`Your financial institution will need to remove the existing autopay before you can make a payment from an external account or setup autopay.`:void 0;this.displayErrorDialog(n,r)}finally{this.isSubmitting=!1}}async oneTimePayment(){let e={fromAccountId:this.selectedFromAccountId,amount:parseFloat(this.amount.replace(/,/g,``))};this.confirmation=await this.fsccPaymentsController.oneTimePayment(this.accountid,e,this.isExternal),this.setAccount_(this.confirmation.to)}async submitAutopay(){let e={fromAccountId:this.selectedFromAccountId,isFromAccountExternal:this.isExternal,autopayType:this.paymentType};if(this.paymentType===S.OTHER&&(e.amount=parseFloat(this.amount.replace(/,/g,``))),this.isEnrolling)try{await this.fsccPaymentsController.autoPayEnrollment(this.accountid,e)}catch(e){throw e}else await this.fsccPaymentsController.autoPayEdit(this.accountid,e)}performFetch(){this.fetchController.sync()}async displayErrorDialog(e=a.OOPS_OUR_BAD_HEADER,t=`Please try again.`){try{await y.showDialog({title:e,description:t,confirmButtonText:`Ok`,cancelButtonText:``})}catch{}}onToggleSearch(){this.showSearch=!this.showSearch,this.searchComponent&&!this.showSearch&&this.searchComponent.resetSearch()}formatMaskedAccountNumber(e){return e?`(x${e.slice(-4)})`:``}formatDate(e){return c.getMonthDate(c.UTCDateTimeAsLocalDate(e))}static get styles(){return[m,g,h,n`:host{--jha-content-inset:24px;flex:1 0 auto;display:block}jha-card{box-sizing:border-box;--jha-card-header-height:60px;width:100%;min-width:300px;max-width:600px}section{border-bottom:1px solid var(--jha-border-color);margin-bottom:16px;margin-left:24px}section.borderless{border-bottom:none}

6jha-list-item.borderless{--jha-list-item-border-display:none}p.border{border-bottom:1px solid var(--divider-default-color);margin-bottom:0;padding-bottom:8px}jha-list#payment-options jha-list-item{--jha-list-item-border-display:none;margin-right:var(--jha-content-inset)}jha-list-item{box-sizing:border-box;--jha-list-item-horizontal-spacing:0;justify-content:space-between;align-items:center;min-height:56px;display:flex}.accounts-pane{border:none}.accounts-pane jha-list-item[last]{--jha-list-item-border-display:none}jha-list-item>button.reset{width:100%;color:var(--body-text-theme-color);align-items:center;font-size:16px;display:flex}.link{color:var(--body-text-theme-color)!important}jha-list-item>button[disabled],jha-list-item>button[disabled] .link{cursor:default;color:var(--link-button-text-disabled-color)!important}button.select-account{border-bottom:1px solid var(--divider-default-color);justify-content:space-between;align-items:center;display:flex}button.select-account>h4{flex:50%;width:auto}button.select-account>div{padding-right:var(--jha-content-inset);flex:50%;justify-content:flex-end;align-items:center;display:flex}button.turn-off-autopay{align-items:center;display:flex;justify-content:flex-end!important}button.turn-off-autopay>div{padding-right:var(--jha-content-inset);align-items:center;display:flex}jha-icon-chevron-right{fill:var(--body-text-secondary-color);flex-shrink:0;margin-left:8px}jha-icon-warning{fill:var(--jha-color-warning)}h4{width:100%;color:var(--body-text-primary-color);margin:12px 0;font-size:16px;font-weight:500}label{margin-right:32px;font-size:16px}bannoweb-accounts-card-list-item{--bannoweb-account-status-chip-display:none;--account-card-loader-color:var(--body-text-theme-color);--jha-accounts-card-title-color:var(--body-text-theme-color)}#search{opacity:0;visibility:hidden;max-height:0;padding:0 24px;transition-property:max-height,opacity,padding,visibility;transition-duration:.2s;position:relative}#search[display]{opacity:1;visibility:visible;height:auto;max-height:150px;padding:16px 24px 0}.col{background-color:var(--secondary-content-background-color);margin:0 -24px;padding:8px 24px;font-size:12px}.external-account{padding:16px 0}.from-account{text-align:right;flex:1;width:0;padding:16px 0}.account-name{font-size:var(--jha-accounts-card-title-size,16px);color:var(--jha-accounts-card-title-color,var(--body-text-primary-color));font-weight:var(--jha-accounts-card-title-weight,500);white-space:nowrap;text-overflow:ellipsis;outline:0;overflow:hidden}.account-details{font-size:var(--jha-accounts-card-fi-info-size,12px);color:var(--jha-accounts-card-fi-info-color,var(--body-text-secondary-color));clear:both;margin-top:var(--jha-accounts-card-balance-title-top-margin,3px);outline:0;font-weight:400;line-height:14px}.no-content{text-align:center;color:var(--jha-text-neutral);flex-direction:column;justify-content:center;align-items:center;height:220px;display:flex}.no-content p{margin-top:4px}.no-content jha-icon-wallet,.no-content jha-icon-search{fill:var(--body-text-secondary-color)}.progress-container{justify-content:center;align-items:center;height:220px;display:flex}jha-form-radio-button{--jha-form-radio-button-label-flex:1;width:100%;padding:0}.radio-button-contents{text-align:right;justify-content:space-between;align-items:flex-start;display:flex;position:relative}jha-list-item h2,jha-list-item .item-label{text-align:left;flex-grow:1}.sub-title{color:var(--jha-text-light);font-size:12px}.progress-spinner-container{align-items:center;height:200px;display:flex}.amount-input{flex-direction:column;justify-content:flex-end;display:flex}jha-form-currency-input[disabled]{--jha-form-floating-group-filled-border-color:var(--divider-alternative-color);--jha-text-base:var(--body-text-secondary-color)}.alert{color:var(--body-text-alert-color);margin-top:-7px;margin-right:var(--jha-content-inset);text-align:right;margin-bottom:12px;font-size:12px}.alert p{margin:4px 0}span.alert{margin:4px 0 0;display:block}@media (width<=470px){:host{z-index:99}jha-card{--jha-card-header-height:62px;width:auto;min-height:calc(100vh - 56px);margin:var(--jha-card-header-height,56px) 0 0;border-radius:0;flex-direction:column;display:flex;position:absolute;top:0;left:0;right:0;animation:none!important}jha-card-header{z-index:100;background:var(--primary-content-background-color);position:fixed;top:0;left:0;right:0}#search{margin-top:16px;margin-right:16px}}.text-center{text-align:center;margin:24px auto 12px}.helper-text{color:var(--jha-text-light);text-align:center;margin:16px 24px 24px;font-size:12px}

6.top-section{border-top:1px dashed var(--divider-default-color);text-align:left;margin-top:24px;padding:16px 0}.amount-label{color:var(--body-text-secondary-color);align-items:center;margin-top:8px;font-size:14px;display:flex}.top-section>bannoweb-currency{margin:8px 0 12px;font-size:28px;font-weight:300}a.reset{text-decoration:none!important}.autopay-container{border-top:1px dashed var(--divider-default-color);width:320px;margin:0 auto}.autopay{background-color:var(--secondary-content-background-color);border-radius:var(--jha-card-border-radius,3px);color:var(--jha-text-base);justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.autopay h4{margin:0}.autopay-text{flex:2}jha-icon-automatic-payment{width:36px;height:36px;fill:var(--jha-text-theme);margin-right:8px}.confirmation-details jha-list-item{min-height:0;padding-bottom:16px}.confirmation-details *{text-align:left}.confirmation-details .label{color:var(--body-text-secondary-color)}h3{margin-top:0;font-size:24px;font-weight:200}jha-icon-chevron-right{fill:var(--account-card-primary-text-color)}footer{border-top:1px solid var(--jha-border-color);text-align:center;justify-content:center;margin:24px;padding-top:24px;display:flex}footer jha-link-button{margin-left:8px}bannoweb-confirmation{max-width:320px;margin:0 auto;padding-left:0;padding-right:0}.success-header{font-size:24px;font-weight:400}#from-account-button{min-height:64px}jha-icon-search[active]{fill:var(--inline-icon-color)}.label{text-align:left;width:100px}bannoweb-confirmation jha-list-item{justify-content:normal}.note{border-top:1px dashed var(--divider-default-color);width:320px;margin:0 auto}.note.grey{background-color:var(--secondary-content-background-color);border-top:0;width:auto;margin:0 24px;padding:8px}.note div{align-items:center;margin-top:24px;display:flex}.note.grey div{margin:0}.note p{color:var(--body-text-secondary-color);flex:1;margin:0 0 0 8px;font-size:14px}

6jha-icon-information{fill:var(--body-text-secondary-color);width:18px;height:18px}jha-list-item.edit-autopay{min-height:0;padding-bottom:0}h5{color:var(--body-text-secondary-color);margin:0 0 6px;font-size:14px}.unknown-account .alert{margin:8px 0 0}.external-accounts-note{color:var(--body-text-secondary-color);border-bottom:1px solid var(--jha-border-color);padding-bottom:12px;padding-right:var(--jha-content-inset);margin-top:12px;font-size:12px;display:flex}.external-accounts-note a{flex-shrink:0;margin-left:8px;font-size:14px}.external-accounts-note jha-icon-chevron-right{fill:var(--body-text-theme-color);vertical-align:middle;margin:0;display:inline-block}.external-account-button{font-size:14px!important}`]}renderFromAccountLabel(){if(!this.hasAccounts)return i`<span class="link">${`Select`}</span>`;if(this.managingAutopay&&!this.selectedFromAccountId)return i`<div class="from-account unknown-account"> <div class="account-name link" title="unknown account"> ${`Unknown`} </div> <div class="account-details">${`External account`}</div> <div class="alert">${`Select another account to edit autopay.`}</div> </div>`;if(this.selectedFromAccountId||(this.fromAccount=this.availableAccounts[0]||this.availableTransferAccounts[0]),this.isExternal)return i`<div class="from-account"> <div class="account-name link" title="${this.fromAccount.name}"> ${this.fromAccount.name} ${this.formatMaskedAccountNumber(this.fromAccount.maskedAccountNumber)} </div> <div class="account-details">${this.fromAccount.institutionName}</div> </div>`;let{name:e,numbers:t}=this.fromAccount||{};return i`<div class="from-account"> <div class="account-name link" title="${e}"> ${e} (${t}) </div> <div class="account-details"> <bannoweb-currency .amount="${this.fromAccountBalance}"></bannoweb-currency> </div> </div>`}renderAmountError(){return this.amountErrors.length?i`<div class="alert" id="other-amount-errors"> ${this.amountErrors.map(e=>i`<p>${e}</p>`)} </div>`:``}renderPaymentTypeOptions(){return this.fsccDetails?i`<section> <h4>${`Amount`}</h4> <jha-list no-border id="payment-options"> ${this.paymentOptions.map(e=>i`<jha-list-item no-border> <jha-form-radio-button name="${e.label}" .value="${e.id}" .disabled="${e.disabled}" ?checked="${this.paymentType===e.id}" @click="${t=>this.onOptionSelected(e)}"> <div class="radio-button-contents"> <div class="item-label"> <div>${e.label}</div> ${e.dateInfo?i`<div class="sub-title">${e.dateInfo}</div>`:``} </div> ${e.amount?i`<div> ${_(e.amount)} ${this.amountExceedsFromAccountBalance(e.amount)?i`<span class="alert">${w.ABOVE_FROM_ACCOUNT_BALANCE}</span>`:``} </div>`:``} </div> </jha-form-radio-button>

6 ${e.id===S.OTHER?i`<div class="amount-input"> <jha-form-currency-input id="otherAmount" small filled use-commas no-label placeholder="" type="number" @click="${t=>this.onOptionSelected(e)}" @input="${t=>this.onOptionSelected(e)}" ?disabled="${this.isSinglePayment&&parseFloat(this.fsccDetails.currentBalance)===0}" min="0"></jha-form-currency-input> </div>`:``} </jha-list-item>`)} ${this.renderAmountError()} </jha-list> </section>`:``}renderExternalPaymentInProgressMessage(){return!this.isEnrolling&&(!this.fsccDetails||!this.fsccDetails.externalPaymentInProgress)?``:i`<div class="note grey"> <div> <jha-icon-information></jha-icon-information> <p>${`Enrolling in autopay before 6 PM CT will overwrite your last payment made today from an external account.`}</p> </div> </div>`}renderForm(){let e=`Submit`;return this.isEnrolling?e=`Enroll`:this.managingAutopay&&(e=`Save`),i`<form @submit="${()=>this.submitPayment()}"> <section class="borderless"> <jha-list> ${this.isEnrolling?i`<jha-list-item> <p>${`Make your payments on time, every time with autopay. Select your payment options below and we’ll automatically pay the selected amount every month on your due date.`}</p> </jha-list-item>`:``} ${this.managingAutopay?i`<jha-list-item class="borderless"> <h4 for="turn-off-autopay">${`Enrolled in autopay`}</h4> <button type="button" id="turn-off-autopay" class="turn-off-autopay reset" @click="${()=>this.onTurnOffAutopay()}"> <div>${`Turn off`}</div> </button> </jha-list-item> <p class="sub-title border">${`Edit payment options`}</p>`:``} <jha-list-item> <button type="button" id="from-account-button" class="select-account reset" @click="${()=>this.focusedPane=b.ACCOUNTS_LIST}"> <h4 for="from-account-button">${`From`}</h4> <div> ${this.renderFromAccountLabel()} <jha-icon-chevron-right aria-label="${`Choose from account`}"></jha-icon-chevron-right> </div> </button> </jha-list-item> </jha-list> </section> ${this.renderPaymentTypeOptions()} ${this.renderExternalPaymentInProgressMessage()} <div class="text-center"> <jha-button wide="" type="submit" .disabled="${this.submitDisabled}" .isLoading="${this.isSubmitting}"> ${e} </jha-button> </div> <div class="helper-text">${this.helperText}</div> </form>`}renderSinglePaymentSuccessData(){return this.isSinglePayment&&this.confirmation?i`<jha-list-item> <div class="label">${`Payment date`}</div> ${this.formatDate(this.confirmation.effectiveDate)} </jha-list-item> <jha-list-item> <div class="label">${`Confirmation #`}</div> ${this.confirmation.confirmationNumber} </jha-list-item>`:``}renderAutopaySuccessData(){return this.isSinglePayment?``:i`<jha-list-item> <div class="label">${`Starts`}</div> ${`Next due date`} </jha-list-item>`}renderConfirmationNote(){return this.isEnrolling?i`<div class="note"> <div> <jha-icon-information></jha-icon-information> <p>${`You can edit or turn off autopay by managing autopay from your account detail page.
7
8For future payments: If you chose “Statement Balance” or “Minimum Amount Due”, your payment amount will be shown on your credit card statement. If you chose “Other Amount”, and your balance is less than that amount, your account balance will be paid.`}</p> </div> </div>`:``}renderConfirmation(){let e;e=this.isSinglePayment?`Payment submitted`:this.isEnrolling?`Enrolled in autopay`:`Autopay updated`;let t=this.confirmedFromAccount||{},n=!!t.institutionName,r=t.numbers||t.maskedAccountNumber||``;return i`<bannoweb-confirmation> <h1 slot="header" class="success-header"> ${e} </h1> <div slot="description" class="summary"> <div class="top-section"> <div class="amount-label">${`Amount`}</div> ${this.amount?i`<bannoweb-currency .amount="${this.amount}"></bannoweb-currency>`:i`<h3>${this.autopayConfirmationLabel}</h3>`} </div> <jha-list borderless class="confirmation-details"> <jha-list-item> <div class="label">${`Pay`}</div> ${(this.account||{}).name} ${this.formatMaskedAccountNumber((this.account||{}).numbers)} </jha-list-item> <jha-list-item> <div class="label">${`From`}</div> <div> ${t.name} ${this.formatMaskedAccountNumber(r)} ${n?i`<div class="sub-title">${t.institutionName}</div>`:``} </div> </jha-list-item> ${this.renderSinglePaymentSuccessData()} ${this.renderAutopaySuccessData()} </jha-list> </div> </bannoweb-confirmation>

8 ${this.isSinglePayment&&this.fsccDetails&&!this.fsccDetails.autopay?i`<div class="autopay-container"> <a href="/account/${(this.account||{}).id}/payment/autopay" class="reset"> <div class="autopay"> <jha-icon-automatic-payment></jha-icon-automatic-payment> <div class="autopay-text"> <h4>${`Never miss a payment!`}</h4> <span>${`Enroll in autopay.`}</span> </div> <jha-icon-chevron-right aria-label="${`Autopay`}"></jha-icon-chevron-right> </div> </a> </div>`:``} ${this.renderConfirmationNote()} <footer> ${this.isSinglePayment?``:i`<jha-button type="button" outline @click="${e=>this.initiateAutopay()}"> ${`Edit`} </jha-button>`} <jha-link-button wide .href="${`/account/${(this.account||{}).id}`}"> ${`Done`} </jha-link-button> </footer>`}renderAddExternalAccountButton(){let{twoFAEnabled:e,externalTransferInbound:t,externalTransferOutbound:n}=this.institution.abilities;return e&&(t||n)?i`<button class="reset anchor external-account-button" type="button" @click="${()=>this.onAddExternalAccount()}"> <span aria-hidden="true">+</span> ${`Add external account`} </button>`:``}renderExternalAccountsHelpMessage(){if(!this.queryTransferAccounts.length)return``;if(this.isSinglePayment&&this.hasAutopay)return i`<div class="external-accounts-note"> <div>${`To make a payment with an external account, you first need to turn off autopay.`}</div> <a href="/account/${this.account.id}/payment/autopay" class="reset"> <span>${`Manage autopay`}</span> <jha-icon-chevron-right aria-label="${`Manage autopay`}"></jha-icon-chevron-right> </a> </div>`;if(this.isSinglePayment&&this.fsccDetails&&this.fsccDetails.externalPaymentInProgress)return i`<div class="external-accounts-note">${`You already have a payment processing from an external account today. If you make an additional payment from an external account before the cut-off time, your first payment will be overwritten and will not be processed.`}</div>`}renderAccountsList(){return!this.queryAccounts.length&&!this.queryTransferAccounts.length?i`<div class="no-content"> ${this.showSearch?i`<jha-icon-search></jha-icon-search>`:i`<jha-icon-wallet></jha-icon-wallet>`} ${this.showSearch?i`<p>No accounts found.</p>`:i`<p>No accounts to show.</p>`} ${this.hasAccounts?``:this.renderAddExternalAccountButton()} </div>`:i`<jha-list> ${this.queryAccounts.sort(this.sortSelectedFirst.bind(this)).map(e=>i`<jha-list-item no-padding> <button class="reset" type="button" @click="${()=>this.onSelectAccount(e)}"> <bannoweb-accounts-card-list-item .account="${e}" .accountsCollection="${this.accounts}" .balanceDisplaySettings="${this.institution.balanceDisplaySettings}" .primaryInstitutionId="${this.institution.id}"></bannoweb-accounts-card-list-item> </button> </jha-list-item>`)} ${this.queryTransferAccounts.length?i`<div class="col"><span>${`External accounts`}</span></div>`:``} ${this.renderExternalAccountsHelpMessage()} ${this.queryTransferAccounts.sort(this.sortSelectedFirst.bind(this)).map(e=>i`<jha-list-item no-padding> <button class="reset" type="button" @click="${()=>this.onSelectAccount(e)}" ?disabled="${this.isSinglePayment&&this.hasAutopay}"> <div class="external-account"> <div class="account-name link" title="${e.name}"> ${e.name} </div> <div class="account-details">${e.maskedAccountNumber}, ${e.institutionName}</div> </div> </button> </jha-list-item>`)} ${this.showSearch?``:i`<jha-list-item>${this.renderAddExternalAccountButton()}</jha-list-item>`} </jha-list>`}renderAccountsPane(){return i`<section class="accounts-pane">${this.renderAccountsList()}</section>`}renderCardContent(){return this.loading?i`<div class="progress-container"> <jha-progress></jha-progress> </div>`:this.loadingFailed?i`<div class="no-content"> <jha-icon-warning></jha-icon-warning> <p>${a.OOPS_OUR_BAD_HEADER}</p> <button type="button" class="reset anchor" @click="${()=>this.ensureFSCCDetailsLoaded(this.accountid)}"> ${`Retry`} </button> </div>`:i`${this.focusedPane===b.SUCCESS?``:i`<jha-card-header slot="header" center-header> <jha-button id="backBtn" sync icon @click="${this.onClickBack}" slot="header-left" type="button"> <jha-icon-chevron-back aria-label="${`Back`}"></jha-icon-chevron-back> </jha-button>

8 <h1>${this.header}</h1> ${this.focusedPane===b.FORM&&this.account?i`<h2>${this.account.name} ${this.formatMaskedAccountNumber(this.account.numbers)}</h2>`:``} ${this.focusedPane===b.ACCOUNTS_LIST&&this.hasAccounts?i`<jha-button id="openSearch" sync icon @click="${this.onToggleSearch}" slot="header-right" type="button"> <jha-icon-search aria-label="${`Search accounts`}" ?active="${this.showSearch}"></jha-icon-search> </jha-button>`:``} </jha-card-header>`} <div id="search" ?display="${this.showSearch&&this.focusedPane===`accounts-list`}"> <bannoweb-account-search-bar .accounts="${this.availableAccounts}" .transferAccounts="${this.availableTransferAccounts}" .displayedFilters="${[window.BannowebAccountSearchBar.filters.INSTITUTION]}" @query-update="${this.onQueryChange}"></bannoweb-account-search-bar> </div> <jha-slider> <jha-slider-content focused-pane="${this.focusedPane}"> <jha-slider-pane one focus form> ${this.renderForm()} </jha-slider-pane> <jha-slider-pane accounts-list>${this.renderAccountsPane()}</jha-slider-pane> <jha-slider-pane success>${this.renderConfirmation()}</jha-slider-pane> </jha-slider-content> </jha-slider>`}render(){return i`<bannoweb-page-container> <jha-card class="fadeinup">${this.renderCardContent()}</jha-card> </bannoweb-page-container>`}},window.BannowebAccountFsccPaymentsElement.PaymentType=S,customElements.define(window.BannowebAccountFsccPaymentsElement.is,window.BannowebAccountFsccPaymentsElement);var E=window.BannowebAccountFsccPaymentsElement;export{E as default};