arcgisOnlineProvider attribute 'apikey' doesn't exist

[hman1148]

Describe the bug

After importing the esri-leaflet-geocoder library into my project, I attempted to use the esri.GeoCoding namespace in my project to access arcgisOnlineProvider. When I attempted to feed in my apikey to the documented apikey attribute, I get an error that reads:

"Object literal may only specify known properties, and 'apikey' does not exist in type 'ArcgisOnlineProviderOptions"

To my understanding, I should have access to the apikey attribute according to the documentation located here under the "Providers" category: https://developers.arcgis.com/esri-leaflet/api-reference/controls/geosearch/

I could be misunderstanding how this provider works. Ultimately with my code I want to feed in an API Key that I have in my project to the provider. I am using a regular import statement like such because esri-leaflet-geocoder doesn't have an export type, or object in the source code:

import 'sri-leaflet-geocoder'

I don't know if this is a bug with the library or if this is a lack of understanding of how providers work on my part. Thanks!

Reproduction

1: npm i --save-dev @types/esri-leaflet-geocoder

2. Add in the library via import 'esri-leaflet-geocoding'
3. Attempt to use the namespace as directed by the source library esri.Geocoding.arcgisOnlineProvider({ apikey: "" )};
4. You will receive the error

Logs

No response

System Info

Leaflet Version: 2.13.1
esri-geocoder: 3.1.4

Additional Information

No response

[shakyad]

Same issue here. Just following the documentation and the 'apikey' does not exist. Using geocoder 3.1.4, leaflet: v1.9.4, and esri-leaflet-vector: v4.2.4

[gavinr-maps]

Try to import using this style:

import { geosearch, arcgisOnlineProvider } from "esri-leaflet-geocoder";

It's working for me in the react demo here (see this place in the code specifically).

[shakyad]

It worked for me with import statement.

import * as ELG from 'esri-leaflet-geocoder';

I then followed the documentation code and it works now. I had imported @types for geocoder but had to delete it. not sure there was anything to do with it.

    const searchControl = ELG.geosearch({
      position: 'topright',
      placeholder: 'Type the place or address to search.',
      useMapBounds: false,
      providers: [
        ELG.arcgisOnlineProvider({
          apikey: apiKey,
        }),
      ],
    }).addTo(this.map);

    var results = L.layerGroup().addTo(this.map);

    searchControl.on('results', function (data) {
      results.clearLayers();
      for (var i = data.results.length - 1; i >= 0; i--) {
        results.addLayer(L.marker(data.results[i].latlng));
      }
    });

[gavinr-maps]

I created https://github.com/Esri/esri-leaflet-geocoder/issues/319 to cover the possible TypeScript types issue. I'm going to close this issue. @hman1148 if your issue is not resolved using the example from https://github.com/Esri/esri-leaflet-geocoder/issues/318#issuecomment-2312607259, please open a separate issue. Thank you!