[maps][xs] - fixing height

examples/learn/next.config.js

@@ -0,0 +1,5 @@
+const nextConfig = {
+  swcMinify: false
+}
+
+module.exports = nextConfig

packages/components/package.json

@@ -37,7 +37,6 @@
     "react-hook-form": "^7.43.9",
     "react-query": "^3.39.3",
     "react-vega": "^7.6.0",
-    "rollup-plugin-re": "^1.0.7",
     "vega": "5.25.0",
     "vega-lite": "5.1.0",
     "vitest": "^0.31.4"

packages/components/src/components/OpenLayers/Map.jsx

@@ -40,7 +40,7 @@ const Map = ({ children, zoom, center, setSelected }) => {
   }, [map]);
   return (
     <MapContext.Provider value={{ map }}>
-      <div ref={mapRef} className="w-full h-[500px]">
+      <div ref={mapRef} className="w-full" style={{height: '500px'}}>
         {children}
       </div>
     </MapContext.Provider>

packages/components/vite.config.ts

@@ -38,6 +38,7 @@ const app = async (): Promise<UserConfigExport> => {
           'react-vega',
           'ol',
           'ol/dom.js',
+          'ol/reproj.js',
         ],
         output: {
           manualChunks: undefined,
@@ -46,6 +47,7 @@ const app = async (): Promise<UserConfigExport> => {
             ol: 'ol',
             'ol-mapbox-style': 'ol-mapbox-style',
             'ol/dom.js': 'ol/dom.js',
+            'ol/reproj.js': 'ol/reproj.js',
             'react-vega': 'react-vega',
             'react-dom': 'ReactDOM',
             tailwindcss: 'tailwindcss',