<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
    <div class="modal-body-container">
        <div class="grid grid-cols-3 gap-1 text-xs dark:text-gray-100">
            <InputGroup @name={{t "storefront.common.name"}} @autocomplete="nope" @value={{@options.place.name}} @wrapperClass="col-span-3" />
            <InputGroup @name={{t "storefront.common.street-1"}} @value={{@options.place.street1}} @wrapperClass="col-span-3">
                <AutocompleteInput @value={{@options.place.street1}} @onSelect={{@options.autocomplete}} placeholder={{t "storefront.common.street-1"}} class="w-full" as |result|>
                    {{result.address}}
                </AutocompleteInput>
            </InputGroup>
            <InputGroup @name={{t "storefront.component.modals.store-location-form.street-2"}} @autocomplete="nope" @value={{@options.place.street2}} @wrapperClass="col-span-3" />
            <InputGroup @name={{t "storefront.common.neighborhood"}} @autocomplete="nope" @value={{@options.place.neighborhood}} />
            <InputGroup @name={{t "storefront.common.building"}} @autocomplete="nope" @value={{@options.place.building}} />
            <InputGroup @name={{t "storefront.component.modals.store-location-form.security-access-code"}} @autocomplete="nope" @value={{@options.place.security_access_code}} />
            <InputGroup @name={{t "storefront.component.modals.store-location-form.postal-code"}} @autocomplete="nope" @value={{@options.place.postal_code}} />
            <InputGroup @name={{t "storefront.common.city"}} @autocomplete="nope" @value={{@options.place.city}} />
            <InputGroup @name={{t "storefront.common.state"}} @autocomplete="nope" @value={{@options.place.province}} />
            <InputGroup @name={{t "storefront.common.country"}} @wrapperClass="col-span-2">
                <CountrySelect
                    class="w-full form-input form-select form-datalist"
                    @value={{@options.place.country}}
                    @onChange={{fn (mut @options.place.country)}}
                    placeholder={{t "storefront.common.country"}}
                />
            </InputGroup>
            <InputGroup @name={{t "storefront.common.coordinates"}} @wrapperClass="col-span-2">
                <CoordinatesInput
                    @value={{@options.place.location}}
                    @onChange={{@options.updatePlaceCoordinates}}
                    @onGeocode={{@options.autocomplete}}
                    @onInit={{@options.setCoordinatesInput}}
                />
            </InputGroup>
            <div class="col-span-1"></div>
            <InputGroup @name={{t "storefront.common.phone"}}>
                <PhoneInput @value={{@options.place.phone}} @autocomplete="nope" @onInput={{fn (mut @options.place.phone)}} class="form-input w-full" />
            </InputGroup>
            <InputGroup @name={{t "storefront.common.email"}} @autocomplete="nope" @value={{@options.place.email}} />
        </div>
    </div>
</Modal::Default>