@php
    $form_id = '-' . uniqid();
    $haveBtnCta = $haveBtnCta ?? true;
    $labels = $labels ?? [];
@endphp

@once @push('script')
    <script>
        (function (glob) {
            var handler = function ($cta, callback_then, callback_catch, validate_postal = false, $popup = null) {
                $($cta).off('click').on('click', function (e){
                    doSubmitAddress(
                        e.currentTarget,
                        validate_postal,
                        @json([
                            'msg_fill_required_fields' => __('label.msg_fill_required_fields'),
                            'msg_invalid_postcode' => __('label.msg_invalid_postcode'),
                        ]),
                        $popup
                    ).then(function (response) {
                        callback_then && callback_then(response);
                    }).catch(function (res) {
                        callback_catch && callback_catch(res);
                    });
                });
            };

            var method = 'listenAddressSubmission';
            glob[method] || (glob[method] = handler);
        })(window);
    </script>
@endpush @endonce

<div class="text-left">

    <div class="form-group input-group-address">
        <label for="delivery-address-input{{$form_id}}">{{ __('label.address') }}</label>
        <input type="text" class="form-control required delivery-address-input" id="delivery-address-input{{$form_id}}" aria-describedby="addressHelp" placeholder="Address Line 1">
    </div>

    <div class="form-group input-group-address">
        <label for="delivery-address-input2{{$form_id}}">{{ __('label.address_line_2') }}</label>
        <input type="text" class="form-control delivery-address-input2" id="delivery-address-input2{{$form_id}}" aria-describedby="addressHelp" placeholder="Address Line 2">
    </div>

    @php
        $postcode_placeholder = '';
        for ($i=0, $max_digit=config('sys.postcode_digit'); $i<$max; ++$i) {
            $postcode_placeholder .= '0';
        }
    @endphp

    <div class="form-group input-group-post">
        <label for="delivery-postal-input{{$form_id}}">{{ __('label.postal_code') }}</label>
        <input id="delivery-postal-input{{$form_id}}" type="text" inputmode="numeric"
            maxlength="{{ $max_digit ?? '' }}"
            class="delivery-postal-input form-control required"
            placeholder="{{ $postcode_placeholder ?? '' }}"/>
    </div>

    <div class="form-group input-group-state">
        <label for="delivery-state-input{{$form_id}}">{{ __('label.state') }}</label>
        <input type="text" inputmode="text" class="delivery-state-input form-control required" id="delivery-state-input{{$form_id}}" placeholder="State">
    </div>

    <div class="form-group input-group-country">
        <label for="delivery-country-input{{$form_id}}">{{ data_get($labels, 'country', __('label.country')) }}</label>
        <div class="bingo_regform">
            <select class="js-states form-control required delivery-country-input"
                    id="delivery-country-input{{$form_id}}" style="width: 100%"></select>
        </div>
    </div>


</div>

@if($haveBtnCta)
    <!-- CTA BUTTONS -->
    <div class="btn-wrap">
        <a id="{{ $cta_id }}" class='btn btn-primary'>{{ __('label.btn_submit_pending_delivery_address') }}</a>
        <div class="message-container mt-2"><div class="message"></div></div>
    </div>
@endif