react-three-map 0.8.2 → 1.0.0-next.0

package/dist/maplibre/cjs/main.js

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const fiber = require("@react-three/fiber");
 const jsxRuntime = require("react/jsx-runtime");
-const mapboxGl = require("mapbox-gl");
+const maplibreGl = require("maplibre-gl");
 const react = require("react");
-const reactMapGl = require("react-map-gl");
+const maplibre = require("react-map-gl/maplibre");
 const THREE = require("three");
 const reactDom = require("react-dom");
 function _interopNamespaceDefault(e) {
@@ -237,7 +237,8 @@ function useRender({
   r3m
 }) {
   const render = useFunction((_gl, projViewMx) => {
-    r3m.viewProjMx.splice(0, 16, ...projViewMx);
+    const pVMx = "defaultProjectionData" in projViewMx ? Object.values(projViewMx.defaultProjectionData.mainMatrix) : projViewMx;
+    r3m.viewProjMx.splice(0, 16, ...pVMx);
     const state = useThree.getState();
     const camera = state.camera;
     const { gl, advance } = state;
@@ -537,9 +538,9 @@ const InitCanvasFC = react.memo((props) => {
 });
 InitCanvasFC.displayName = "InitCanvasFC";
 fiber.extend(THREE__namespace);
-const fromLngLat = mapboxGl.MercatorCoordinate.fromLngLat;
+const fromLngLat = maplibreGl.MercatorCoordinate.fromLngLat;
 const Canvas = react.memo(({ overlay, ...props }) => {
-  const map = reactMapGl.useMap().current.getMap();
+  const map = maplibre.useMap().current.getMap();
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     overlay && /* @__PURE__ */ jsxRuntime.jsx(CanvasOverlay, { map, ...props }),
     !overlay && /* @__PURE__ */ jsxRuntime.jsx(CanvasInLayer, { map, ...props })
@@ -548,7 +549,7 @@ const Canvas = react.memo(({ overlay, ...props }) => {
 Canvas.displayName = "Canvas";
 const CanvasInLayer = react.memo(({ map, ...props }) => {
   const layerProps = useCanvasInLayer(props, fromLngLat, map);
-  return /* @__PURE__ */ jsxRuntime.jsx(reactMapGl.Layer, { ...layerProps });
+  return /* @__PURE__ */ jsxRuntime.jsx(maplibre.Layer, { ...layerProps });
 });
 CanvasInLayer.displayName = "CanvasInLayer";
 const CanvasOverlay = react.memo(({ map, id, beforeId, ...props }) => {
@@ -559,7 +560,7 @@ const CanvasOverlay = react.memo(({ map, id, beforeId, ...props }) => {
     onRender(mx);
   });
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(reactMapGl.Layer, { id, beforeId, type: "custom", render }),
+    /* @__PURE__ */ jsxRuntime.jsx(maplibre.Layer, { id, beforeId, type: "custom", render }),
     /* @__PURE__ */ jsxRuntime.jsx(
       InitCanvasFC,
       {

package/dist/maplibre/es/main.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"main.mjs","sources":["../../../src/maplibre.index.ts"],"sourcesContent":["import type { Map } from 'maplibre-gl';\nimport { useMap as useMapGeneric } from './api/use-map';\n\nexport * from './api';\nexport * from './mapbox/canvas';\n\nexport const useMap = useMapGeneric<Map>;\n"],"names":["useMapGeneric"],"mappings":";;;;;;AAMO,MAAM,SAASA;"}
+{"version":3,"file":"main.mjs","sources":["../../../src/maplibre.index.ts"],"sourcesContent":["import type { Map } from 'maplibre-gl';\nimport { useMap as useMapGeneric } from './api/use-map';\n\nexport * from './api';\nexport * from './maplibre/canvas';\n\nexport const useMap = useMapGeneric<Map>;\n"],"names":["useMapGeneric"],"mappings":";;;;;;AAMO,MAAM,SAASA;"}

package/dist/maplibre/es/main16.mjs

@@ -8,7 +8,8 @@ function useRender({
   r3m
 }) {
   const render = useFunction((_gl, projViewMx) => {
-    r3m.viewProjMx.splice(0, 16, ...projViewMx);
+    const pVMx = "defaultProjectionData" in projViewMx ? Object.values(projViewMx.defaultProjectionData.mainMatrix) : projViewMx;
+    r3m.viewProjMx.splice(0, 16, ...pVMx);
     const state = useThree.getState();
     const camera = state.camera;
     const { gl, advance } = state;

package/dist/maplibre/es/main16.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"main16.mjs","sources":["../../../src/core/canvas-in-layer/use-render.ts"],"sourcesContent":["import { RootState } from \"@react-three/fiber\";\nimport { Matrix4Tuple, PerspectiveCamera } from \"three\";\nimport { UseBoundStore } from \"zustand\";\nimport { MapInstance } from \"../generic-map\";\nimport { syncCamera } from \"../sync-camera\";\nimport { useFunction } from \"../use-function\";\nimport { R3M } from \"../use-r3m\";\n\nexport function useRender({\n  map, origin, useThree, frameloop, r3m,\n} :{\n  map: MapInstance,\n  origin: Matrix4Tuple,\n  useThree: UseBoundStore<RootState>,\n  frameloop?: 'always' | 'demand',\n  r3m: R3M\n}) {\n  const render = useFunction((_gl: WebGL2RenderingContext, projViewMx: number[]) => {\n    r3m.viewProjMx.splice(0, 16, ...projViewMx)\n    const state = useThree.getState();\n    const camera = state.camera as PerspectiveCamera;\n    const {gl, advance} = state;\n    syncCamera(camera as PerspectiveCamera, origin, projViewMx as Matrix4Tuple);\n    gl.resetState();\n    advance(Date.now() * 0.001, true);\n    if (!frameloop || frameloop === 'always') map.triggerRepaint();\n  })\n  return render;\n}"],"names":[],"mappings":";;AAQO,SAAS,UAAU;AAAA,EACxB;AAAA,EAAK;AAAA,EAAQ;AAAA,EAAU;AAAA,EAAW;AACpC,GAMG;AACD,QAAM,SAAS,YAAY,CAAC,KAA6B,eAAyB;AAChF,QAAI,WAAW,OAAO,GAAG,IAAI,GAAG,UAAU;AACpC,UAAA,QAAQ,SAAS;AACvB,UAAM,SAAS,MAAM;AACf,UAAA,EAAC,IAAI,QAAW,IAAA;AACX,eAAA,QAA6B,QAAQ,UAA0B;AAC1E,OAAG,WAAW;AACd,YAAQ,KAAK,IAAQ,IAAA,MAAO,IAAI;AAC5B,QAAA,CAAC,aAAa,cAAc;AAAU,UAAI,eAAe;AAAA,EAAA,CAC9D;AACM,SAAA;AACT;"}
+{"version":3,"file":"main16.mjs","sources":["../../../src/core/canvas-in-layer/use-render.ts"],"sourcesContent":["import { RootState } from \"@react-three/fiber\";\nimport { Matrix4Tuple, PerspectiveCamera } from \"three\";\nimport { UseBoundStore } from \"zustand\";\nimport { MapInstance } from \"../generic-map\";\nimport { syncCamera } from \"../sync-camera\";\nimport { useFunction } from \"../use-function\";\nimport { R3M } from \"../use-r3m\";\n\nexport function useRender({\n  map, origin, useThree, frameloop, r3m,\n} :{\n  map: MapInstance,\n  origin: Matrix4Tuple,\n  useThree: UseBoundStore<RootState>,\n  frameloop?: 'always' | 'demand',\n  r3m: R3M\n}) {\n  const render = useFunction((_gl: WebGL2RenderingContext, projViewMx: number[] | {defaultProjectionData: {mainMatrix: Record<string, number>}}) => {\n    const pVMx = 'defaultProjectionData' in projViewMx ? Object.values(projViewMx.defaultProjectionData.mainMatrix) : projViewMx;\n    r3m.viewProjMx.splice(0, 16, ...pVMx)\n    const state = useThree.getState();\n    const camera = state.camera as PerspectiveCamera;\n    const {gl, advance} = state;\n    syncCamera(camera as PerspectiveCamera, origin, projViewMx as Matrix4Tuple);\n    gl.resetState();\n    advance(Date.now() * 0.001, true);\n    if (!frameloop || frameloop === 'always') map.triggerRepaint();\n  })\n  return render;\n}"],"names":[],"mappings":";;AAQO,SAAS,UAAU;AAAA,EACxB;AAAA,EAAK;AAAA,EAAQ;AAAA,EAAU;AAAA,EAAW;AACpC,GAMG;AACD,QAAM,SAAS,YAAY,CAAC,KAA6B,eAAyF;AAC1I,UAAA,OAAO,2BAA2B,aAAa,OAAO,OAAO,WAAW,sBAAsB,UAAU,IAAI;AAClH,QAAI,WAAW,OAAO,GAAG,IAAI,GAAG,IAAI;AAC9B,UAAA,QAAQ,SAAS;AACvB,UAAM,SAAS,MAAM;AACf,UAAA,EAAC,IAAI,QAAW,IAAA;AACX,eAAA,QAA6B,QAAQ,UAA0B;AAC1E,OAAG,WAAW;AACd,YAAQ,KAAK,IAAQ,IAAA,MAAO,IAAI;AAC5B,QAAA,CAAC,aAAa,cAAc;AAAU,UAAI,eAAe;AAAA,EAAA,CAC9D;AACM,SAAA;AACT;"}

package/dist/maplibre/es/main3.mjs

@@ -1,8 +1,8 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { extend } from "@react-three/fiber";
-import { MercatorCoordinate } from "mapbox-gl";
+import { MercatorCoordinate } from "maplibre-gl";
 import { memo, useState } from "react";
-import { useMap, Layer } from "react-map-gl";
+import { useMap, Layer } from "react-map-gl/maplibre";
 import * as THREE from "three";
 import { useCanvasInLayer } from "./main8.mjs";
 import { InitCanvasFC } from "./main9.mjs";

package/dist/maplibre/es/main3.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"main3.mjs","sources":["../../../src/mapbox/canvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport { extend } from \"@react-three/fiber\";\nimport { MercatorCoordinate } from \"mapbox-gl\";\nimport { memo, useState } from \"react\";\nimport { Layer, useMap } from \"react-map-gl\";\nimport * as THREE from \"three\";\nimport { Matrix4Tuple } from \"three\";\nimport { CanvasProps } from \"../api/canvas-props\";\nimport { useCanvasInLayer } from \"../core/canvas-in-layer/use-canvas-in-layer\";\nimport { InitCanvasFC } from \"../core/canvas-overlay/init-canvas-fc\";\nimport { Render } from \"../core/canvas-overlay/render\";\nimport { MapInstance } from \"../core/generic-map\";\nimport { useFunction } from \"../core/use-function\";\n\nextend(THREE);\n\nconst fromLngLat = MercatorCoordinate.fromLngLat\n\n/** react`-three-fiber` canvas inside `Mapbox` */\nexport const Canvas = memo<CanvasProps>(({ overlay, ...props }) => {\n\n  const map = useMap().current!.getMap(); // eslint-disable-line @typescript-eslint/no-non-null-assertion\n\n  return <>\n    {overlay && <CanvasOverlay map={map} {...props} />}\n    {!overlay && <CanvasInLayer map={map} {...props} />}\n  </>\n})\nCanvas.displayName = 'Canvas'\n\ninterface CanvasPropsAndMap extends CanvasProps {\n  map: MapInstance;\n}\n\nconst CanvasInLayer = memo<CanvasPropsAndMap>(({ map, ...props }) => {\n  const layerProps = useCanvasInLayer(props, fromLngLat, map);\n  /* @ts-ignore */ // eslint-disable-line @typescript-eslint/ban-ts-comment\n  return <Layer {...layerProps} />\n})\nCanvasInLayer.displayName = 'CanvasInLayer';\n\nconst CanvasOverlay = memo<CanvasPropsAndMap>(({ map, id, beforeId, ...props }) => {\n  const [onRender, setOnRender] = useState<(mx: Matrix4Tuple) => void>();\n\n  const render = useFunction<Render>((_gl, mx) => {\n    if (!onRender) return;\n    onRender(mx as Matrix4Tuple);\n  })\n\n  return <>\n    {/* @ts-ignore  */}\n    <Layer id={id} beforeId={beforeId} type=\"custom\" render={render} />\n    <InitCanvasFC {...props}\n      setOnRender={setOnRender}\n      map={map}\n      fromLngLat={fromLngLat}\n    />\n  </>\n})\nCanvasInLayer.displayName = 'CanvasInLayer';"],"names":[],"mappings":";;;;;;;;;AAcA,OAAO,KAAK;AAEZ,MAAM,aAAa,mBAAmB;AAG/B,MAAM,SAAS,KAAkB,CAAC,EAAE,SAAS,GAAG,YAAY;AAEjE,QAAM,MAAM,OAAA,EAAS,QAAS,OAAO;AAErC,SACG,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,WAAY,oBAAA,eAAA,EAAc,KAAW,GAAG,MAAO,CAAA;AAAA,IAC/C,CAAC,WAAW,oBAAC,eAAc,EAAA,KAAW,GAAG,OAAO;AAAA,EACnD,EAAA,CAAA;AACF,CAAC;AACD,OAAO,cAAc;AAMrB,MAAM,gBAAgB,KAAwB,CAAC,EAAE,KAAK,GAAG,YAAY;AACnE,QAAM,aAAa,iBAAiB,OAAO,YAAY,GAAG;AAEnD,SAAA,oBAAC,OAAO,EAAA,GAAG,WAAY,CAAA;AAChC,CAAC;AACD,cAAc,cAAc;AAE5B,MAAM,gBAAgB,KAAwB,CAAC,EAAE,KAAK,IAAI,UAAU,GAAG,YAAY;AACjF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAqC;AAErE,QAAM,SAAS,YAAoB,CAAC,KAAK,OAAO;AAC9C,QAAI,CAAC;AAAU;AACf,aAAS,EAAkB;AAAA,EAAA,CAC5B;AAED,SAEE,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,oBAAC,OAAM,EAAA,IAAQ,UAAoB,MAAK,UAAS,QAAgB;AAAA,IACjE;AAAA,MAAC;AAAA,MAAA;AAAA,QAAc,GAAG;AAAA,QAChB;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AACF,CAAC;AACD,cAAc,cAAc;"}
+{"version":3,"file":"main3.mjs","sources":["../../../src/maplibre/canvas.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport { extend } from \"@react-three/fiber\";\nimport { MercatorCoordinate } from \"maplibre-gl\";\nimport { memo, useState } from \"react\";\nimport { Layer, useMap } from \"react-map-gl/maplibre\";\nimport * as THREE from \"three\";\nimport { Matrix4Tuple } from \"three\";\nimport { CanvasProps } from \"../api/canvas-props\";\nimport { useCanvasInLayer } from \"../core/canvas-in-layer/use-canvas-in-layer\";\nimport { InitCanvasFC } from \"../core/canvas-overlay/init-canvas-fc\";\nimport { Render } from \"../core/canvas-overlay/render\";\nimport { MapInstance } from \"../core/generic-map\";\nimport { useFunction } from \"../core/use-function\";\n\nextend(THREE);\n\nconst fromLngLat = MercatorCoordinate.fromLngLat\n\n/** `react-three-fiber` canvas inside `MapLibre` */\nexport const Canvas = memo<CanvasProps>(({ overlay, ...props }) => {\n\n  const map = useMap().current!.getMap(); // eslint-disable-line @typescript-eslint/no-non-null-assertion\n\n  return <>\n    {overlay && <CanvasOverlay map={map} {...props} />}\n    {!overlay && <CanvasInLayer map={map} {...props} />}\n  </>\n})\nCanvas.displayName = 'Canvas'\n\ninterface CanvasPropsAndMap extends CanvasProps {\n  map: MapInstance;\n}\n\nconst CanvasInLayer = memo<CanvasPropsAndMap>(({ map, ...props }) => {\n  const layerProps = useCanvasInLayer(props, fromLngLat, map);\n  /* @ts-ignore */ // eslint-disable-line @typescript-eslint/ban-ts-comment\n  return <Layer {...layerProps} />\n})\nCanvasInLayer.displayName = 'CanvasInLayer';\n\nconst CanvasOverlay = memo<CanvasPropsAndMap>(({ map, id, beforeId, ...props }) => {\n  const [onRender, setOnRender] = useState<(mx: Matrix4Tuple) => void>();\n\n  const render = useFunction<Render>((_gl, mx) => {\n    if (!onRender) return;\n    onRender(mx as Matrix4Tuple);\n  })\n\n  return <>\n    {/* @ts-ignore */}\n    <Layer id={id} beforeId={beforeId} type=\"custom\" render={render} />\n    <InitCanvasFC {...props}\n      setOnRender={setOnRender}\n      map={map}\n      fromLngLat={fromLngLat}\n    />\n  </>\n})\nCanvasInLayer.displayName = 'CanvasInLayer';"],"names":[],"mappings":";;;;;;;;;AAcA,OAAO,KAAK;AAEZ,MAAM,aAAa,mBAAmB;AAG/B,MAAM,SAAS,KAAkB,CAAC,EAAE,SAAS,GAAG,YAAY;AAEjE,QAAM,MAAM,OAAA,EAAS,QAAS,OAAO;AAErC,SACG,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,WAAY,oBAAA,eAAA,EAAc,KAAW,GAAG,MAAO,CAAA;AAAA,IAC/C,CAAC,WAAW,oBAAC,eAAc,EAAA,KAAW,GAAG,OAAO;AAAA,EACnD,EAAA,CAAA;AACF,CAAC;AACD,OAAO,cAAc;AAMrB,MAAM,gBAAgB,KAAwB,CAAC,EAAE,KAAK,GAAG,YAAY;AACnE,QAAM,aAAa,iBAAiB,OAAO,YAAY,GAAG;AAEnD,SAAA,oBAAC,OAAO,EAAA,GAAG,WAAY,CAAA;AAChC,CAAC;AACD,cAAc,cAAc;AAE5B,MAAM,gBAAgB,KAAwB,CAAC,EAAE,KAAK,IAAI,UAAU,GAAG,YAAY;AACjF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAqC;AAErE,QAAM,SAAS,YAAoB,CAAC,KAAK,OAAO;AAC9C,QAAI,CAAC;AAAU;AACf,aAAS,EAAkB;AAAA,EAAA,CAC5B;AAED,SAEE,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,oBAAC,OAAM,EAAA,IAAQ,UAAoB,MAAK,UAAS,QAAgB;AAAA,IACjE;AAAA,MAAC;AAAA,MAAA;AAAA,QAAc,GAAG;AAAA,QAChB;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AACF,CAAC;AACD,cAAc,cAAc;"}

package/dist/maplibre/types/core/canvas-in-layer/use-canvas-in-layer.d.ts

@@ -5,7 +5,11 @@ export declare function useCanvasInLayer(props: CanvasProps, fromLngLat: FromLng
     readonly id: string | undefined;
     readonly beforeId: string | undefined;
     readonly onRemove: () => void;
-    readonly render: (_gl: WebGL2RenderingContext, projViewMx: number[]) => void;
+    readonly render: (_gl: WebGL2RenderingContext, projViewMx: number[] | {
+        defaultProjectionData: {
+            mainMatrix: Record<string, number>;
+        };
+    }) => void;
     readonly type: "custom";
     readonly renderingMode: "3d";
 };

package/dist/maplibre/types/core/canvas-in-layer/use-render.d.ts

@@ -9,4 +9,8 @@ export declare function useRender({ map, origin, useThree, frameloop, r3m, }: {
     useThree: UseBoundStore<RootState>;
     frameloop?: 'always' | 'demand';
     r3m: R3M;
-}): (_gl: WebGL2RenderingContext, projViewMx: number[]) => void;
+}): (_gl: WebGL2RenderingContext, projViewMx: number[] | {
+    defaultProjectionData: {
+        mainMatrix: Record<string, number>;
+    };
+}) => void;

package/dist/maplibre/types/core/generic-map.d.ts

@@ -34,8 +34,8 @@ export interface MapInstance {
     /** MapLibre only */
     getPixelRatio?: () => number;
     triggerRepaint(): void;
-    on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
-    off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
+    on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): void;
+    off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): void;
 }
 /** Generic interface of Mapbox/Maplibre `MapEventType` */
 export type MapEventType = {

package/dist/maplibre/types/{mapbox → maplibre}/canvas.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { CanvasProps } from "../api/canvas-props";
-/** react`-three-fiber` canvas inside `Mapbox` */
+/** `react-three-fiber` canvas inside `MapLibre` */
 export declare const Canvas: import("react").NamedExoticComponent<CanvasProps>;

package/dist/maplibre/types/maplibre.index.d.ts

@@ -1,4 +1,4 @@
 import type { Map } from 'maplibre-gl';
 export * from './api';
-export * from './mapbox/canvas';
+export * from './maplibre/canvas';
 export declare const useMap: () => Map;

package/dist/types/core/canvas-in-layer/use-canvas-in-layer.d.ts

@@ -5,7 +5,11 @@ export declare function useCanvasInLayer(props: CanvasProps, fromLngLat: FromLng
     readonly id: string | undefined;
     readonly beforeId: string | undefined;
     readonly onRemove: () => void;
-    readonly render: (_gl: WebGL2RenderingContext, projViewMx: number[]) => void;
+    readonly render: (_gl: WebGL2RenderingContext, projViewMx: number[] | {
+        defaultProjectionData: {
+            mainMatrix: Record<string, number>;
+        };
+    }) => void;
     readonly type: "custom";
     readonly renderingMode: "3d";
 };

package/dist/types/core/canvas-in-layer/use-render.d.ts

@@ -9,4 +9,8 @@ export declare function useRender({ map, origin, useThree, frameloop, r3m, }: {
     useThree: UseBoundStore<RootState>;
     frameloop?: 'always' | 'demand';
     r3m: R3M;
-}): (_gl: WebGL2RenderingContext, projViewMx: number[]) => void;
+}): (_gl: WebGL2RenderingContext, projViewMx: number[] | {
+    defaultProjectionData: {
+        mainMatrix: Record<string, number>;
+    };
+}) => void;

package/dist/types/core/generic-map.d.ts

@@ -34,8 +34,8 @@ export interface MapInstance {
     /** MapLibre only */
     getPixelRatio?: () => number;
     triggerRepaint(): void;
-    on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
-    off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
+    on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): void;
+    off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): void;
 }
 /** Generic interface of Mapbox/Maplibre `MapEventType` */
 export type MapEventType = {

package/dist/types/mapbox/canvas.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { CanvasProps } from "../api/canvas-props";
-/** react`-three-fiber` canvas inside `Mapbox` */
+/** `react-three-fiber` canvas inside `Mapbox` */
 export declare const Canvas: import("react").NamedExoticComponent<CanvasProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-three-map",
-  "version": "0.8.2",
+  "version": "1.0.0-next.0",
   "description": "Use react-three-fiber inside MapLibre and Mapbox",
   "main": "dist/cjs/main.js",
   "module": "dist/es/main.mjs",
@@ -53,11 +53,11 @@
     "happy-dom": "^10.5.2",
     "leva": "^0.9.35",
     "luxon": "^3.3.0",
-    "mapbox-gl": "^3.1.2",
-    "maplibre-gl": "^3.2.0",
+    "mapbox-gl": "^3.9.4",
+    "maplibre-gl": "4.7.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-map-gl": "^7.1.7",
+    "react-map-gl": "^8.0.1",
     "suncalc": "^1.9.0",
     "suspend-react": "^0.1.3",
     "three": "^0.159.0",
@@ -70,10 +70,10 @@
   },
   "peerDependencies": {
     "@react-three/fiber": ">=8.13",
-    "mapbox-gl": ">=2.15",
-    "maplibre-gl": ">=3.2",
+    "mapbox-gl": ">=3.5.0",
+    "maplibre-gl": ">=4.0.0",
     "react": ">=18.0",
-    "react-map-gl": ">=7.1",
+    "react-map-gl": ">=8.0.0",
     "three": ">=0.133"
   },
   "peerDependenciesMeta": {

package/stories/package.json

@@ -15,11 +15,11 @@
     "@types/tz-lookup": "^6.1.2",
     "leva": "^0.9.35",
     "luxon": "^3.4.4",
-    "mapbox-gl": "^3.1.2",
-    "maplibre-gl": "^3.2.0",
+    "mapbox-gl": "^3.9.4",
+    "maplibre-gl": "^5.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-map-gl": "^7.1.7",
+    "react-map-gl": "^8.0.1",
     "react-three-map": "^0.8.1",
     "suncalc": "^1.9.0",
     "three": "^0.159.0",