refactor(examples) use globalThis instead of passing props

examples/basic-map/index.html

@@ -24,12 +24,10 @@
     <div id="app"></div>
     <script type="module">
       import '@vis.gl/react-google-maps/examples.css';
-      import {GOOGLE_MAPS_API_KEY} from '@vis.gl/react-google-maps/examples.js';
+      import '@vis.gl/react-google-maps/examples.js';
       import {renderToDom} from './src/app';
 
-      renderToDom(document.querySelector('#app'), {
-        apiKey: GOOGLE_MAPS_API_KEY
-      });
+      renderToDom(document.querySelector('#app'));
     </script>
   </body>
 </html>

examples/basic-map/src/app.tsx

@@ -4,14 +4,11 @@ import {createRoot} from 'react-dom/client';
 import {APIProvider, Map} from '@vis.gl/react-google-maps';
 import ControlPanel from './control-panel';
 
-const API_KEY = process.env.GOOGLE_MAPS_API_KEY as string;
+const API_KEY =
+  globalThis.GOOGLE_MAPS_API_KEY ?? (process.env.GOOGLE_MAPS_API_KEY as string);
 
-interface Props {
-  apiKey?: string;
-}
-
-const App = (props: Props) => (
-  <APIProvider apiKey={props.apiKey ?? API_KEY}>
+const App = () => (
+  <APIProvider apiKey={API_KEY}>
     <Map
       zoom={3}
       center={{lat: 22.54992, lng: 0}}
@@ -23,12 +20,12 @@ const App = (props: Props) => (
 );
 export default App;
 
-export function renderToDom(container: HTMLElement, props: Props) {
+export function renderToDom(container: HTMLElement) {
   const root = createRoot(container);
 
   root.render(
     <React.StrictMode>
-      <App {...props} />
+      <App />
     </React.StrictMode>
   );
 }

examples/global.d.ts

@@ -0,0 +1,5 @@
+export declare global {
+  // const or let does not work in this case, it has to be var
+  // eslint-disable-next-line no-var
+  var GOOGLE_MAPS_API_KEY: string | undefined;
+}

website/static/scripts/examples.js

@@ -1,6 +1,4 @@
 // For the codesandbox examples, the 'process.env.GOOGLE_MAPS_API_KEY'
 // gets replaced in the deploy task in the github action
 // to contain the valid key for the examples
-export default {
-  GOOGLE_MAPS_API_KEY: process.env.GOOGLE_MAPS_API_KEY
-};
+globalThis.GOOGLE_MAPS_API_KEY = process.env.GOOGLE_MAPS_API_KEY;