[Feat] Support disabling or targeting the second `.pac-container` injected by Google Autocomplete

Target Use Case

Hi 👋 and thank you for the great work on this library!

I'm currently using the <Autocomplete> component from @react-google-maps/api and I noticed that, when the Google Places Autocomplete widget is initialized, it injects two div.pac-container elements into the DOM.

• The first seems to contain the actual place predictions.
• The second appears to be used for internal styling or highlight rendering.

While this behavior comes from the underlying Google Maps JavaScript API, it creates styling and layout issues in certain cases (e.g., inside modals or custom UI containers), especially when trying to apply scoped CSS in a React app.

Feature Request

Would it be possible to expose a prop or configuration option on the <Autocomplete> component that allows:

1. Either disabling the second .pac-container (if safe and feasible), or
2. Assigning a custom className or wrapper element to help us target it more precisely with CSS.

Even though this is mostly controlled by Google’s API, some developers might benefit from being able to more easily identify or interact with the injected containers.

Alternatives Considered

I tried this but it doesn't work

.pac-container:nth-of-type(2) {
  display: none !important;
}

Context

I'm using the latest version of the library with React 18, and I've confirmed the behavior is consistent across several environments. If there's a known workaround or best practice for this case, I'd appreciate any pointers!

Thanks again for your hard work 🙏

Proposal

I don't have any proposal for now

Start at the component and reproduce the two injected .pac-container elements with the Google Places Autocomplete widget. Check whether the Google Maps JavaScript API permits disabling or targeting the second container, then determine whether a supported prop is feasible or the limitation should be documented.