@deck.gl/carto 8.10.0-alpha.2 → 8.10.0-alpha.4

package/package.json

@@ -2,7 +2,7 @@
   "name": "@deck.gl/carto",
   "description": "CARTO official integration with Deck.gl. Build geospatial applications using CARTO and Deck.gl.",
   "license": "MIT",
-  "version": "8.10.0-alpha.2",
+  "version": "8.10.0-alpha.4",
   "publishConfig": {
     "access": "public"
   },
@@ -28,15 +28,17 @@
   ],
   "sideEffects": false,
   "scripts": {
-    "build-bundle": "ocular-bundle ./bundle.ts",
+    "build-bundle": "npm run build-workers && ocular-bundle ./bundle.ts",
+    "build-workers": "npm run build-worker --cartoloader=RasterTile && npm run build-worker --cartoloader=SpatialTile && npm run build-worker --cartoloader=VectorTile",
+    "build-worker": "esbuild src/workers/carto$npm_config_cartoloader.ts --bundle --outfile=dist/carto$npm_config_cartoloader-worker.js --define:__VERSION__=\\\"$npm_package_version\\\"",
     "prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env=dev"
   },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
-    "@loaders.gl/gis": "^3.4.2",
-    "@loaders.gl/loader-utils": "^3.4.2",
-    "@loaders.gl/mvt": "^3.4.2",
-    "@loaders.gl/tiles": "^3.4.2",
+    "@loaders.gl/gis": "^3.4.13",
+    "@loaders.gl/loader-utils": "^3.4.13",
+    "@loaders.gl/mvt": "^3.4.13",
+    "@loaders.gl/tiles": "^3.4.13",
     "@luma.gl/constants": "^8.5.20",
     "@math.gl/web-mercator": "^3.6.2",
     "cartocolor": "^4.0.2",
@@ -50,7 +52,7 @@
     "quadbin": "^0.1.9"
   },
   "devDependencies": {
-    "@loaders.gl/schema": "^3.4.2",
+    "@loaders.gl/schema": "^3.4.13",
     "@types/d3-array": "^3.0.2",
     "@types/d3-color": "^1.4.2",
     "@types/d3-scale": "^3.0.0"
@@ -61,7 +63,7 @@
     "@deck.gl/extensions": "^8.0.0",
     "@deck.gl/geo-layers": "^8.0.0",
     "@deck.gl/layers": "^8.0.0",
-    "@loaders.gl/core": "^3.4.2"
+    "@loaders.gl/core": "^3.4.13"
   },
-  "gitHead": "888ee50db498da4b42697854e79e46cdbb881470"
+  "gitHead": "8195f543d7673ab0d6755f316c4ad516cff4f049"
 }

package/src/api/layer-map.ts

@@ -16,12 +16,12 @@ import moment from 'moment-timezone';
 import {Accessor, Layer, _ConstructorOf as ConstructorOf} from '@deck.gl/core';
 import {CPUGridLayer, HeatmapLayer, HexagonLayer} from '@deck.gl/aggregation-layers';
 import {GeoJsonLayer} from '@deck.gl/layers';
-import {H3HexagonLayer, MVTLayer} from '@deck.gl/geo-layers';
+import {H3HexagonLayer} from '@deck.gl/geo-layers';
 
-import CartoTileLayer from '../layers/carto-tile-layer';
 import H3TileLayer from '../layers/h3-tile-layer';
 import QuadbinTileLayer from '../layers/quadbin-tile-layer';
 import RasterTileLayer from '../layers/raster-tile-layer';
+import VectorTileLayer from '../layers/vector-tile-layer';
 import {MapType, TILE_FORMATS, TileFormat} from './maps-api-common';
 import {assert, createBinaryProxy} from '../utils';
 import {
@@ -204,7 +204,7 @@ export function layerFromTileDataset(
   formatTiles: TileFormat | null = TILE_FORMATS.MVT,
   scheme: string,
   type?: MapType
-): typeof CartoTileLayer | typeof H3TileLayer | typeof MVTLayer | typeof QuadbinTileLayer {
+): typeof VectorTileLayer | typeof H3TileLayer | typeof QuadbinTileLayer {
   if (type === 'raster') {
     return RasterTileLayer;
   }
@@ -214,12 +214,8 @@ export function layerFromTileDataset(
   if (scheme === 'quadbin') {
     return QuadbinTileLayer;
   }
-  if (formatTiles === 'mvt') {
-    return MVTLayer;
-  }
 
-  // formatTiles === BINARY|JSON|GEOJSON
-  return CartoTileLayer;
+  return VectorTileLayer;
 }
 
 function getTileLayer(dataset: MapDataset, basePropMap) {

package/src/api/maps-api-common.ts

@@ -27,7 +27,6 @@ export const GEO_COLUMN_SUPPORT: MapType[] = [MAP_TYPES.QUERY, MAP_TYPES.TABLE];
 // AVAILABLE FORMATS
 export const FORMATS = {
   GEOJSON: 'geojson',
-  NDJSON: 'ndjson',
   TILEJSON: 'tilejson',
   JSON: 'json'
 } as const;

package/src/api/maps-v3-client.ts

@@ -1,3 +1,4 @@
+/* eslint-disable camelcase */
 /**
  * Maps API Client for Carto 3
  */
@@ -32,7 +33,7 @@ import {assert} from '../utils';
 
 const MAX_GET_LENGTH = 8192;
 const DEFAULT_CLIENT = 'deck-gl-carto';
-const V3_MINOR_VERSION = '3.1';
+const V3_MINOR_VERSION = '3.2';
 
 export type Headers = Record<string, string>;
 interface RequestParams {
@@ -112,9 +113,9 @@ async function requestData({
 }: RequestParams & {
   format: Format;
 }): Promise<Response | unknown> {
-  if (format === FORMATS.NDJSON) {
-    return request({method, url, accessToken, body, errorContext});
-  }
+  // if (format === FORMATS.NDJSON) {
+  //   return request({method, url, accessToken, body, errorContext});
+  // }
 
   const data = await requestJson<any>({method, url, accessToken, body, errorContext});
   return data.rows ? data.rows : data;
@@ -395,7 +396,7 @@ async function _fetchDataUrl({
     assert(url, `Format ${format} not available`);
   } else {
     // guess map format
-    const prioritizedFormats = [FORMATS.GEOJSON, FORMATS.JSON, FORMATS.NDJSON, FORMATS.TILEJSON];
+    const prioritizedFormats = [FORMATS.GEOJSON, FORMATS.JSON, FORMATS.TILEJSON];
     for (const f of prioritizedFormats) {
       url = getUrlFromMetadata(metadata, f);
       if (url) {

package/src/index.ts

@@ -1,10 +1,10 @@
 export {getDefaultCredentials, setDefaultCredentials} from './config';
-export {default as CartoLayer} from './layers/carto-layer';
-export {default as _CartoTileLayer} from './layers/carto-tile-layer';
-export {default as _H3TileLayer} from './layers/h3-tile-layer';
+export {default as CartoLayer} from './layers/carto-layer'; // <-- REMOVE in v9
+export {default as VectorTileLayer} from './layers/vector-tile-layer';
+export {default as H3TileLayer} from './layers/h3-tile-layer';
 export {default as _PointLabelLayer} from './layers/point-label-layer';
-export {default as _QuadbinTileLayer} from './layers/quadbin-tile-layer';
-export {default as _RasterTileLayer} from './layers/raster-tile-layer';
+export {default as QuadbinTileLayer} from './layers/quadbin-tile-layer';
+export {default as RasterTileLayer} from './layers/raster-tile-layer';
 export {default as BASEMAP} from './basemap';
 export {default as colorBins} from './style/color-bins-style';
 export {default as colorCategories} from './style/color-categories-style';
@@ -22,3 +22,32 @@ export {
 } from './api';
 export type {APIErrorContext, QueryParameters} from './api';
 export type {CartoLayerProps} from './layers/carto-layer';
+
+export {
+  cartoH3QuerySource,
+  cartoH3TableSource,
+  cartoH3TilesetSource,
+  cartoRasterSource,
+  cartoQuadbinQuerySource,
+  cartoQuadbinTableSource,
+  cartoQuadbinTilesetSource,
+  cartoVectorQuerySource,
+  cartoVectorTableSource,
+  cartoVectorTilesetSource,
+  SOURCE_DEFAULTS
+} from './sources';
+export type {
+  CartoTilejsonResult,
+  CartoH3QuerySourceOptions,
+  CartoH3TableSourceOptions,
+  CartoH3TilesetSourceOptions,
+  CartoRasterSourceOptions,
+  CartoQuadbinQuerySourceOptions,
+  CartoQuadbinTableSourceOptions,
+  CartoQuadbinTilesetSourceOptions,
+  CartoVectorQuerySourceOptions,
+  CartoVectorTableSourceOptions,
+  CartoVectorTilesetSourceOptions,
+  GeojsonResult,
+  JsonResult
+} from './sources';

package/src/layers/h3-tile-layer.ts

@@ -1,16 +1,11 @@
-import {
-  CompositeLayer,
-  CompositeLayerProps,
-  Layer,
-  LayersList,
-  UpdateParameters,
-  DefaultProps
-} from '@deck.gl/core';
+import {CompositeLayer, CompositeLayerProps, Layer, LayersList, DefaultProps} from '@deck.gl/core';
 import {H3HexagonLayer} from '@deck.gl/geo-layers';
 import H3Tileset2D, {getHexagonResolution} from './h3-tileset-2d';
 import SpatialIndexTileLayer from './spatial-index-tile-layer';
+import {TilejsonPropType, CartoTilejsonResult} from '../sources/common';
+import {injectAccessToken} from './utils';
 
-const renderSubLayers = props => {
+const renderSubLayers = (props: H3HexagonLayerProps) => {
   const {data} = props;
   const {index} = props.tile;
   if (!data || !data.length) return null;
@@ -23,7 +18,8 @@ const renderSubLayers = props => {
 };
 
 const defaultProps: DefaultProps<H3HexagonLayerProps> = {
-  aggregationResLevel: 4
+  aggregationResLevel: 4,
+  data: TilejsonPropType
 };
 
 /** All properties supported by H3TileLayer. */
@@ -34,8 +30,8 @@ export type H3TileLayerProps<DataT = any> = _H3TileLayerProps<DataT> & Composite
 type H3HexagonLayerProps<DataT = any> = Record<string, any>;
 
 /** Properties added by H3TileLayer. */
-type _H3TileLayerProps<DataT> = H3HexagonLayerProps<DataT> & {
-  data: string;
+type _H3TileLayerProps<DataT> = Omit<H3HexagonLayerProps<DataT>, 'data'> & {
+  data: null | CartoTilejsonResult | Promise<CartoTilejsonResult>;
   aggregationResLevel?: number;
 };
 
@@ -45,30 +41,24 @@ export default class H3TileLayer<DataT = any, ExtraPropsT extends {} = {}> exten
   static layerName = 'H3TileLayer';
   static defaultProps = defaultProps;
 
-  state!: {
-    tileJSON: any;
-    data: any;
-  };
-
   initializeState(): void {
     H3HexagonLayer._checkH3Lib();
-    this.setState({data: null, tileJSON: null});
   }
 
-  updateState({changeFlags}: UpdateParameters<this>): void {
-    if (changeFlags.dataChanged) {
-      let {data} = this.props;
-      const tileJSON = data;
-      data = (tileJSON as any).tiles;
-      this.setState({data, tileJSON});
-    }
+  getLoadOptions(): any {
+    const loadOptions = super.getLoadOptions() || {};
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    injectAccessToken(loadOptions, tileJSON.accessToken);
+    loadOptions.cartoSpatialTile = {...loadOptions.cartoSpatialTile, scheme: 'h3'};
+    return loadOptions;
   }
 
   renderLayers(): Layer | null | LayersList {
-    const {data, tileJSON} = this.state;
-    let minresolution = parseInt(tileJSON.minresolution);
-    let maxresolution = parseInt(tileJSON.maxresolution);
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    if (!tileJSON) return null;
 
+    const {tiles: data} = tileJSON;
+    let {minresolution, maxresolution} = tileJSON;
     // Convert Mercator zooms provided in props into H3 res levels
     // and clip into valid range provided from the tilejson
     if (this.props.minZoom) {
@@ -87,20 +77,17 @@ export default class H3TileLayer<DataT = any, ExtraPropsT extends {} = {}> exten
     // 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,
-        // @ts-expect-error Tileset2D should be generic over TileIndex
-        TilesetClass: H3Tileset2D,
+        // 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(),
-          cartoSpatialTile: {scheme: 'h3'},
-          mimeType: 'application/vnd.carto-spatial-tile'
-        }
+        loadOptions: this.getLoadOptions()
       })
     ];
   }

package/src/layers/quadbin-tile-layer.ts

@@ -1,15 +1,10 @@
-import {
-  CompositeLayer,
-  CompositeLayerProps,
-  Layer,
-  LayersList,
-  UpdateParameters,
-  DefaultProps
-} from '@deck.gl/core';
+import {CompositeLayer, CompositeLayerProps, Layer, LayersList, DefaultProps} from '@deck.gl/core';
 import QuadbinLayer, {QuadbinLayerProps} from './quadbin-layer';
 import QuadbinTileset2D from './quadbin-tileset-2d';
 import SpatialIndexTileLayer from './spatial-index-tile-layer';
 import {hexToBigInt} from 'quadbin';
+import {TilejsonPropType, CartoTilejsonResult} from '../sources/common';
+import {injectAccessToken} from './utils';
 
 export const renderSubLayers = props => {
   const {data} = props;
@@ -21,7 +16,8 @@ export const renderSubLayers = props => {
 };
 
 const defaultProps: DefaultProps<QuadbinTileLayerProps> = {
-  aggregationResLevel: 6
+  aggregationResLevel: 6,
+  data: TilejsonPropType
 };
 
 /** All properties supported by QuadbinTileLayer. */
@@ -29,8 +25,8 @@ export type QuadbinTileLayerProps<DataT = any> = _QuadbinTileLayerProps<DataT> &
   CompositeLayerProps;
 
 /** Properties added by QuadbinTileLayer. */
-type _QuadbinTileLayerProps<DataT> = QuadbinLayerProps<DataT> & {
-  data: string;
+type _QuadbinTileLayerProps<DataT> = Omit<QuadbinLayerProps<DataT>, 'data'> & {
+  data: null | CartoTilejsonResult | Promise<CartoTilejsonResult>;
   aggregationResLevel?: number;
 };
 
@@ -41,27 +37,21 @@ export default class QuadbinTileLayer<
   static layerName = 'QuadbinTileLayer';
   static defaultProps = defaultProps;
 
-  state!: {
-    tileJSON: any;
-    data: any;
-  };
-  initializeState(): void {
-    this.setState({data: null, tileJSON: null});
-  }
-
-  updateState({changeFlags}: UpdateParameters<this>): void {
-    if (changeFlags.dataChanged) {
-      let {data} = this.props;
-      const tileJSON = data;
-      data = (tileJSON as any).tiles;
-      this.setState({data, tileJSON});
-    }
+  getLoadOptions(): any {
+    const loadOptions = super.getLoadOptions() || {};
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    injectAccessToken(loadOptions, tileJSON.accessToken);
+    loadOptions.cartoSpatialTile = {...loadOptions.cartoSpatialTile, scheme: 'quadbin'};
+    return loadOptions;
   }
 
   renderLayers(): Layer | null | LayersList {
-    const {data, tileJSON} = this.state;
-    const maxZoom = parseInt(tileJSON?.maxresolution);
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    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,
@@ -69,11 +59,7 @@ export default class QuadbinTileLayer<
         TilesetClass: QuadbinTileset2D as any,
         renderSubLayers,
         maxZoom,
-        loadOptions: {
-          ...this.getLoadOptions(),
-          cartoSpatialTile: {scheme: 'quadbin'},
-          mimeType: 'application/vnd.carto-spatial-tile'
-        }
+        loadOptions: this.getLoadOptions()
       })
     ];
   }

package/src/layers/raster-tile-layer.ts

@@ -1,13 +1,9 @@
-import {
-  CompositeLayer,
-  CompositeLayerProps,
-  Layer,
-  LayersList,
-  UpdateParameters
-} from '@deck.gl/core';
+import {CompositeLayer, CompositeLayerProps, DefaultProps, Layer, LayersList} from '@deck.gl/core';
 import RasterLayer, {RasterLayerProps} from './raster-layer';
 import QuadbinTileset2D from './quadbin-tileset-2d';
 import SpatialIndexTileLayer from './spatial-index-tile-layer';
+import {TilejsonPropType, CartoTilejsonResult} from '../sources/common';
+import {injectAccessToken} from './utils';
 
 export const renderSubLayers = props => {
   const tileIndex = props.tile?.index?.q;
@@ -15,12 +11,16 @@ export const renderSubLayers = props => {
   return new RasterLayer(props, {tileIndex});
 };
 
+const defaultProps: DefaultProps<RasterTileLayerProps> = {
+  data: TilejsonPropType
+};
+
 /** All properties supported by RasterTileLayer. */
 export type RasterTileLayerProps<DataT = any> = _RasterTileLayerProps<DataT> & CompositeLayerProps;
 
 /** Properties added by RasterTileLayer. */
-type _RasterTileLayerProps<DataT> = RasterLayerProps<DataT> & {
-  data: string;
+type _RasterTileLayerProps<DataT> = Omit<RasterLayerProps<DataT>, 'data'> & {
+  data: null | CartoTilejsonResult | Promise<CartoTilejsonResult>;
 };
 
 export default class RasterTileLayer<
@@ -28,27 +28,22 @@ export default class RasterTileLayer<
   ExtraProps extends {} = {}
 > extends CompositeLayer<ExtraProps & Required<_RasterTileLayerProps<DataT>>> {
   static layerName = 'RasterTileLayer';
-  static defaultProps = {};
+  static defaultProps = defaultProps;
 
-  state!: {tileJSON: any; data: any};
-  initializeState(): void {
-    this.setState({data: null, tileJSON: null});
-  }
-
-  updateState({changeFlags}: UpdateParameters<this>): void {
-    if (changeFlags.dataChanged) {
-      let {data} = this.props;
-      const tileJSON = data;
-      data = (tileJSON as any).tiles;
-      this.setState({data, tileJSON});
-    }
+  getLoadOptions(): any {
+    const loadOptions = super.getLoadOptions() || {};
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    injectAccessToken(loadOptions, tileJSON.accessToken);
+    return loadOptions;
   }
 
   renderLayers(): Layer | null | LayersList {
-    const {data, tileJSON} = this.state;
-    const minZoom = parseInt(tileJSON?.minzoom);
-    const maxZoom = parseInt(tileJSON?.maxzoom);
+    const tileJSON = this.props.data as CartoTilejsonResult;
+    if (!tileJSON) return null;
+
+    const {tiles: data, minzoom: minZoom, maxzoom: maxZoom} = tileJSON;
     return [
+      // @ts-ignore
       new SpatialIndexTileLayer(this.props, {
         id: `raster-tile-layer-${this.props.id}`,
         data,
@@ -56,7 +51,8 @@ export default class RasterTileLayer<
         TilesetClass: QuadbinTileset2D as any,
         renderSubLayers,
         minZoom,
-        maxZoom
+        maxZoom,
+        loadOptions: this.getLoadOptions()
       })
     ];
   }

package/src/layers/schema/carto-raster-tile-loader.ts

@@ -2,20 +2,37 @@ import {LoaderOptions, LoaderWithParser} from '@loaders.gl/loader-utils';
 
 import {TileReader} from './carto-raster-tile';
 import {parsePbf} from './tile-loader-utils';
+import {getWorkerUrl} from '../../utils';
 import {NumericProps, Properties} from './spatialjson-utils';
 
+const VERSION = typeof __VERSION__ !== 'undefined' ? __VERSION__ : 'latest';
+const id = 'cartoRasterTile';
+
+type CartoRasterTileLoaderOptions = LoaderOptions & {
+  cartoRasterTile?: {
+    workerUrl: string;
+  };
+};
+
+const DEFAULT_OPTIONS: CartoRasterTileLoaderOptions = {
+  cartoRasterTile: {
+    workerUrl: getWorkerUrl(id, VERSION)
+  }
+};
+
 const CartoRasterTileLoader: LoaderWithParser = {
   name: 'CARTO Raster Tile',
-  version: '1',
-  id: 'cartoRasterTile',
+  version: VERSION,
+  id,
   module: 'carto',
   extensions: ['pbf'],
   mimeTypes: ['application/vnd.carto-raster-tile'],
   category: 'geometry',
-  worker: false,
-  parse: async (arrayBuffer, options) => parseCartoRasterTile(arrayBuffer, options),
+  parse: async (arrayBuffer, options?: CartoRasterTileLoaderOptions) =>
+    parseCartoRasterTile(arrayBuffer, options),
   parseSync: parseCartoRasterTile,
-  options: {}
+  worker: true,
+  options: DEFAULT_OPTIONS
 };
 
 export type Raster = {
@@ -27,7 +44,10 @@ export type Raster = {
   };
 };
 
-function parseCartoRasterTile(arrayBuffer: ArrayBuffer, options?: LoaderOptions): Raster | null {
+function parseCartoRasterTile(
+  arrayBuffer: ArrayBuffer,
+  options?: CartoRasterTileLoaderOptions
+): Raster | null {
   if (!arrayBuffer) return null;
   const tile = parsePbf(arrayBuffer, TileReader);
   const {bands, blockHeight, blockWidth} = tile;

package/src/layers/schema/carto-spatial-tile-loader.ts

@@ -2,35 +2,49 @@ import {LoaderOptions, LoaderWithParser} from '@loaders.gl/loader-utils';
 
 import {Tile, TileReader} from './carto-spatial-tile';
 import {parsePbf} from './tile-loader-utils';
+import {getWorkerUrl} from '../../utils';
 import {IndexScheme, binaryToSpatialjson, SpatialJson} from './spatialjson-utils';
 
+const VERSION = typeof __VERSION__ !== 'undefined' ? __VERSION__ : 'latest';
+const id = 'cartoSpatialTile';
+
+type CartoSpatialTileLoaderOptions = LoaderOptions & {
+  cartoSpatialTile?: {
+    scheme: IndexScheme;
+    workerUrl: string;
+  };
+};
+
+const DEFAULT_OPTIONS: CartoSpatialTileLoaderOptions = {
+  cartoSpatialTile: {
+    scheme: 'quadbin',
+    workerUrl: getWorkerUrl(id, VERSION)
+  }
+};
+
 const CartoSpatialTileLoader: LoaderWithParser = {
   name: 'CARTO Spatial Tile',
-  version: '1',
-  id: 'cartoSpatialTile',
+  version: VERSION,
+  id,
   module: 'carto',
   extensions: ['pbf'],
   mimeTypes: ['application/vnd.carto-spatial-tile'],
   category: 'geometry',
-  worker: false,
-  parse: async (arrayBuffer, options) => parseCartoSpatialTile(arrayBuffer, options),
+  parse: async (arrayBuffer, options?: CartoSpatialTileLoaderOptions) =>
+    parseCartoSpatialTile(arrayBuffer, options),
   parseSync: parseCartoSpatialTile,
-  options: {
-    cartoSpatialTile: {
-      scheme: 'quadbin'
-    } as {scheme: IndexScheme}
-  }
+  worker: true,
+  options: DEFAULT_OPTIONS
 };
 
 function parseCartoSpatialTile(
   arrayBuffer: ArrayBuffer,
-  options?: LoaderOptions
+  options?: CartoSpatialTileLoaderOptions
 ): SpatialJson | null {
   if (!arrayBuffer) return null;
   const tile: Tile = parsePbf(arrayBuffer, TileReader);
 
   const {cells} = tile;
-  // @ts-expect-error
   const scheme = options?.cartoSpatialTile?.scheme;
   const data = {cells, scheme};
 

package/src/layers/schema/carto-tile.ts

@@ -8,7 +8,7 @@ interface KeyValueObject {
 
 class KeyValueObjectReader {
   static read(pbf, end?: number): KeyValueObject {
-    return pbf.readFields(KeyValueObjectReader._readField, {key: '', value: ''}, end);
+    return pbf.readFields(KeyValueObjectReader._readField, {key: '', value: null}, end);
   }
   static _readField(this: void, tag: number, obj: KeyValueObject, pbf) {
     if (tag === 1) obj.key = pbf.readString();