<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
    <div class="modal-body-container">
        {{#each @options.paymentMethods as |paymentMethod|}}
            <a href="javascript:;" {{on "click" (fn @options.selectPaymentMethod paymentMethod)}} class="flex items-center justify-between px-3 py-2 shadow-sm rounded-md border border-gray-900 {{if (eq @options.selectedPaymentMethod.id paymentMethod.id) 'border-blue-500 shadow-outline-blue'}}">
                <div class="flex items-center dark:text-gray-100">
                    <FaIcon @icon="cc-visa" class="mr-1" />
                    <span class="mr-2">{{t "fleet-ops.component.modals.select-payment-method" htmlSafe=true method=@paymentMethod.last4}}</span>
                </div>
            </a>
        {{/each}}
    </div>
</Modal::Default>