[Bug] - Incorrect typing for `projection` prop on the `Map` component

[chiubaca]

Description

As per the title, for typing for projection prop on the Map component seems to be incorrect. In the example below i'm trying to use the globe but I'm getting a TypeScript error. However it works fine on the frontend.

Other suported options also return TS error e.g albers, equalEarth etc.

Expected Behavior

There should not be a typescript error

Steps to Reproduce

Put this component in a React / Typescript project. I'm using vite:

import Map from 'react-map-gl';

function App() {

  return <main className='w-screen h-screen'>
    <Map
      id="mainMap"
      projection={'globe'}
      initialViewState={{
        longitude: -1.62,
        latitude: 52.32,
        zoom: 3,
        pitch: 180
      }}
      // style={{ height: '100% ' }}
      mapStyle="mapbox://styles/mapbox/streets-v9"
    >
    </Map>
  </main>
}

export default App

my package,.json

{
  "name": "my-react-app",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc && vite build",
    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview"
  },
  "dependencies": {
    "mapbox-gl": "^2.15.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-map-gl": "^7.1.6"
  },
  "devDependencies": {
    "@types/node": "^20.8.10",
    "@types/react": "^18.2.15",
    "@types/react-dom": "^18.2.7",
    "@typescript-eslint/eslint-plugin": "^6.0.0",
    "@typescript-eslint/parser": "^6.0.0",
    "@vitejs/plugin-react": "^4.0.3",
    "autoprefixer": "^10.4.16",
    "eslint": "^8.45.0",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.3",
    "postcss": "^8.4.31",
    "tailwindcss": "^3.3.5",
    "typescript": "^5.0.2",
    "vite": "^4.4.5"
  }
}

Environment

• Framework version:4.4.5
• Map library: mapbox 2.15.0
• Browser: Microsoft Edge Version 118.0.2088.76 (Official build) (64-bit)
• OS: windows 11

Logs

No response

[Pessimistress]

Projection is defined by @types/mapbox-gl, not this library. Make sure you have a matching version installed as your mapbox-gl.