Unable to use leaflet-geosearch with an input using React.js

Question

I am trying to do an input using React.js

I saw that :

Leaflet-Geosearch

I tried that :

import "./styles.css";
import { OpenStreetMapProvider } from 'leaflet-geosearch';

const App = () =>{
  const form = document.querySelector('form');
  const input = form.querySelector('input[type="text"]');
  return (
    form.addEventListener('submit', async (event) => {
      event.preventDefault();
    
      const results = await provider.search({ query: input.value });
      console.log(results); // » [{}, {}, {}, ...]
    });
  );
}

export default App;

But it does not work :/

Here you can see my code :

Could you help me please ?

Thank you very much !

My code