CARTO: Add Layer exports to ease subclassing (#9235)

modules/carto/src/index.ts

@@ -2,13 +2,16 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
+// CARTO Layers
 import {default as ClusterTileLayer} from './layers/cluster-tile-layer';
 import {default as H3TileLayer} from './layers/h3-tile-layer';
 import {default as HeatmapTileLayer} from './layers/heatmap-tile-layer';
 import {default as _PointLabelLayer} from './layers/point-label-layer';
 import {default as QuadbinTileLayer} from './layers/quadbin-tile-layer';
 import {default as RasterTileLayer} from './layers/raster-tile-layer';
 import {default as VectorTileLayer} from './layers/vector-tile-layer';
+
+// Exports for playground/bindings
 const CARTO_LAYERS = {
   ClusterTileLayer,
   H3TileLayer,
@@ -29,6 +32,24 @@ export {
   VectorTileLayer
 };
 
+// Internal Layers
+export {default as _QuadbinLayer} from './layers/quadbin-layer';
+export {default as _RasterLayer} from './layers/raster-layer';
+export {default as _SpatialIndexTileLayer} from './layers/spatial-index-tile-layer';
+
+// Types
+export type {ClusterTileLayerProps} from './layers/cluster-tile-layer';
+export type {H3TileLayerProps} from './layers/h3-tile-layer';
+export type {HeatmapTileLayerProps} from './layers/heatmap-tile-layer';
+export type {PointLabelLayerProps} from './layers/point-label-layer';
+export type {QuadbinLayerProps} from './layers/quadbin-layer';
+export type {QuadbinTileLayerProps} from './layers/quadbin-tile-layer';
+export type {RasterLayerProps} from './layers/raster-layer';
+export type {RasterTileLayerProps} from './layers/raster-tile-layer';
+export type {SpatialIndexTileLayerProps} from './layers/spatial-index-tile-layer';
+export type {VectorTileLayerProps} from './layers/vector-tile-layer';
+
+// Helpers
 export {
   default as BASEMAP,
   GOOGLE_BASEMAPS as _GOOGLE_BASEMAPS,

modules/carto/src/layers/h3-tile-layer.ts

@@ -54,7 +54,7 @@ export default class H3TileLayer<DataT = any, ExtraPropsT extends {} = {}> exten
     return loadOptions;
   }
 
-  renderLayers(): Layer | null | LayersList {
+  renderLayers(): SpatialIndexTileLayer | null {
     const tileJSON = this.props.data as TilejsonResult;
     if (!tileJSON) return null;
 
@@ -75,21 +75,19 @@ export default class H3TileLayer<DataT = any, ExtraPropsT extends {} = {}> exten
       );
     }
 
+    const SubLayerClass = this.getSubLayerClass('spatial-index-tile', SpatialIndexTileLayer);
     // The naming is unfortunate, but minZoom & maxZoom in the context
     // of a Tileset2D refer to the resolution levels, not the Mercator zooms
-    return [
-      // @ts-ignore
-      new SpatialIndexTileLayer(this.props, {
-        id: `h3-tile-layer-${this.props.id}`,
-        data,
-        // TODO: Tileset2D should be generic over TileIndex type
-        TilesetClass: H3Tileset2D as any,
-        renderSubLayers,
-        // minZoom and maxZoom are H3 resolutions, however we must use this naming as that is what the Tileset2D class expects
-        minZoom: minresolution,
-        maxZoom: maxresolution,
-        loadOptions: this.getLoadOptions()
-      })
-    ];
+    return new SubLayerClass(this.props, {
+      id: `h3-tile-layer-${this.props.id}`,
+      data,
+      // TODO: Tileset2D should be generic over TileIndex type
+      TilesetClass: H3Tileset2D as any,
+      renderSubLayers,
+      // minZoom and maxZoom are H3 resolutions, however we must use this naming as that is what the Tileset2D class expects
+      minZoom: minresolution,
+      maxZoom: maxresolution,
+      loadOptions: this.getLoadOptions()
+    });
   }
 }

modules/carto/src/layers/quadbin-tile-layer.ts

@@ -50,22 +50,20 @@ export default class QuadbinTileLayer<
     return loadOptions;
   }
 
-  renderLayers(): Layer | null | LayersList {
+  renderLayers(): SpatialIndexTileLayer | null {
     const tileJSON = this.props.data as TilejsonResult;
     if (!tileJSON) return null;
 
     const {tiles: data, maxresolution: maxZoom} = tileJSON;
-    return [
-      // @ts-ignore
-      new SpatialIndexTileLayer(this.props, {
-        id: `quadbin-tile-layer-${this.props.id}`,
-        data,
-        // TODO: Tileset2D should be generic over TileIndex type
-        TilesetClass: QuadbinTileset2D as any,
-        renderSubLayers,
-        maxZoom,
-        loadOptions: this.getLoadOptions()
-      })
-    ];
+    const SubLayerClass = this.getSubLayerClass('spatial-index-tile', SpatialIndexTileLayer);
+    return new SubLayerClass(this.props, {
+      id: `quadbin-tile-layer-${this.props.id}`,
+      data,
+      // TODO: Tileset2D should be generic over TileIndex type
+      TilesetClass: QuadbinTileset2D as any,
+      renderSubLayers,
+      maxZoom,
+      loadOptions: this.getLoadOptions()
+    });
   }
 }

modules/carto/src/layers/raster-tile-layer.ts

@@ -50,18 +50,16 @@ export default class RasterTileLayer<
     if (!tileJSON) return null;
 
     const {tiles: data, minzoom: minZoom, maxzoom: maxZoom} = tileJSON;
-    return [
-      // @ts-ignore
-      new TileLayer(this.props, {
-        id: `raster-tile-layer-${this.props.id}`,
-        data,
-        // TODO: Tileset2D should be generic over TileIndex type
-        TilesetClass: QuadbinTileset2D as any,
-        renderSubLayers,
-        minZoom,
-        maxZoom,
-        loadOptions: this.getLoadOptions()
-      })
-    ];
+    const SubLayerClass = this.getSubLayerClass('tile', TileLayer);
+    return new SubLayerClass(this.props, {
+      id: `raster-tile-layer-${this.props.id}`,
+      data,
+      // TODO: Tileset2D should be generic over TileIndex type
+      TilesetClass: QuadbinTileset2D as any,
+      renderSubLayers,
+      minZoom,
+      maxZoom,
+      loadOptions: this.getLoadOptions()
+    });
   }
 }