From 63b158d7f12543ba265512f1efca37f09cc0153c Mon Sep 17 00:00:00 2001
From: Chris Gervang <chris@gervang.com>
Date: Fri, 20 Dec 2024 15:34:48 -0800
Subject: [PATCH 1/2] feat(json) support for deck.gl widgets

---
 examples/playground/index.html                    | 1 +
 examples/playground/json-examples/3d-heatmap.json | 8 ++++++++
 examples/playground/src/configuration.js          | 3 +++
 3 files changed, 12 insertions(+)

diff --git a/examples/playground/index.html b/examples/playground/index.html
index ce2f2c8d24d..cf6c1bb620d 100644
--- a/examples/playground/index.html
+++ b/examples/playground/index.html
@@ -5,6 +5,7 @@
   <title>deck.gl Playground</title>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
+  <link href="https://unpkg.com/deck.gl@^9.0.0/dist/stylesheet.css" rel='stylesheet' />
   <style>
     body {margin: 0; font-family: sans-serif; overflow: hidden;}
     #app {width: 100vw; height: 100vh; display: flex; flex-direction: row; align-items: stretch;}
diff --git a/examples/playground/json-examples/3d-heatmap.json b/examples/playground/json-examples/3d-heatmap.json
index d32aca63eba..e247023ff78 100644
--- a/examples/playground/json-examples/3d-heatmap.json
+++ b/examples/playground/json-examples/3d-heatmap.json
@@ -43,5 +43,13 @@
         [209, 55, 78]
       ]
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
diff --git a/examples/playground/src/configuration.js b/examples/playground/src/configuration.js
index c7d7a172728..fd701e4d489 100644
--- a/examples/playground/src/configuration.js
+++ b/examples/playground/src/configuration.js
@@ -16,6 +16,7 @@ import {
   colorCategories,
   colorContinuous
 } from '@deck.gl/carto';
+import * as Widgets from '@deck.gl/widgets';
 
 import {COORDINATE_SYSTEM} from '@deck.gl/core';
 import {GL as GLConstants} from '@luma.gl/constants';
@@ -39,6 +40,8 @@ export default {
     CARTO_LAYERS,
     GeoLayers,
     MeshLayers,
+    // Support `@deck.gl/widgets` Widgets
+    Widgets,
     // Any non-standard views
     {}
   ),

From 2bee7f3382eed0f990ae213f9037b43098bcb53d Mon Sep 17 00:00:00 2001
From: Chris Gervang <chris@gervang.com>
Date: Mon, 23 Dec 2024 15:46:34 -0800
Subject: [PATCH 2/2] Add more examples

---
 examples/playground/json-examples/3d-tiles-new-york.json  | 8 ++++++++
 examples/playground/json-examples/3d-tiles-royal.json     | 8 ++++++++
 examples/playground/json-examples/3d-tiles-st-helens.json | 8 ++++++++
 examples/playground/json-examples/carto.json              | 8 ++++++++
 examples/playground/json-examples/dot-text.json           | 8 ++++++++
 examples/playground/json-examples/geojson.json            | 8 ++++++++
 examples/playground/json-examples/line.json               | 8 ++++++++
 examples/playground/json-examples/scatterplot.json        | 8 ++++++++
 examples/playground/json-examples/screen-grid.json        | 8 ++++++++
 examples/playground/json-examples/tagmap.json             | 8 ++++++++
 examples/playground/json-examples/us-map.json             | 8 ++++++++
 11 files changed, 88 insertions(+)

diff --git a/examples/playground/json-examples/3d-tiles-new-york.json b/examples/playground/json-examples/3d-tiles-new-york.json
index 6ddb3114816..6f05ad4a022 100644
--- a/examples/playground/json-examples/3d-tiles-new-york.json
+++ b/examples/playground/json-examples/3d-tiles-new-york.json
@@ -31,5 +31,13 @@
         }
       }
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
diff --git a/examples/playground/json-examples/3d-tiles-royal.json b/examples/playground/json-examples/3d-tiles-royal.json
index 49e0b4771a3..7cc93eb05bb 100644
--- a/examples/playground/json-examples/3d-tiles-royal.json
+++ b/examples/playground/json-examples/3d-tiles-royal.json
@@ -26,5 +26,13 @@
       "getPointColor": [0, 125, 200, 255],
       "data": "https://raw.githubusercontent.com/visgl/deck.gl-data/master/3d-tiles/RoyalExhibitionBuilding/tileset.json"
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
diff --git a/examples/playground/json-examples/3d-tiles-st-helens.json b/examples/playground/json-examples/3d-tiles-st-helens.json
index 33e0dcc741e..4d298cf5c43 100644
--- a/examples/playground/json-examples/3d-tiles-st-helens.json
+++ b/examples/playground/json-examples/3d-tiles-st-helens.json
@@ -30,5 +30,13 @@
         }
       }
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
diff --git a/examples/playground/json-examples/carto.json b/examples/playground/json-examples/carto.json
index 6988866cc6c..cc7633c3a4f 100644
--- a/examples/playground/json-examples/carto.json
+++ b/examples/playground/json-examples/carto.json
@@ -32,5 +32,13 @@
       "pointRadiusMinPixels": 2,
       "stroked": false
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/dot-text.json b/examples/playground/json-examples/dot-text.json
index 0d0fe0ba443..7c342dbd8b7 100644
--- a/examples/playground/json-examples/dot-text.json
+++ b/examples/playground/json-examples/dot-text.json
@@ -36,5 +36,13 @@
         }
       ]
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/geojson.json b/examples/playground/json-examples/geojson.json
index ba44abd3333..e730b5571cc 100644
--- a/examples/playground/json-examples/geojson.json
+++ b/examples/playground/json-examples/geojson.json
@@ -38,5 +38,13 @@
         255
       ]
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/line.json b/examples/playground/json-examples/line.json
index 23e6342f23a..7735fab6ad0 100644
--- a/examples/playground/json-examples/line.json
+++ b/examples/playground/json-examples/line.json
@@ -47,5 +47,13 @@
         192
       ]
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/scatterplot.json b/examples/playground/json-examples/scatterplot.json
index 63b216cdb05..eac5d22a002 100644
--- a/examples/playground/json-examples/scatterplot.json
+++ b/examples/playground/json-examples/scatterplot.json
@@ -30,5 +30,13 @@
       ],
       "getRadius": 1
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/screen-grid.json b/examples/playground/json-examples/screen-grid.json
index 8e111866358..bf2813153cb 100644
--- a/examples/playground/json-examples/screen-grid.json
+++ b/examples/playground/json-examples/screen-grid.json
@@ -65,5 +65,13 @@
       "getPosition": "@@=-",
       "gpuAggregation": true
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/tagmap.json b/examples/playground/json-examples/tagmap.json
index aa3821e691d..828e98f0c2a 100644
--- a/examples/playground/json-examples/tagmap.json
+++ b/examples/playground/json-examples/tagmap.json
@@ -30,5 +30,13 @@
       ],
       "getSize": 12
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file
diff --git a/examples/playground/json-examples/us-map.json b/examples/playground/json-examples/us-map.json
index b59088557a4..268a7cfae0c 100644
--- a/examples/playground/json-examples/us-map.json
+++ b/examples/playground/json-examples/us-map.json
@@ -34,5 +34,13 @@
         180
       ]
     }
+  ],
+  "widgets": [
+    {
+      "@@type": "ZoomWidget"
+    },
+    {
+      "@@type": "CompassWidget"
+    }
   ]
 }
\ No newline at end of file