chore: deck.gl 9.2 upgrade & loaders.gl, luma.gl upgrades

docs/upgrade-guide-v3.3.md

@@ -0,0 +1,168 @@
+# Upgrade Guide — kepler.gl 3.3
+
+kepler.gl 3.3 upgrades the rendering stack from **deck.gl 8 / luma.gl 8** to **deck.gl 9 / luma.gl 9**. This is a major dependency upgrade that changes how WebGL resources, shaders, and rendering parameters are handled under the hood. Most kepler.gl users will not need to change application code, but library consumers who extend layers, interact with the WebGL context directly, or depend on internal types should review this guide.
+
+## Dependency Changes
+
+| Package group   | Old version | New version |
+| --------------- | ----------- | ----------- |
+| `@deck.gl/*`    | 8.9.x       | **9.2.11**  |
+| `@luma.gl/*`    | 8.x         | **9.2.6**   |
+| `@loaders.gl/*` | 3.x / 4.3.2 | **4.3.4**   |
+| `math.gl`       | —           | **^4.1.0**  |
+| `typescript`    | 4.7.2       | **5.6.3**   |
+
+### New dependencies
+
+| Package                              | Version | Notes                                         |
+| ------------------------------------ | ------- | --------------------------------------------- |
+| `@deck.gl-community/editable-layers` | 9.2.8   | Replaces `@nebula.gl/layers` for editor layer |
+| `@deck.gl-community/layers`          | 9.2.8   | Community layers package                      |
+| `@deck.gl/widgets`                   | 9.2.11  | New deck.gl 9 module                          |
+| `@luma.gl/effects`                   | 9.2.6   | New luma.gl 9 module                          |
+
+### Removed dependencies
+
+| Package                             | Notes                                            |
+| ----------------------------------- | ------------------------------------------------ |
+| `hubble.gl/core`, `hubble.gl/react` | Removed from kepler.gl                           |
+| `@nebula.gl/layers`                 | Replaced by `@deck.gl-community/editable-layers` |
+
+### Yarn resolutions
+
+All `@deck.gl/*`, `@loaders.gl/*`, and `@luma.gl/*` packages are pinned via resolutions. If your project has its own resolutions for these packages, make sure they are consistent with the versions above.
+
+---
+
+## Breaking Changes for Library Consumers
+
+### 1. WebGL context callback renamed
+
+The `DeckGL` component callback changed from `onWebGLInitialized` to `onDeviceInitialized`. The callback now receives a luma.gl `Device` instead of a raw `WebGLRenderingContext`.
+
+If you override `MapContainerFactory` and rely on the initialization callback:
+
+```diff
+- onWebGLInitialized={gl => this._onDeckInitialized(gl)}
++ onDeviceInitialized={device => this._onDeckInitialized(device)}
+```
+
+### 2. Layer blending is now declarative
+
+In deck.gl 8, kepler.gl called `setParameters(gl, {...})` with GL constants before each render to set blending mode. In deck.gl 9, blending is set via a `parameters` prop on `DeckGL` using WebGPU-style string constants.
+
+**Old (removed):**
+
+```js
+import {setParameters} from '@luma.gl/core';
+setParameters(gl, {
+  blendFunc: [GL.SRC_ALPHA, GL.ONE_MINUS_SRC_ALPHA],
+  blendEquation: GL.FUNC_ADD
+});
+```
+
+**New:**
+
+```js
+import {getLayerBlendingParameters} from '@kepler.gl/utils';
+<DeckGL parameters={getLayerBlendingParameters(layerBlending)} />;
+```
+
+If your application calls `setParameters` for blending, migrate to the `parameters` prop instead.
+
+### 3. GPU parameter constants
+
+A new module `@kepler.gl/constants` exports WebGPU-style string constants that replace the old GL enum values throughout the codebase:
+
+- `BLEND_FACTOR` — `'zero'`, `'one'`, `'src-alpha'`, etc.
+- `BLEND_OPERATION` — `'add'`, `'subtract'`, etc.
+- `FILTER_MODE` — `'nearest'`, `'linear'`
+- `ADDRESS_MODE` — `'clamp-to-edge'`, `'repeat'`, `'mirror-repeat'`
+- `TEXTURE_FORMAT` — `'r8uint'`, `'rgba8unorm'`, etc.
+- `TOPOLOGY` — `'triangle-list'`, `'triangle-strip'`, etc.
+
+If you referenced GL constants for kepler.gl layer configuration, switch to these string constants.
+
+### 4. `setLayerBlending` removed
+
+The function `setLayerBlending` (previously exported from `@kepler.gl/utils`) is removed. Use `getLayerBlendingParameters` instead, which returns a `parameters` object for deck.gl 9.
+
+### 5. Aggregation layers use deck.gl 9 native CPU aggregation
+
+`GridLayer` and `HexagonLayer` now use deck.gl 9's built-in CPU aggregation (`gpuAggregation: false`) instead of kepler.gl's custom `CPUAggregator`. This means:
+
+- `onSetColorDomain` / `onSetElevationDomain` callbacks now receive `[min, max]` number arrays instead of `{domain, aggregatedBins}` objects.
+- Per-bin filtering is applied at the accessor level (`getColorValue`, `getElevationValue`) rather than via a `_filterData` prop.
+- `ClusterLayer` still uses the internal `CPUAggregator`.
+
+If you listen to domain callbacks on aggregation layers, update your handler to accept the new format:
+
+```diff
+- onSetColorDomain={({domain, aggregatedBins}) => { ... }}
++ onSetColorDomain={domain => { /* domain is [min, max] */ }}
+```
+
+### 6. Shader changes — GLSL 300 es and UBOs
+
+All custom shaders now target **GLSL 300 es**:
+
+- `attribute` → `in`, `varying` → `in`/`out`
+- `texture2D()` → `texture()`
+- `gl_FragColor` → explicit `out vec4 fragColor`
+- Uniforms are declared inside **Uniform Buffer Objects** (UBOs) instead of standalone `uniform` declarations. For example, `uniform float opacity` becomes a field inside a `uniform layerUniforms { float opacity; } layer;` block, accessed as `layer.opacity`.
+
+If you have custom layers that inject into kepler.gl's shaders (via `editShader` or shader hooks), review the new GLSL 300 es syntax.
+
+### 7. Model API changes in custom layers
+
+If you extend any kepler.gl layer and interact with `Model` objects:
+
+```diff
+- model.setUniforms({elevationScale: 1.0});
++ model.shaderInputs.setProps({elevationScale: {elevationScale: 1.0}});
+```
+
+```diff
+- model.draw();
++ model.draw(this.context.renderPass);
+```
+
+The `_getModel(gl)` pattern is replaced — models are now created from `super._getModel()` and modified via `model.setGeometry()`.
+
+### 8. `PickInfo` type change
+
+A custom `PickInfo<DataT>` type is now defined in `@kepler.gl/types`. This type is a relaxed version of deck.gl 9's `PickingInfo` to work around stricter generic inference in the `DeckGL` component's callback types. If you import `PickingInfo` from `@deck.gl/core`, be aware that kepler.gl's callbacks use `PickInfo` instead.
+
+### 9. `MapViewState` type is locally defined
+
+`MapViewState` is no longer imported from `@deck.gl/core/typed`. It is defined locally in `@kepler.gl/types` (from `reducers.d.ts`). If you were importing it from deck.gl, import from `@kepler.gl/types` instead.
+
+### 10. Editor layers migrated to `@deck.gl-community`
+
+The editor layer (`EditableGeoJsonLayer`) is now imported from `@deck.gl-community/editable-layers` instead of `@nebula.gl/layers`. If you extend or replace the editor layer factory, update your imports.
+
+### 11. Lighting effect API changes
+
+`CustomDeckLightingEffect` (kepler.gl's lighting/shadow effect) has been rewritten for deck.gl 9:
+
+- `preRender` → `setup(context)` / `cleanup(context)` lifecycle
+- `getModuleParameters` → `getShaderModuleProps`
+- Shadow module uses UBO-based uniforms with `uniformTypes` declarations
+- `Texture2D` constructor → `device.createTexture()`
+- `addDefaultShaderModule` / `removeDefaultShaderModule` API on `deck` instance
+
+If you extend `CustomDeckLightingEffect`, review the new lifecycle methods.
+
+### 12. `MapView` with `legacyMeterSizes`
+
+kepler.gl now creates `MapView` with `{legacyMeterSizes: true}` to preserve backward-compatible meter-based sizing behavior from deck.gl 8.
+
+---
+
+## Runtime Patches
+
+kepler.gl 3.3 applies two patches to work around deck.gl 9 / luma.gl 9 issues. These are applied automatically and require no action, but are documented for awareness:
+
+1. **`patchDeckRendererForPostProcessing()`** — Patches `DeckRenderer._resizeRenderBuffers` to add depth-stencil attachments to post-processing framebuffers. In deck.gl 9, FBOs are created without depth buffers by default, which breaks depth testing when post-processing effects are active.
+
+2. **`patchPipelineValidation()`** — Patches `WEBGLRenderPipeline._getLinkStatus` to suppress false-positive "mixed sampler type" validation errors in luma.gl 9. This patch is applied lazily only when a raster tile layer is instantiated.

jest.config.js

@@ -22,7 +22,7 @@ const config = {
   // Some libraries (even if transitive) are transitioning to ESM and need additional transpilation. Relevant issues:
   // - tiny-sdf: https://github.com/visgl/deck.gl/issues/7735
   transformIgnorePatterns: [
-    '/node_modules\\/(?!(.*@mapbox\\/tiny-sdf\\.*|@loaders\\.gl))',
+    '/node_modules\\/(?!(.*@mapbox\\/tiny-sdf\\.*|@loaders\\.gl|@deck\\.gl|@deck\\.gl-community|@luma\\.gl|preact))',
     '\\.pnp\\.[^\\/]+$'
   ]
 };

package.json

@@ -101,13 +101,12 @@
     "umd"
   ],
   "dependencies": {
-    "@deck.gl/mapbox": "^8.9.27",
-    "@hubble.gl/core": "1.4.0",
-    "@hubble.gl/react": "1.4.0",
+    "@deck.gl/mapbox": "^9.2.11",
     "@kepler.gl/components": "3.2.6",
-    "@loaders.gl/polyfills": "^4.3.2",
+    "@loaders.gl/polyfills": "^4.3.4",
     "@types/mapbox__geo-viewport": "^0.4.1",
     "html-webpack-plugin": "^4.3.0",
+    "math.gl": "^4.1.0",
     "monaco-editor": "^0.52.0",
     "typedoc": "^0.19.2"
   },
@@ -133,10 +132,12 @@
     "@babel/runtime": "^7.12.1",
     "@babel/traverse": "^7.12.1",
     "@cfaester/enzyme-adapter-react-18": "^0.7.0",
-    "@deck.gl/test-utils": "^8.9.27",
-    "@loaders.gl/polyfills": "^4.3.2",
-    "@luma.gl/test-utils": "^8.5.20",
-    "@nebula.gl/layers": "1.0.2-alpha.1",
+    "@deck.gl-community/editable-layers": "9.2.8",
+    "@deck.gl-community/layers": "9.2.8",
+    "@deck.gl/test-utils": "^9.2.11",
+    "@loaders.gl/polyfills": "^4.3.4",
+    "@luma.gl/test-utils": "^9.2.6",
+    "@luma.gl/webgpu": "^9.2.6",
     "@open-wc/webpack-import-meta-loader": "0.4.7",
     "@probe.gl/env": "^3.5.0",
     "@probe.gl/test-utils": "^3.5.0",
@@ -210,7 +211,7 @@
     "tape": "^4.9.2",
     "tape-catch": "^1.0.6",
     "typedoc-plugin-markdown": "^3.0.11",
-    "typescript": "4.7.2",
+    "typescript": "5.6.3",
     "url-loader": "^4.1.1",
     "usehooks-ts": "^3.1.0",
     "watchify": "^3.6.1",
@@ -223,25 +224,36 @@
     "webpack-stats-plugin": "^0.2.1"
   },
   "resolutions": {
-    "@loaders.gl/core": "4.3.2",
-    "@loaders.gl/csv": "4.3.2",
-    "@loaders.gl/draco": "4.3.2",
-    "@loaders.gl/gltf": "4.3.2",
-    "@loaders.gl/json": "4.3.2",
-    "@loaders.gl/loader-utils": "4.3.2",
-    "@loaders.gl/polyfills": "4.3.2",
-    "@loaders.gl/arrow": "4.3.2",
-    "@loaders.gl/parquet": "4.3.2",
-    "@loaders.gl/gis": "4.3.2",
-    "@loaders.gl/schema": "4.3.2",
-    "@loaders.gl/wkt": "4.3.2",
-    "@loaders.gl/wms": "4.3.2",
-    "@luma.gl/constants": "8.5.21",
-    "@luma.gl/core": "8.5.21",
-    "@luma.gl/experimental": "8.5.21",
-    "@luma.gl/shadertools": "8.5.21",
-    "@luma.gl/test-utils": "8.5.21",
-    "@luma.gl/webgl": "8.5.21",
+    "@deck.gl/aggregation-layers": "9.2.11",
+    "@deck.gl/core": "9.2.11",
+    "@deck.gl/extensions": "9.2.11",
+    "@deck.gl/geo-layers": "9.2.11",
+    "@deck.gl/layers": "9.2.11",
+    "@deck.gl/mesh-layers": "9.2.11",
+    "@deck.gl/mapbox": "9.2.11",
+    "@deck.gl/react": "9.2.11",
+    "@deck.gl/widgets": "9.2.11",
+    "@loaders.gl/core": "4.3.4",
+    "@loaders.gl/csv": "4.3.4",
+    "@loaders.gl/draco": "4.3.4",
+    "@loaders.gl/gltf": "4.3.4",
+    "@loaders.gl/json": "4.3.4",
+    "@loaders.gl/loader-utils": "4.3.4",
+    "@loaders.gl/polyfills": "4.3.4",
+    "@loaders.gl/arrow": "4.3.4",
+    "@loaders.gl/parquet": "4.3.4",
+    "@loaders.gl/gis": "4.3.4",
+    "@loaders.gl/schema": "4.3.4",
+    "@loaders.gl/wkt": "4.3.4",
+    "@loaders.gl/wms": "4.3.4",
+    "@luma.gl/constants": "9.2.6",
+    "@luma.gl/core": "9.2.6",
+    "@luma.gl/effects": "9.2.6",
+    "@luma.gl/engine": "9.2.6",
+    "@luma.gl/shadertools": "9.2.6",
+    "@luma.gl/test-utils": "9.2.6",
+    "@luma.gl/webgl": "9.2.6",
+    "@luma.gl/webgpu": "9.2.6",
     "@types/lodash": "4.17.5",
     "browserslist": "^4.17.0",
     "caniuse-lite": "^1.0.30001636",

scripts/fix-dependencies.sh

@@ -8,6 +8,16 @@
 # We use tail to avoid the first line of the the output which is the command itself
 yarn babel node_modules/@mapbox/tiny-sdf/index.js | tail -n +2 > node_modules/@mapbox/tiny-sdf/index.cjs
 
+# Make the CJS build resolvable by require() - patch package.json to add exports and remove ESM-only type
+node -e "
+const fs = require('fs');
+const p = 'node_modules/@mapbox/tiny-sdf/package.json';
+const pkg = JSON.parse(fs.readFileSync(p, 'utf8'));
+pkg.exports = { '.': { require: './index.cjs', import: './index.js', default: './index.cjs' } };
+pkg.main = './index.cjs';
+fs.writeFileSync(p, JSON.stringify(pkg, null, 2));
+"
+
 # Patch for an issue with react-virtualized output having an invalid import
 # https://github.com/bvaughn/react-virtualized/issues/1212
 if [[ -f "node_modules/react-virtualized/dist/es/WindowScroller/utils/onScroll.js" ]]; then

src/actions/package.json

@@ -30,7 +30,7 @@
     "umd"
   ],
   "dependencies": {
-    "@deck.gl/core": "^8.9.27",
+    "@deck.gl/core": "^9.2.11",
     "@kepler.gl/cloud-providers": "3.2.6",
     "@kepler.gl/constants": "3.2.6",
     "@kepler.gl/layers": "3.2.6",

src/actions/src/vis-state-actions.ts

@@ -2,7 +2,6 @@
 // Copyright contributors to the kepler.gl project
 
 // vis-state-reducer
-import {PickInfo} from '@deck.gl/core/lib/deck';
 import {default as ActionTypes} from './action-types';
 import {FileCacheItem} from '@kepler.gl/processors';
 import {Layer, LayerBaseConfig} from '@kepler.gl/layers';
@@ -11,6 +10,7 @@ import {
   AddDataToMapPayload,
   ValueOf,
   Merge,
+  PickInfo,
   RGBColor,
   NestedPartial,
   LayerVisConfig,
@@ -1112,7 +1112,7 @@ export function toggleFilterFeature(
 }
 
 export type OnLayerHoverUpdaterAction = {
-  info: PickInfo<any> | null;
+  info: PickInfo | null;
   mapIndex?: number;
 };
 /**
@@ -1124,7 +1124,7 @@ export type OnLayerHoverUpdaterAction = {
  * @public
  */
 export function onLayerHover(
-  info: PickInfo<any> | null,
+  info: PickInfo | null,
   mapIndex?: number
 ): Merge<OnLayerHoverUpdaterAction, {type: typeof ActionTypes.LAYER_HOVER}> {
   return {
@@ -1135,7 +1135,7 @@ export function onLayerHover(
 }
 
 export type OnLayerClickUpdaterAction = {
-  info: PickInfo<any> | null;
+  info: PickInfo | null;
 };
 /**
  * Trigger layer click event with clicked object
@@ -1145,7 +1145,7 @@ export type OnLayerClickUpdaterAction = {
  * @public
  */
 export function onLayerClick(
-  info: PickInfo<any> | null
+  info: PickInfo | null
 ): Merge<OnLayerClickUpdaterAction, {type: typeof ActionTypes.LAYER_CLICK}> {
   return {
     type: ActionTypes.LAYER_CLICK,

src/ai-assistant/src/components/ai-assistant-component.tsx

@@ -72,8 +72,11 @@ export function AiAssistantComponent() {
   const instructions = `${INSTRUCTIONS}\n\n${datasetMetaData}`;
 
   // generate ideas from LLM
-  const {temporaryPrompt, restartChat: libraryRestartChat} = useAssistant({...assistantProps, instructions});
-
+  const {temporaryPrompt, restartChat: libraryRestartChat} = useAssistant({
+    ...assistantProps,
+    instructions
+  });
+
   const restartChatRef = useRef(libraryRestartChat);
   restartChatRef.current = libraryRestartChat;
 
@@ -104,13 +107,13 @@ export function AiAssistantComponent() {
 
   const onRestartAssistant = async () => {
     dispatch(updateAiAssistantMessages([]));
-    
+
     try {
       await restartChatRef.current();
     } catch (e) {
       console.error('Error restarting chat:', e);
     }
-    
+
     setRestartKey(prev => prev + 1);
   };