Describe the bug

I'm upgrading a site to use Block checkout because it solves a few issues we had with the old checkout, however the site in question used to use a Google Places Autocomplete plugin - this obviously doesn't work with the block checkout so I'm trying to implement it.

The problem is however, whilst I can attach the Autocomplete prompt to the first address field, when I then update the other fields with the data, it populates, then resets if you focus on it. It also doesn't move the label out of the way.

To reproduce

Steps to reproduce the behavior:

Without writing the code to implement Google Places it's a little hard, but here is a video of what happens. Currently I'm doing this in Vanilla JS. Ideally I'd be able to hook in to the React components for the inputs but I don't think this is possible right now?

https://streamable.com/8evuo0

Expected behavior

When choosing an address from the Google Autocomplete prompt, the fields should fill in, move their labels out of the way and not reset when a user focuses on them.

Environment

WordPress (please complete the following information):

• WordPress version: 6.0.2
• WooCommerce version: 6.9.4
• WooCommerce Blocks version: 8.6.0
• Site language: English
• Any other plugins installed: ACF Pro, WooCommerce Stripe Gateway, WooCommerce Subscriptions, WP Migrate

Desktop (please complete the following information):

• OS: macOS
• Browser: Chrome
• Version: Latest, I think 110.

Any help is much appreciated! Even pointing in the direction on how the blessed way to do this might be! Thank you.