Libraries type should be exported from index.d.ts

[Gonzalo9823]

Please provide an explanation of the issue

When you want to create an array outside a component (to avoid the warning Performance warning! LoadScript has been reloaded unintentionally! You should not pass 'libraries' prop as new array. Please keep an array of libraries as static class property for Components and PureComponents, or just a const variable outside of component, or somewhere in config files or ENV variables) for the libraries prop on useJsApiLoader, TypeScript it will thrown an error if it is of type string[] so for it to work you need to import Libraries from @react-google-maps/api but is not being exported from index.d.ts.

Your Environment

os: MacOs 12.1 node: 16.13.2 react: 17.0.2 webpack: 5.72.0 webpack version babel: n/a (using Next.js 12 RUST compiler) @react-google-maps/api: 2.10.2

How does it behave?

const googleMapsLibraries = ['places'];

const LocationModal: FunctionComponent<LocationModalProps> = ({ isOpen, onClose, onResponse, selectedLocation }) => {

  const { isLoaded } = useJsApiLoader({
    id: 'google-map-script',
    googleMapsApiKey: '[REDACTED]',
    libraries: googleMapsLibraries,
  });

Error: Type 'string[]' is not assignable to type '("places" | "drawing" | "geometry" | "localContext" | "visualization")[]'

How should it behave correctly?

On index.d.ts

declare type Libraries = ("drawing" | "geometry" | "localContext" | "places" | "visualization")[];

should be

export declare type Libraries = ("drawing" | "geometry" | "localContext" | "places" | "visualization")[];

import { GoogleMap, useJsApiLoader, Libraries } from '@react-google-maps/api';

const googleMapsLibraries: Libraries[] = ['places'];

const LocationModal: FunctionComponent<LocationModalProps> = ({ isOpen, onClose, onResponse, selectedLocation }) => {

  const { isLoaded } = useJsApiLoader({
    id: 'google-map-script',
    googleMapsApiKey: '[REDACTED]',
    libraries: googleMapsLibraries,
  });

Basic implementation of incorrect behavior in codesandbox.com

https://codesandbox.io/s/exciting-frog-vq2feu

[JustFly1984]

@Gonzalo9823 your PR is welcome. By now you can just copy the type locally.

[askokr]

Stumbled here in search of a Libraries type export as well.

One can access this type from existing exports already:

import { useLoadScript, LoadScripttProps } from '@react-google-maps/api';

const googleMapsLibraries: LoadScriptProps['libraries'] = ["places"];

An exported type would be nice but for now perhaps this helps someone.

[rickstaa]

It looks like an export for the GoogleMapProps interface was added by https://github.com/rickstaa/react-google-maps-api/commit/3e6ed5ed6ec085af2d93343dd5147806107187e8. I just added an export for the GoogleMapState interface #3165.