@deck.gl/carto 9.1.8 → 9.1.10

package/dist/index.cjs

@@ -80,7 +80,110 @@ var import_core6 = require("@deck.gl/core");
 
 // dist/layers/cluster-utils.js
 var import_quadbin = require("quadbin");
+var import_core2 = require("@deck.gl/core");
+
+// dist/utils.js
 var import_core = require("@deck.gl/core");
+function assert(condition, message) {
+  import_core.log.assert(condition, message);
+}
+function createBinaryProxy(data, index) {
+  const { properties, numericProps } = data;
+  return new Proxy(properties[index] || {}, {
+    get(target, property) {
+      if (property in numericProps) {
+        return numericProps[property].value[index];
+      }
+      return target[property];
+    },
+    has(target, property) {
+      return property in numericProps || property in target;
+    },
+    ownKeys(target) {
+      return [...Object.keys(numericProps), ...Reflect.ownKeys(target)];
+    },
+    getOwnPropertyDescriptor(target, prop) {
+      return { enumerable: true, configurable: true };
+    }
+  });
+}
+function getWorkerUrl(id5, version) {
+  return `https://unpkg.com/@deck.gl/carto@${version}/dist/${id5}-worker.js`;
+}
+function scaleIdentity() {
+  let unknown;
+  function scale(x) {
+    return x === null ? unknown : x;
+  }
+  scale.invert = scale;
+  scale.domain = scale.range = (d) => d;
+  scale.unknown = (u) => {
+    if (u) {
+      unknown = u;
+    }
+    return unknown;
+  };
+  scale.copy = () => {
+    const scaleCopy = scaleIdentity();
+    scaleCopy.unknown(unknown);
+    return scaleCopy;
+  };
+  return scale;
+}
+var EMPTY_UINT16ARRAY = new Uint16Array();
+var EMPTY_BINARY_PROPS = {
+  positions: { value: new Float32Array(), size: 2 },
+  properties: [],
+  numericProps: {},
+  featureIds: { value: EMPTY_UINT16ARRAY, size: 1 },
+  globalFeatureIds: { value: EMPTY_UINT16ARRAY, size: 1 }
+};
+function createEmptyBinary() {
+  return {
+    shape: "binary-feature-collection",
+    points: {
+      type: "Point",
+      ...EMPTY_BINARY_PROPS
+    },
+    lines: {
+      type: "LineString",
+      pathIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
+      ...EMPTY_BINARY_PROPS
+    },
+    polygons: {
+      type: "Polygon",
+      polygonIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
+      primitivePolygonIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
+      ...EMPTY_BINARY_PROPS
+    }
+  };
+}
+function createBinaryPointFeature(positions, featureIds, globalFeatureIds, numericProps, properties, size = 2) {
+  return {
+    type: "Point",
+    positions: { value: new Float32Array(positions), size },
+    featureIds: { value: new Uint16Array(featureIds), size: 1 },
+    globalFeatureIds: { value: new Uint32Array(globalFeatureIds), size: 1 },
+    numericProps,
+    properties
+  };
+}
+function initializeNumericProps(numPoints, sourceProps) {
+  const numericProps = {};
+  if (sourceProps) {
+    Object.keys(sourceProps).forEach((prop) => {
+      numericProps[prop] = { value: new Float32Array(numPoints), size: 1 };
+    });
+  }
+  return numericProps;
+}
+function copyNumericProps(sourceProps, targetProps, sourceIndex, targetIndex) {
+  Object.keys(sourceProps).forEach((prop) => {
+    targetProps[prop].value[targetIndex] = sourceProps[prop].value[sourceIndex];
+  });
+}
+
+// dist/layers/cluster-utils.js
 function aggregateTile(tile, tileAggregationCache, aggregationLevels, properties = [], getPosition, getWeight) {
   var _a;
   if (!tile.content)
@@ -141,7 +244,7 @@ function extractAggregationProperties(tile) {
   for (const name of Object.keys(tile.content[0].properties)) {
     let aggregation = name.split("_").pop().toLowerCase();
     if (!validAggregations.includes(aggregation)) {
-      import_core.log.warn(`No valid aggregation present in ${name} property`)();
+      import_core2.log.warn(`No valid aggregation present in ${name} property`)();
       aggregation = "any";
     }
     properties.push({ name, aggregation });
@@ -161,14 +264,6 @@ function computeAggregationStats(data, properties) {
   }
   return stats;
 }
-var EMPTY_UINT16ARRAY = new Uint16Array();
-var EMPTY_BINARY_PROPS = {
-  positions: { value: new Float32Array(), size: 2 },
-  properties: [],
-  numericProps: {},
-  featureIds: { value: EMPTY_UINT16ARRAY, size: 1 },
-  globalFeatureIds: { value: EMPTY_UINT16ARRAY, size: 1 }
-};
 function clustersToBinary(data) {
   const positions = new Float32Array(data.length * 2);
   const featureIds = new Uint16Array(data.length);
@@ -177,26 +272,8 @@ function clustersToBinary(data) {
     featureIds[i] = i;
   }
   return {
-    shape: "binary-feature-collection",
-    points: {
-      type: "Point",
-      positions: { value: positions, size: 2 },
-      properties: data,
-      numericProps: {},
-      featureIds: { value: featureIds, size: 1 },
-      globalFeatureIds: { value: featureIds, size: 1 }
-    },
-    lines: {
-      type: "LineString",
-      pathIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
-      ...EMPTY_BINARY_PROPS
-    },
-    polygons: {
-      type: "Polygon",
-      polygonIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
-      primitivePolygonIndices: { value: EMPTY_UINT16ARRAY, size: 1 },
-      ...EMPTY_BINARY_PROPS
-    }
+    ...createEmptyBinary(),
+    points: createBinaryPointFeature(positions, featureIds, featureIds, {}, data)
   };
 }
 
@@ -496,55 +573,6 @@ function parsePbf(buffer, TileReader5) {
   return tile;
 }
 
-// dist/utils.js
-var import_core2 = require("@deck.gl/core");
-function assert(condition, message) {
-  import_core2.log.assert(condition, message);
-}
-function createBinaryProxy(data, index) {
-  const { properties, numericProps } = data;
-  return new Proxy(properties[index] || {}, {
-    get(target, property) {
-      if (property in numericProps) {
-        return numericProps[property].value[index];
-      }
-      return target[property];
-    },
-    has(target, property) {
-      return property in numericProps || property in target;
-    },
-    ownKeys(target) {
-      return [...Object.keys(numericProps), ...Reflect.ownKeys(target)];
-    },
-    getOwnPropertyDescriptor(target, prop) {
-      return { enumerable: true, configurable: true };
-    }
-  });
-}
-function getWorkerUrl(id5, version) {
-  return `https://unpkg.com/@deck.gl/carto@${version}/dist/${id5}-worker.js`;
-}
-function scaleIdentity() {
-  let unknown;
-  function scale(x) {
-    return x === null ? unknown : x;
-  }
-  scale.invert = scale;
-  scale.domain = scale.range = (d) => d;
-  scale.unknown = (u) => {
-    if (u) {
-      unknown = u;
-    }
-    return unknown;
-  };
-  scale.copy = () => {
-    const scaleCopy = scaleIdentity();
-    scaleCopy.unknown(unknown);
-    return scaleCopy;
-  };
-  return scale;
-}
-
 // dist/layers/schema/spatialjson-utils.js
 var import_quadbin4 = require("quadbin");
 function binaryToSpatialjson(binary) {
@@ -563,7 +591,7 @@ function binaryToSpatialjson(binary) {
 }
 
 // dist/layers/schema/carto-spatial-tile-loader.js
-var VERSION = true ? "9.1.8" : "latest";
+var VERSION = true ? "9.1.10" : "latest";
 var id = "cartoSpatialTile";
 var DEFAULT_OPTIONS = {
   cartoSpatialTile: {
@@ -599,14 +627,29 @@ var carto_spatial_tile_loader_default = CartoSpatialTileLoader;
 // dist/layers/utils.js
 var import_core3 = require("@deck.gl/core");
 var import_core4 = require("@deck.gl/core");
-function injectAccessToken(loadOptions, accessToken) {
-  var _a, _b, _c;
-  if (!((_b = (_a = loadOptions == null ? void 0 : loadOptions.fetch) == null ? void 0 : _a.headers) == null ? void 0 : _b.Authorization)) {
-    loadOptions.fetch = {
-      ...loadOptions.fetch,
-      headers: { ...(_c = loadOptions.fetch) == null ? void 0 : _c.headers, Authorization: `Bearer ${accessToken}` }
-    };
+function mergeLoadOptions(loadOptions, additionalOptions, depth = 0) {
+  if (!loadOptions) {
+    return additionalOptions;
+  }
+  if (!additionalOptions) {
+    return loadOptions;
+  }
+  if (depth > 10) {
+    return additionalOptions;
+  }
+  const result = { ...loadOptions };
+  for (const key in additionalOptions) {
+    const value = additionalOptions[key];
+    if (value === loadOptions || value === additionalOptions) {
+      continue;
+    }
+    if (typeof value === "object" && value !== null) {
+      result[key] = mergeLoadOptions(loadOptions[key], value, depth + 1);
+    } else {
+      result[key] = value;
+    }
   }
+  return result;
 }
 function mergeBoundaryData(geometry, properties) {
   const mapping = {};
@@ -754,11 +797,11 @@ ClusterGeoJsonLayer.layerName = "ClusterGeoJsonLayer";
 ClusterGeoJsonLayer.defaultProps = defaultProps;
 var ClusterTileLayer = class extends import_core6.CompositeLayer {
   getLoadOptions() {
-    const loadOptions = super.getLoadOptions() || {};
     const tileJSON = this.props.data;
-    injectAccessToken(loadOptions, tileJSON.accessToken);
-    loadOptions.cartoSpatialTile = { ...loadOptions.cartoSpatialTile, scheme: "quadbin" };
-    return loadOptions;
+    return mergeLoadOptions(super.getLoadOptions(), {
+      fetch: { headers: { Authorization: `Bearer ${tileJSON.accessToken}` } },
+      cartoSpatialTile: { scheme: "quadbin" }
+    });
   }
   renderLayers() {
     const tileJSON = this.props.data;
@@ -976,11 +1019,11 @@ var H3TileLayer = class extends import_core8.CompositeLayer {
     import_geo_layers5.H3HexagonLayer._checkH3Lib();
   }
   getLoadOptions() {
-    const loadOptions = super.getLoadOptions() || {};
     const tileJSON = this.props.data;
-    injectAccessToken(loadOptions, tileJSON.accessToken);
-    loadOptions.cartoSpatialTile = { ...loadOptions.cartoSpatialTile, scheme: "h3" };
-    return loadOptions;
+    return mergeLoadOptions(super.getLoadOptions(), {
+      fetch: { headers: { Authorization: `Bearer ${tileJSON.accessToken}` } },
+      cartoSpatialTile: { scheme: "h3" }
+    });
   }
   renderLayers() {
     const tileJSON = this.props.data;
@@ -1316,11 +1359,11 @@ var defaultProps5 = {
 };
 var QuadbinTileLayer = class extends import_core10.CompositeLayer {
   getLoadOptions() {
-    const loadOptions = super.getLoadOptions() || {};
     const tileJSON = this.props.data;
-    injectAccessToken(loadOptions, tileJSON.accessToken);
-    loadOptions.cartoSpatialTile = { ...loadOptions.cartoSpatialTile, scheme: "quadbin" };
-    return loadOptions;
+    return mergeLoadOptions(super.getLoadOptions(), {
+      fetch: { headers: { Authorization: `Bearer ${tileJSON.accessToken}` } },
+      cartoSpatialTile: { scheme: "quadbin" }
+    });
   }
   renderLayers() {
     const tileJSON = this.props.data;
@@ -1476,7 +1519,9 @@ var HeatmapTileLayer = class extends import_core11.CompositeLayer {
     };
     let tileZ = 0;
     let maxDensity = 0;
-    const tiles = [...this.state.tiles].filter((t) => t.isVisible && t.content);
+    const loadedTiles = [...this.state.tiles].filter((t) => t.content);
+    const visibleTiles = loadedTiles.filter((t) => t.isVisible);
+    const tiles = visibleTiles.length ? visibleTiles : loadedTiles;
     for (const tile of tiles) {
       const cell = tile.content[0];
       const unitDensity = unitDensityForCell(cell.id);
@@ -1638,7 +1683,12 @@ var PointLabelLayer = class extends import_core12.CompositeLayer {
     return backgroundPadding;
   }
   renderTextLayer(id5, { updateTriggers: updateTriggersOverride = {}, ...props }) {
+    var _a, _b;
     const { data, characterSet, fontFamily, fontSettings, fontWeight, outlineColor, outlineWidth, sizeScale, radiusScale, getAlignmentBaseline, getColor, getPosition, getTextAnchor, updateTriggers } = this.props;
+    if (sizeScale < 2) {
+      const propName = ((_b = (_a = this.parent) == null ? void 0 : _a.props) == null ? void 0 : _b.textSizeScale) ? "textSizeScale" : "sizeScale";
+      import_core12.log.warn(`${propName} has small value (${sizeScale}). Note getTextSize is not supported on PointLabelLayer`)();
+    }
     return new EnhancedTextLayer(this.getSubLayerProps({
       id: id5,
       data,
@@ -1952,7 +2002,7 @@ var TileReader3 = class {
 };
 
 // dist/layers/schema/carto-raster-tile-loader.js
-var VERSION2 = true ? "9.1.8" : "latest";
+var VERSION2 = true ? "9.1.10" : "latest";
 var id2 = "cartoRasterTile";
 var DEFAULT_OPTIONS2 = {
   cartoRasterTile: {
@@ -2014,10 +2064,10 @@ var PostProcessTileLayer = class extends PostProcessModifier(import_geo_layers7.
 };
 var RasterTileLayer = class extends import_core14.CompositeLayer {
   getLoadOptions() {
-    const loadOptions = super.getLoadOptions() || {};
     const tileJSON = this.props.data;
-    injectAccessToken(loadOptions, tileJSON.accessToken);
-    return loadOptions;
+    return mergeLoadOptions(super.getLoadOptions(), {
+      fetch: { headers: { Authorization: `Bearer ${tileJSON.accessToken}` } }
+    });
   }
   renderLayers() {
     const tileJSON = this.props.data;
@@ -2025,6 +2075,7 @@ var RasterTileLayer = class extends import_core14.CompositeLayer {
       return null;
     const { tiles: data, minzoom: minZoom, maxzoom: maxZoom, raster_metadata: metadata } = tileJSON;
     const SubLayerClass = this.getSubLayerClass("tile", PostProcessTileLayer);
+    const loadOptions = this.getLoadOptions();
     return new SubLayerClass(this.props, {
       id: `raster-tile-layer-${this.props.id}`,
       data,
@@ -2034,8 +2085,8 @@ var RasterTileLayer = class extends import_core14.CompositeLayer {
       minZoom,
       maxZoom,
       loadOptions: {
-        cartoRasterTile: { metadata },
-        ...this.getLoadOptions()
+        ...loadOptions,
+        cartoRasterTile: { ...loadOptions == null ? void 0 : loadOptions.cartoRasterTile, metadata }
       }
     });
   }
@@ -2063,7 +2114,7 @@ var TileReader4 = class {
 };
 
 // dist/layers/schema/carto-properties-tile-loader.js
-var VERSION3 = true ? "9.1.8" : "latest";
+var VERSION3 = true ? "9.1.10" : "latest";
 var id3 = "cartoPropertiesTile";
 var DEFAULT_OPTIONS3 = {
   cartoPropertiesTile: {
@@ -2092,7 +2143,7 @@ var carto_properties_tile_loader_default = CartoPropertiesTileLoader;
 
 // dist/layers/schema/carto-vector-tile-loader.js
 var import_earcut = __toESM(require("earcut"), 1);
-var VERSION4 = true ? "9.1.8" : "latest";
+var VERSION4 = true ? "9.1.10" : "latest";
 var id4 = "cartoVectorTile";
 var DEFAULT_OPTIONS4 = {
   cartoVectorTile: {
@@ -2152,9 +2203,209 @@ var carto_vector_tile_loader_default = CartoVectorTileLoader;
 var import_extensions = require("@deck.gl/extensions");
 var import_geo_layers8 = require("@deck.gl/geo-layers");
 var import_layers5 = require("@deck.gl/layers");
+
+// dist/layers/label-utils.js
+function createPointsFromLines(lines, uniqueIdProperty) {
+  const hasNumericUniqueId = uniqueIdProperty ? uniqueIdProperty in lines.numericProps : false;
+  const idToLineInfo = /* @__PURE__ */ new Map();
+  for (let i = 0; i < lines.pathIndices.value.length - 1; i++) {
+    const pathIndex = lines.pathIndices.value[i];
+    const featureId = lines.featureIds.value[pathIndex];
+    let uniqueId;
+    if (uniqueIdProperty === void 0) {
+      uniqueId = featureId;
+    } else if (hasNumericUniqueId) {
+      uniqueId = lines.numericProps[uniqueIdProperty].value[pathIndex];
+    } else if (lines.properties[featureId] && uniqueIdProperty in lines.properties[featureId]) {
+      uniqueId = lines.properties[featureId][uniqueIdProperty];
+    } else {
+      uniqueId = void 0;
+    }
+    const length = getLineLength(lines, i);
+    if (!idToLineInfo.has(uniqueId) || length > idToLineInfo.get(uniqueId).length) {
+      idToLineInfo.set(uniqueId, { index: i, length });
+    }
+  }
+  const positions = [];
+  const properties = [];
+  const featureIds = [];
+  const globalFeatureIds = [];
+  const numericProps = initializeNumericProps(idToLineInfo.size, lines.numericProps);
+  let pointIndex = 0;
+  for (const [_, { index }] of idToLineInfo) {
+    const midpoint = getLineMidpoint(lines, index);
+    positions.push(...midpoint);
+    const pathIndex = lines.pathIndices.value[index];
+    const featureId = lines.featureIds.value[pathIndex];
+    featureIds.push(pointIndex);
+    properties.push(lines.properties[featureId]);
+    globalFeatureIds.push(lines.globalFeatureIds.value[pathIndex]);
+    copyNumericProps(lines.numericProps, numericProps, pathIndex, pointIndex);
+    pointIndex++;
+  }
+  return createBinaryPointFeature(positions, featureIds, globalFeatureIds, numericProps, properties);
+}
+function createPointsFromPolygons(polygons, tileBbox, props) {
+  const { west, south, east, north } = tileBbox;
+  const tileArea = (east - west) * (north - south);
+  const minPolygonArea = tileArea * 1e-4;
+  const positions = [];
+  const properties = [];
+  const featureIds = [];
+  const globalFeatureIds = [];
+  const numericProps = initializeNumericProps(polygons.polygonIndices.value.length - 1, polygons.numericProps);
+  let pointIndex = 0;
+  let triangleIndex = 0;
+  const { extruded } = props;
+  for (let i = 0; i < polygons.polygonIndices.value.length - 1; i++) {
+    const startIndex = polygons.polygonIndices.value[i];
+    const endIndex = polygons.polygonIndices.value[i + 1];
+    if (getPolygonArea(polygons, i) < minPolygonArea) {
+      continue;
+    }
+    const centroid = getPolygonCentroid(polygons, i);
+    let maxArea = -1;
+    let largestTriangleCenter = [0, 0];
+    let centroidIsInside = false;
+    while (triangleIndex < polygons.triangles.value.length) {
+      const i1 = polygons.triangles.value[triangleIndex];
+      if (i1 >= endIndex) {
+        break;
+      }
+      if (centroidIsInside) {
+        triangleIndex += 3;
+        continue;
+      }
+      const i2 = polygons.triangles.value[triangleIndex + 1];
+      const i3 = polygons.triangles.value[triangleIndex + 2];
+      const v1 = polygons.positions.value.subarray(i1 * polygons.positions.size, i1 * polygons.positions.size + polygons.positions.size);
+      const v2 = polygons.positions.value.subarray(i2 * polygons.positions.size, i2 * polygons.positions.size + polygons.positions.size);
+      const v3 = polygons.positions.value.subarray(i3 * polygons.positions.size, i3 * polygons.positions.size + polygons.positions.size);
+      if (isPointInTriangle(centroid, v1, v2, v3)) {
+        centroidIsInside = true;
+      } else {
+        const area = getTriangleArea(v1, v2, v3);
+        if (area > maxArea) {
+          maxArea = area;
+          largestTriangleCenter = [(v1[0] + v2[0] + v3[0]) / 3, (v1[1] + v2[1] + v3[1]) / 3];
+        }
+      }
+      triangleIndex += 3;
+    }
+    const labelPoint = centroidIsInside ? centroid : largestTriangleCenter;
+    if (isPointInBounds(labelPoint, tileBbox)) {
+      positions.push(...labelPoint);
+      const featureId = polygons.featureIds.value[startIndex];
+      if (extruded) {
+        const elevation = props.getElevation(void 0, {
+          data: polygons,
+          index: featureId
+        });
+        positions.push(elevation * props.elevationScale);
+      }
+      properties.push(polygons.properties[featureId]);
+      featureIds.push(pointIndex);
+      globalFeatureIds.push(polygons.globalFeatureIds.value[startIndex]);
+      copyNumericProps(polygons.numericProps, numericProps, startIndex, pointIndex);
+      pointIndex++;
+    }
+  }
+  if (polygons.numericProps) {
+    Object.keys(numericProps).forEach((prop) => {
+      numericProps[prop].value = numericProps[prop].value.slice(0, pointIndex);
+    });
+  }
+  return createBinaryPointFeature(positions, featureIds, globalFeatureIds, numericProps, properties, extruded ? 3 : 2);
+}
+function getPolygonArea(polygons, index) {
+  const { positions: { value: positions, size }, polygonIndices: { value: indices }, triangles: { value: triangles } } = polygons;
+  const startIndex = indices[index];
+  const endIndex = indices[index + 1];
+  let area = 0;
+  let triangleIndex = 0;
+  while (triangleIndex < triangles.length) {
+    const i1 = triangles[triangleIndex];
+    if (i1 >= startIndex)
+      break;
+    triangleIndex += 3;
+  }
+  while (triangleIndex < triangles.length) {
+    const i1 = triangles[triangleIndex];
+    if (i1 >= endIndex)
+      break;
+    const i2 = triangles[triangleIndex + 1];
+    const i3 = triangles[triangleIndex + 2];
+    const v1 = positions.subarray(i1 * size, i1 * size + size);
+    const v2 = positions.subarray(i2 * size, i2 * size + size);
+    const v3 = positions.subarray(i3 * size, i3 * size + size);
+    area += getTriangleArea(v1, v2, v3);
+    triangleIndex += 3;
+  }
+  return area;
+}
+function isPointInBounds([x, y], { west, east, south, north }) {
+  return x >= west && x < east && y >= south && y < north;
+}
+function isPointInTriangle(p, v1, v2, v3) {
+  const area = Math.abs((v2[0] - v1[0]) * (v3[1] - v1[1]) - (v3[0] - v1[0]) * (v2[1] - v1[1])) / 2;
+  const area1 = Math.abs((v1[0] - p[0]) * (v2[1] - p[1]) - (v2[0] - p[0]) * (v1[1] - p[1])) / 2;
+  const area2 = Math.abs((v2[0] - p[0]) * (v3[1] - p[1]) - (v3[0] - p[0]) * (v2[1] - p[1])) / 2;
+  const area3 = Math.abs((v3[0] - p[0]) * (v1[1] - p[1]) - (v1[0] - p[0]) * (v3[1] - p[1])) / 2;
+  return Math.abs(area - (area1 + area2 + area3)) < 1e-10;
+}
+function getTriangleArea([x1, y1], [x2, y2], [x3, y3]) {
+  return Math.abs((x1 * (y2 - y3) + x2 * (y3 - y1) + x3 * (y1 - y2)) / 2);
+}
+function getPolygonCentroid(polygons, index) {
+  const { positions: { value: positions, size } } = polygons;
+  const startIndex = size * polygons.polygonIndices.value[index];
+  const endIndex = size * polygons.polygonIndices.value[index + 1];
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (let i = startIndex; i < endIndex; i += size) {
+    const [x, y] = positions.subarray(i, i + 2);
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+  }
+  return [(minX + maxX) / 2, (minY + maxY) / 2];
+}
+function getSegmentLength(lines, index) {
+  const { positions: { value } } = lines;
+  const [x1, y1, x2, y2] = value.subarray(index, index + 4);
+  return Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2));
+}
+function getLineLength(lines, index) {
+  const { positions: { size } } = lines;
+  const startIndex = size * lines.pathIndices.value[index];
+  const endIndex = size * lines.pathIndices.value[index + 1];
+  let length = 0;
+  for (let j = startIndex; j < endIndex; j += size) {
+    length += getSegmentLength(lines, j);
+  }
+  return length;
+}
+function getLineMidpoint(lines, index) {
+  const { positions: { value: positions }, pathIndices: { value: pathIndices } } = lines;
+  const startIndex = pathIndices[index] * 2;
+  const endIndex = pathIndices[index + 1] * 2;
+  const numPoints = (endIndex - startIndex) / 2;
+  if (numPoints === 2) {
+    const [x1, y1, x2, y2] = positions.subarray(startIndex, startIndex + 4);
+    return [(x1 + x2) / 2, (y1 + y2) / 2];
+  }
+  const midPointIndex = startIndex + Math.floor(numPoints / 2) * 2;
+  return [positions[midPointIndex], positions[midPointIndex + 1]];
+}
+
+// dist/layers/vector-tile-layer.js
 (0, import_core16.registerLoaders)([carto_properties_tile_loader_default, carto_vector_tile_loader_default]);
 var defaultProps10 = {
   ...import_geo_layers8.MVTLayer.defaultProps,
+  autoLabels: false,
   data: TilejsonPropType,
   dataComparator: TilejsonPropType.equal,
   tileSize: DEFAULT_TILE_SIZE
@@ -2177,11 +2428,12 @@ var VectorTileLayer = class extends import_geo_layers8.MVTLayer {
     }
   }
   getLoadOptions() {
-    const loadOptions = super.getLoadOptions() || {};
     const tileJSON = this.props.data;
-    injectAccessToken(loadOptions, tileJSON.accessToken);
-    loadOptions.gis = { format: "binary" };
-    return loadOptions;
+    return mergeLoadOptions(super.getLoadOptions(), {
+      fetch: { headers: { Authorization: `Bearer ${tileJSON.accessToken}` } },
+      gis: { format: "binary" }
+      // Use binary for MVT loading
+    });
   }
   /* eslint-disable camelcase */
   async getTileData(tile) {
@@ -2219,25 +2471,8 @@ var VectorTileLayer = class extends import_geo_layers8.MVTLayer {
     if (props.data === null) {
       return null;
     }
-    if (this.state.mvt) {
-      return super.renderSubLayers(props);
-    }
     const tileBbox = props.tile.bbox;
-    const { west, south, east, north } = tileBbox;
-    const extensions = [new import_extensions.ClipExtension(), ...props.extensions || []];
-    const clipProps = {
-      clipBounds: [west, south, east, north]
-    };
-    const applyClipExtensionToSublayerProps = (subLayerId) => {
-      var _a2, _b2, _c2;
-      return {
-        [subLayerId]: {
-          ...clipProps,
-          ...(_a2 = props == null ? void 0 : props._subLayerProps) == null ? void 0 : _a2[subLayerId],
-          extensions: [...extensions, ...((_c2 = (_b2 = props == null ? void 0 : props._subLayerProps) == null ? void 0 : _b2[subLayerId]) == null ? void 0 : _c2.extensions) || []]
-        }
-      };
-    };
+    const subLayers = [];
     const defaultToPointLabelLayer = {
       "points-text": {
         type: point_label_layer_default,
@@ -2249,20 +2484,72 @@ var VectorTileLayer = class extends import_geo_layers8.MVTLayer {
         ]
       }
     };
-    const subLayerProps = {
-      ...props,
-      autoHighlight: false,
-      // Do not perform clipping on points (#9059)
-      _subLayerProps: {
-        ...props._subLayerProps,
-        ...defaultToPointLabelLayer,
-        ...applyClipExtensionToSublayerProps("polygons-fill"),
-        ...applyClipExtensionToSublayerProps("polygons-stroke"),
-        ...applyClipExtensionToSublayerProps("linestrings")
+    if (this.state.mvt) {
+      subLayers.push(super.renderSubLayers(props));
+    } else {
+      const { west, south, east, north } = tileBbox;
+      const extensions = [new import_extensions.ClipExtension(), ...props.extensions || []];
+      const clipProps = {
+        clipBounds: [west, south, east, north]
+      };
+      const applyClipExtensionToSublayerProps = (subLayerId) => {
+        var _a2, _b2, _c2;
+        return {
+          [subLayerId]: {
+            ...clipProps,
+            ...(_a2 = props == null ? void 0 : props._subLayerProps) == null ? void 0 : _a2[subLayerId],
+            extensions: [...extensions, ...((_c2 = (_b2 = props == null ? void 0 : props._subLayerProps) == null ? void 0 : _b2[subLayerId]) == null ? void 0 : _c2.extensions) || []]
+          }
+        };
+      };
+      const subLayerProps = {
+        ...props,
+        data: { ...props.data, tileBbox },
+        autoHighlight: false,
+        // Do not perform clipping on points (#9059)
+        _subLayerProps: {
+          ...props._subLayerProps,
+          ...defaultToPointLabelLayer,
+          ...applyClipExtensionToSublayerProps("polygons-fill"),
+          ...applyClipExtensionToSublayerProps("polygons-stroke"),
+          ...applyClipExtensionToSublayerProps("linestrings")
+        }
+      };
+      subLayers.push(new import_layers5.GeoJsonLayer(subLayerProps));
+    }
+    if (subLayers[0] && props.autoLabels) {
+      const labelData = createEmptyBinary();
+      if (props.data.lines && props.data.lines.positions.value.length > 0) {
+        labelData.points = createPointsFromLines(props.data.lines, typeof props.autoLabels === "object" ? props.autoLabels.uniqueIdProperty : void 0);
       }
-    };
-    const subLayer = new import_layers5.GeoJsonLayer(subLayerProps);
-    return subLayer;
+      if (props.data.polygons && props.data.polygons.positions.value.length > 0) {
+        labelData.points = createPointsFromPolygons(props.data.polygons, tileBbox, props);
+      }
+      subLayers.push(subLayers[0].clone({
+        id: `${props.id}-labels`,
+        data: labelData,
+        pickable: false,
+        autoHighlight: false
+      }));
+    }
+    return subLayers;
+  }
+  renderLayers() {
+    const layers = super.renderLayers();
+    if (!this.props.autoLabels) {
+      return layers;
+    }
+    const validLayers = layers.flat().filter(Boolean);
+    validLayers.sort((a, b) => {
+      const aHasLabel = a.id.includes("labels");
+      const bHasLabel = b.id.includes("labels");
+      if (aHasLabel && !bHasLabel)
+        return 1;
+      if (!aHasLabel && bHasLabel)
+        return -1;
+      return 0;
+    });
+    return validLayers.map((l) => l.id.includes("labels") ? l.clone({ highlightedObjectIndex: -1 }) : l);
   }
   _isWGS84() {
     if (this.state.mvt)