[BUG] Address component not rendering correct HTML

[Javo-blip]

Environment

Please provide as many details as you can:

• Hosting type
  • [] Form.io
  • [x] Local deployment
    • Version: 4.2.4
• Formio.js version: 4.8.1
• Frontend framework: React (Create react app)
• Browser: Chrome
• Browser version: latest

Steps to Reproduce

1. Create form with address component
2. Input google api key

Expected behavior

Should be an address component showing a suggestions dropdown with suggestions from google.

Expected html

<div ref="element">
    <input value="" lang="en" class="form-control address-search" type="text" name="data[address]" ref="input" placeholder="Enter a location" autocomplete="off">
</div>

Observed behavior

Incorrect component rendered

rendered html

<div class="address-autocomplete-container">
    <input value="" tabindex="0" lang="en" class="form-control" type="text" name="data[address]" ref="searchInput">
    <i ref="removeValueIcon" tabindex="0" class="address-autocomplete-remove-value-icon fa fa-times address-autocomplete-remove-value-icon--hidden"></i>
</div>

[jeriah-formio]

@Javo-blip We are currently refactoring our address component which is included in our 4.8.0 / 4.8.1 versions of formio.js. In this refactor we have included additional providers to the component as well as introduce the 'Manual Mode' checkbox.

We will be implementing an option to remove the 'Manual Mode' checkbox to visually align with our previous address component.

[Javo-blip]

@jhen1422 Sorry, the checkbox wasn't what I was referring to, my apologies. The new component actually does not prompt address suggestions from google. It acts like a raw <input />. In addition, the text placeholder also seems to be missing.

What version should I revert back to in the meantime, before the new component becomes mature?

[Javo-blip]

When the address data is a string, the input component actually doesn't even render at all.

ie. if my data object in my submission was

{
    address: "Some string"
}

instead of a proper address object.

[jeriah-formio]

@Javo-blip I can confirm that the google map API is populating address suggestions. Can you ensure you have the Google Map provider selected a long with a valid API key? https://share.getcloudapp.com/7KuyG0jy

Any version prior to 4.8.0 has the previous address version.

[Javo-blip]

@jhen1422 I can confirm API key is valid and working. However no results come up as suggestions.

[TanyaGashtold]

I am closing the issue as it was created too long ago and there are no new comments here. I hope it was resolved. If not, please reopen it. Thanks!