maplibre-gl 3.2.2 → 3.3.1

package/dist/package.json

@@ -1 +1 @@
-{"name":"@maplibre/distfiles","type":"commonjs","deprecated":"Please install maplibre-gl from parent directory instead"}
+{"name":"maplibre-gl","type":"commonjs","deprecated":"Please install maplibre-gl from parent directory instead"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "maplibre-gl",
   "description": "BSD licensed community fork of mapbox-gl, a WebGL interactive maps library",
-  "version": "3.2.2",
+  "version": "3.3.1",
   "main": "dist/maplibre-gl.js",
   "style": "dist/maplibre-gl.css",
   "license": "BSD-3-Clause",
@@ -20,7 +20,7 @@
     "@mapbox/unitbezier": "^0.0.1",
     "@mapbox/vector-tile": "^1.3.1",
     "@mapbox/whoots-js": "^3.1.0",
-    "@maplibre/maplibre-gl-style-spec": "^19.2.2",
+    "@maplibre/maplibre-gl-style-spec": "^19.3.0",
     "@types/geojson": "^7946.0.10",
     "@types/mapbox__point-geometry": "^0.1.2",
     "@types/mapbox__vector-tile": "^1.3.0",
@@ -42,54 +42,54 @@
   "devDependencies": {
     "@mapbox/mapbox-gl-rtl-text": "^0.2.3",
     "@mapbox/mvt-fixtures": "^3.10.0",
-    "@rollup/plugin-commonjs": "^25.0.3",
+    "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-json": "^6.0.0",
-    "@rollup/plugin-node-resolve": "^15.1.0",
+    "@rollup/plugin-node-resolve": "^15.2.1",
     "@rollup/plugin-replace": "^5.0.2",
     "@rollup/plugin-strip": "^3.0.2",
     "@rollup/plugin-terser": "^0.4.3",
-    "@rollup/plugin-typescript": "^11.1.2",
+    "@rollup/plugin-typescript": "^11.1.3",
     "@types/benchmark": "^2.1.2",
     "@types/cssnano": "^5.0.0",
     "@types/d3": "^7.4.0",
     "@types/diff": "^5.0.3",
     "@types/earcut": "^2.1.1",
-    "@types/eslint": "^8.44.1",
+    "@types/eslint": "^8.44.2",
     "@types/gl": "^6.0.2",
     "@types/glob": "^8.1.0",
     "@types/jest": "^29.5.3",
-    "@types/jsdom": "^21.1.1",
+    "@types/jsdom": "^21.1.2",
     "@types/minimist": "^1.2.2",
     "@types/murmurhash-js": "^1.0.4",
     "@types/nise": "^1.4.1",
-    "@types/node": "^20.4.5",
+    "@types/node": "^20.5.7",
     "@types/offscreencanvas": "^2019.7.0",
     "@types/pixelmatch": "^5.2.4",
     "@types/pngjs": "^6.0.1",
-    "@types/react": "^18.2.17",
+    "@types/react": "^18.2.21",
     "@types/react-dom": "^18.2.7",
     "@types/request": "^2.48.8",
     "@types/shuffle-seed": "^1.1.0",
     "@types/window-or-global": "^1.0.4",
-    "@typescript-eslint/eslint-plugin": "^6.2.0",
-    "@typescript-eslint/parser": "^6.2.0",
+    "@typescript-eslint/eslint-plugin": "^6.4.1",
+    "@typescript-eslint/parser": "^6.4.1",
     "address": "^1.2.2",
     "benchmark": "^2.1.4",
     "canvas": "^2.11.2",
     "cssnano": "^6.0.1",
     "d3": "^7.8.5",
     "d3-queue": "^3.0.7",
-    "devtools-protocol": "^0.0.1173815",
+    "devtools-protocol": "^0.0.1188743",
     "diff": "^5.1.0",
     "dts-bundle-generator": "^8.0.1",
-    "eslint": "^8.46.0",
+    "eslint": "^8.48.0",
     "eslint-config-mourner": "^3.0.0",
     "eslint-plugin-html": "^7.1.0",
-    "eslint-plugin-import": "^2.28.0",
+    "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-jest": "^27.2.3",
-    "eslint-plugin-react": "^7.33.1",
+    "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-tsdoc": "0.2.17",
-    "expect": "^29.6.2",
+    "expect": "^29.6.4",
     "gl": "^6.0.2",
     "glob": "^10.3.3",
     "is-builtin-module": "^3.2.1",
@@ -107,28 +107,28 @@
     "pdf-merger-js": "^4.3.0",
     "pixelmatch": "^5.3.0",
     "pngjs": "^7.0.0",
-    "postcss": "^8.4.27",
+    "postcss": "^8.4.28",
     "postcss-cli": "^10.1.0",
     "postcss-inline-svg": "^6.0.0",
     "pretty-bytes": "^6.1.1",
-    "puppeteer": "^20.9.0",
+    "puppeteer": "^21.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "rollup": "^3.27.0",
+    "rollup": "^3.28.1",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "rw": "^1.3.3",
     "semver": "^7.5.4",
     "shuffle-seed": "^1.1.6",
     "source-map-explorer": "^2.5.3",
     "st": "^3.0.0",
-    "stylelint": "^15.10.2",
+    "stylelint": "^15.10.3",
     "stylelint-config-standard": "^34.0.0",
     "ts-jest": "^29.1.1",
     "ts-node": "^10.9.1",
-    "tslib": "^2.6.1",
+    "tslib": "^2.6.2",
     "typedoc": "^0.24.8",
-    "typedoc-plugin-markdown": "^3.15.4",
-    "typedoc-plugin-missing-exports": "^2.0.1",
+    "typedoc-plugin-markdown": "^3.16.0",
+    "typedoc-plugin-missing-exports": "^2.1.0",
     "typescript": "^5.1.6"
   },
   "overrides": {
@@ -159,6 +159,7 @@
     "build-benchmarks": "npm run build-dev && rollup --configPlugin @rollup/plugin-typescript -c test/bench/rollup_config_benchmarks.ts",
     "watch-benchmarks": "rollup --configPlugin @rollup/plugin-typescript -c test/bench/rollup_config_benchmarks.ts --watch",
     "start-server": "st --no-cache -H 0.0.0.0 --port 9966 .",
+    "start-docs": "docker run --rm -it -p 8000:8000 -v ${PWD}:/docs squidfunk/mkdocs-material",
     "start": "run-p watch-css watch-dev start-server",
     "start-bench": "run-p watch-css watch-benchmarks start-server",
     "lint": "eslint --cache --ext .ts,.tsx,.js,.html --ignore-path .gitignore .",

package/src/data/array_types.g.ts

@@ -621,10 +621,11 @@ register('StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48', StructArrayLayout2i2ui3ul3u
  * [0]: Int16[8]
  * [16]: Uint16[15]
  * [48]: Uint32[1]
- * [52]: Float32[4]
+ * [52]: Float32[2]
+ * [60]: Uint16[2]
  *
  */
-class StructArrayLayout8i15ui1ul4f68 extends StructArray {
+class StructArrayLayout8i15ui1ul2f2ui64 extends StructArray {
     uint8: Uint8Array;
     int16: Int16Array;
     uint16: Uint16Array;
@@ -646,8 +647,8 @@ class StructArrayLayout8i15ui1ul4f68 extends StructArray {
     }
 
     public emplace(i: number, v0: number, v1: number, v2: number, v3: number, v4: number, v5: number, v6: number, v7: number, v8: number, v9: number, v10: number, v11: number, v12: number, v13: number, v14: number, v15: number, v16: number, v17: number, v18: number, v19: number, v20: number, v21: number, v22: number, v23: number, v24: number, v25: number, v26: number, v27: number) {
-        const o2 = i * 34;
-        const o4 = i * 17;
+        const o2 = i * 32;
+        const o4 = i * 16;
         this.int16[o2 + 0] = v0;
         this.int16[o2 + 1] = v1;
         this.int16[o2 + 2] = v2;
@@ -674,14 +675,14 @@ class StructArrayLayout8i15ui1ul4f68 extends StructArray {
         this.uint32[o4 + 12] = v23;
         this.float32[o4 + 13] = v24;
         this.float32[o4 + 14] = v25;
-        this.float32[o4 + 15] = v26;
-        this.float32[o4 + 16] = v27;
+        this.uint16[o2 + 30] = v26;
+        this.uint16[o2 + 31] = v27;
         return i;
     }
 }
 
-StructArrayLayout8i15ui1ul4f68.prototype.bytesPerElement = 68;
-register('StructArrayLayout8i15ui1ul4f68', StructArrayLayout8i15ui1ul4f68);
+StructArrayLayout8i15ui1ul2f2ui64.prototype.bytesPerElement = 64;
+register('StructArrayLayout8i15ui1ul2f2ui64', StructArrayLayout8i15ui1ul2f2ui64);
 
 /**
  * @internal
@@ -714,6 +715,43 @@ class StructArrayLayout1f4 extends StructArray {
 StructArrayLayout1f4.prototype.bytesPerElement = 4;
 register('StructArrayLayout1f4', StructArrayLayout1f4);
 
+/**
+ * @internal
+ * Implementation of the StructArray layout:
+ * [0]: Uint16[1]
+ * [4]: Float32[2]
+ *
+ */
+class StructArrayLayout1ui2f12 extends StructArray {
+    uint8: Uint8Array;
+    uint16: Uint16Array;
+    float32: Float32Array;
+
+    _refreshViews() {
+        this.uint8 = new Uint8Array(this.arrayBuffer);
+        this.uint16 = new Uint16Array(this.arrayBuffer);
+        this.float32 = new Float32Array(this.arrayBuffer);
+    }
+
+    public emplaceBack(v0: number, v1: number, v2: number) {
+        const i = this.length;
+        this.resize(i + 1);
+        return this.emplace(i, v0, v1, v2);
+    }
+
+    public emplace(i: number, v0: number, v1: number, v2: number) {
+        const o2 = i * 6;
+        const o4 = i * 3;
+        this.uint16[o2 + 0] = v0;
+        this.float32[o4 + 1] = v1;
+        this.float32[o4 + 2] = v2;
+        return i;
+    }
+}
+
+StructArrayLayout1ui2f12.prototype.bytesPerElement = 12;
+register('StructArrayLayout1ui2f12', StructArrayLayout1ui2f12);
+
 /**
  * @internal
  * Implementation of the StructArray layout:
@@ -951,17 +989,17 @@ class SymbolInstanceStruct extends Struct {
     get crossTileID() { return this._structArray.uint32[this._pos4 + 12]; }
     set crossTileID(x: number) { this._structArray.uint32[this._pos4 + 12] = x; }
     get textBoxScale() { return this._structArray.float32[this._pos4 + 13]; }
-    get textOffset0() { return this._structArray.float32[this._pos4 + 14]; }
-    get textOffset1() { return this._structArray.float32[this._pos4 + 15]; }
-    get collisionCircleDiameter() { return this._structArray.float32[this._pos4 + 16]; }
+    get collisionCircleDiameter() { return this._structArray.float32[this._pos4 + 14]; }
+    get textAnchorOffsetStartIndex() { return this._structArray.uint16[this._pos2 + 30]; }
+    get textAnchorOffsetEndIndex() { return this._structArray.uint16[this._pos2 + 31]; }
 }
 
-SymbolInstanceStruct.prototype.size = 68;
+SymbolInstanceStruct.prototype.size = 64;
 
 export type SymbolInstance = SymbolInstanceStruct;
 
 /** @internal */
-export class SymbolInstanceArray extends StructArrayLayout8i15ui1ul4f68 {
+export class SymbolInstanceArray extends StructArrayLayout8i15ui1ul2f2ui64 {
     /**
      * Return the SymbolInstanceStruct at the given location in the array.
      * @param index The index of the element.
@@ -989,6 +1027,31 @@ export class SymbolLineVertexArray extends StructArrayLayout3i6 {
 
 register('SymbolLineVertexArray', SymbolLineVertexArray);
 
+/** @internal */
+class TextAnchorOffsetStruct extends Struct {
+    _structArray: TextAnchorOffsetArray;
+    get textAnchor() { return this._structArray.uint16[this._pos2 + 0]; }
+    get textOffset0() { return this._structArray.float32[this._pos4 + 1]; }
+    get textOffset1() { return this._structArray.float32[this._pos4 + 2]; }
+}
+
+TextAnchorOffsetStruct.prototype.size = 12;
+
+export type TextAnchorOffset = TextAnchorOffsetStruct;
+
+/** @internal */
+export class TextAnchorOffsetArray extends StructArrayLayout1ui2f12 {
+    /**
+     * Return the TextAnchorOffsetStruct at the given location in the array.
+     * @param index The index of the element.
+     */
+    get(index: number): TextAnchorOffsetStruct {
+        return new TextAnchorOffsetStruct(this, index);
+    }
+}
+
+register('TextAnchorOffsetArray', TextAnchorOffsetArray);
+
 /** @internal */
 class FeatureIndexStruct extends Struct {
     _structArray: FeatureIndexArray;
@@ -1051,8 +1114,9 @@ export {
     StructArrayLayout2ub2f12,
     StructArrayLayout3ui6,
     StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48,
-    StructArrayLayout8i15ui1ul4f68,
+    StructArrayLayout8i15ui1ul2f2ui64,
     StructArrayLayout1f4,
+    StructArrayLayout1ui2f12,
     StructArrayLayout1ul2ui8,
     StructArrayLayout2ui4,
     StructArrayLayout1ui2,

package/src/data/bucket/symbol_attributes.ts

@@ -100,8 +100,9 @@ export const symbolInstance = createLayout([
     {type: 'Uint16', name: 'useRuntimeCollisionCircles'},
     {type: 'Uint32', name: 'crossTileID'},
     {type: 'Float32', name: 'textBoxScale'},
-    {type: 'Float32', components: 2, name: 'textOffset'},
     {type: 'Float32', name: 'collisionCircleDiameter'},
+    {type: 'Uint16', name: 'textAnchorOffsetStartIndex'},
+    {type: 'Uint16', name: 'textAnchorOffsetEndIndex'}
 ]);
 
 export const glyphOffset = createLayout([
@@ -113,3 +114,8 @@ export const lineVertex = createLayout([
     {type: 'Int16', name: 'y'},
     {type: 'Int16', name: 'tileUnitDistanceFromAnchor'}
 ]);
+
+export const textAnchorOffset = createLayout([
+    {type: 'Uint16', name: 'textAnchor'},
+    {type: 'Float32', components: 2, name: 'textOffset'}
+]);

package/src/data/bucket/symbol_bucket.ts

@@ -13,7 +13,8 @@ import {SymbolLayoutArray,
     PlacedSymbolArray,
     SymbolInstanceArray,
     GlyphOffsetArray,
-    SymbolLineVertexArray
+    SymbolLineVertexArray,
+    TextAnchorOffsetArray
 } from '../array_types.g';
 
 import Point from '@mapbox/point-geometry';
@@ -333,6 +334,7 @@ export class SymbolBucket implements Bucket {
     lineVertexArray: SymbolLineVertexArray;
     features: Array<SymbolFeature>;
     symbolInstances: SymbolInstanceArray;
+    textAnchorOffsets: TextAnchorOffsetArray;
     collisionArrays: Array<CollisionArrays>;
     sortKeyRanges: Array<SortKeyRange>;
     pixelRatio: number;
@@ -412,6 +414,7 @@ export class SymbolBucket implements Bucket {
         this.glyphOffsetArray = new GlyphOffsetArray();
         this.lineVertexArray = new SymbolLineVertexArray();
         this.symbolInstances = new SymbolInstanceArray();
+        this.textAnchorOffsets = new TextAnchorOffsetArray();
     }
 
     calculateGlyphDependencies(text: string, stack: {[_: number]: boolean}, textAlongLine: boolean, allowVerticalPlacement: boolean, doesAllowVerticalWritingMode: boolean) {

package/src/render/draw_symbol.ts

@@ -13,7 +13,6 @@ import {addDynamicAttributes} from '../data/bucket/symbol_bucket';
 
 import {getAnchorAlignment, WritingMode} from '../symbol/shaping';
 import ONE_EM from '../symbol/one_em';
-import {evaluateVariableOffset, TextAnchor} from '../symbol/symbol_layout';
 
 import {
     SymbolIconUniformsType,
@@ -37,6 +36,7 @@ import type {SymbolLayerSpecification} from '@maplibre/maplibre-gl-style-spec';
 import type {Transform} from '../geo/transform';
 import type {ColorMode} from '../gl/color_mode';
 import type {Program} from './program';
+import type {TextAnchor} from '../style/style_layer/variable_text_anchor';
 
 type SymbolTileRenderState = {
     segments: SegmentVector;
@@ -65,11 +65,11 @@ export function drawSymbols(painter: Painter, sourceCache: SourceCache, layer: S
     // Disable the stencil test so that labels aren't clipped to tile boundaries.
     const stencilMode = StencilMode.disabled;
     const colorMode = painter.colorModeForRenderPass();
-    const variablePlacement = layer.layout.get('text-variable-anchor');
+    const hasVariablePlacement = layer._unevaluatedLayout.hasValue('text-variable-anchor') || layer._unevaluatedLayout.hasValue('text-variable-anchor-offset');
 
     //Compute variable-offsets before painting since icons and text data positioning
     //depend on each other in this case.
-    if (variablePlacement) {
+    if (hasVariablePlacement) {
         updateVariableAnchors(coords, painter, layer, sourceCache,
             layer.layout.get('text-rotation-alignment'),
             layer.layout.get('text-pitch-alignment'),
@@ -117,10 +117,9 @@ function calculateVariableRenderShift(
     const {horizontalAlign, verticalAlign} = getAnchorAlignment(anchor);
     const shiftX = -(horizontalAlign - 0.5) * width;
     const shiftY = -(verticalAlign - 0.5) * height;
-    const variableOffset = evaluateVariableOffset(anchor, textOffset);
     return new Point(
-        (shiftX / textBoxScale + variableOffset[0]) * renderTextSize,
-        (shiftY / textBoxScale + variableOffset[1]) * renderTextSize
+        (shiftX / textBoxScale + textOffset[0]) * renderTextSize,
+        (shiftY / textBoxScale + textOffset[1]) * renderTextSize
     );
 }
 
@@ -281,7 +280,7 @@ function drawLayerSymbols(
 
     const depthMode = painter.depthModeForSublayer(0, DepthMode.ReadOnly);
 
-    const variablePlacement = layer.layout.get('text-variable-anchor');
+    const hasVariablePlacement = layer._unevaluatedLayout.hasValue('text-variable-anchor') || layer._unevaluatedLayout.hasValue('text-variable-anchor-offset');
 
     const tileRenderState: Array<SymbolTileRenderState> = [];
 
@@ -332,7 +331,7 @@ function drawLayerSymbols(
         const labelPlaneMatrix = symbolProjection.getLabelPlaneMatrix(coord.posMatrix, pitchWithMap, rotateWithMap, painter.transform, s);
         const glCoordMatrix = symbolProjection.getGlCoordMatrix(coord.posMatrix, pitchWithMap, rotateWithMap, painter.transform, s);
 
-        const hasVariableAnchors = variablePlacement && bucket.hasTextData();
+        const hasVariableAnchors = hasVariablePlacement && bucket.hasTextData();
         const updateTextFitIcon = layer.layout.get('icon-text-fit') !== 'none' &&
             hasVariableAnchors &&
             bucket.hasIconData();
@@ -344,7 +343,7 @@ function drawLayerSymbols(
         }
 
         const matrix = painter.translatePosMatrix(coord.posMatrix, tile, translate, translateAnchor),
-            uLabelPlaneMatrix = (alongLine || (isText && variablePlacement) || updateTextFitIcon) ? identityMat4 : labelPlaneMatrix,
+            uLabelPlaneMatrix = (alongLine || (isText && hasVariablePlacement) || updateTextFitIcon) ? identityMat4 : labelPlaneMatrix,
             uglCoordMatrix = painter.translatePosMatrix(glCoordMatrix, tile, translate, translateAnchor, true);
 
         const hasHalo = isSDF && layer.paint.get(isText ? 'text-halo-width' : 'icon-halo-width').constantOr(1) !== 0;

package/src/render/program.ts

@@ -89,6 +89,11 @@ export class Program<Us extends UniformBindings> {
         }
         gl.shaderSource(fragmentShader, fragmentSource);
         gl.compileShader(fragmentShader);
+
+        if (!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {
+            throw new Error(`Could not compile fragment shader: ${gl.getShaderInfoLog(fragmentShader)}`);
+        }
+
         gl.attachShader(this.program, fragmentShader);
 
         const vertexShader = gl.createShader(gl.VERTEX_SHADER);
@@ -98,6 +103,11 @@ export class Program<Us extends UniformBindings> {
         }
         gl.shaderSource(vertexShader, vertexSource);
         gl.compileShader(vertexShader);
+
+        if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
+            throw new Error(`Could not compile vertex shader: ${gl.getShaderInfoLog(vertexShader)}`);
+        }
+
         gl.attachShader(this.program, vertexShader);
 
         this.attributes = {};
@@ -113,6 +123,11 @@ export class Program<Us extends UniformBindings> {
         }
 
         gl.linkProgram(this.program);
+
+        if (!gl.getProgramParameter(this.program, gl.LINK_STATUS)) {
+            throw new Error(`Program failed to link: ${gl.getProgramInfoLog(this.program)}`);
+        }
+
         gl.deleteShader(vertexShader);
         gl.deleteShader(fragmentShader);
 

package/src/source/vector_tile_source.ts

@@ -52,7 +52,6 @@ export type VectorTileSourceOptions = VectorSourceSpecification & {
  * map.getSource('some id').setTiles(['https://d25uarhxywzl1j.cloudfront.net/v0.1/{z}/{x}/{y}.mvt']);
  * ```
  * @see [Add a vector tile source](https://maplibre.org/maplibre-gl-js/docs/examples/vector-source/)
- * @see [Add a third party vector tile source](https://maplibre.org/maplibre-gl-js/docs/examples/third-party/)
  */
 export class VectorTileSource extends Evented implements Source {
     type: 'vector';

package/src/source/video_source.ts

@@ -48,6 +48,10 @@ import type {VideoSourceSpecification} from '@maplibre/maplibre-gl-style-spec';
  * map.removeSource('some id');  // remove
  * ```
  * @see [Add a video](https://maplibre.org/maplibre-gl-js/docs/examples/video-on-a-map/)
+ *
+ * Note that when rendered as a raster layer, the layer's `raster-fade-duration` property will cause the video to fade in.
+ * This happens when playback is started, paused and resumed, or when the video's coordinates are updated. To avoid this behavior,
+ * set the layer's `raster-fade-duration` property to `0`.
  */
 export class VideoSource extends ImageSource {
     options: VideoSourceSpecification;

package/src/style/properties.ts

@@ -317,6 +317,10 @@ export class Layout<Props> {
         this._values = (Object.create(properties.defaultPropertyValues) as any);
     }
 
+    hasValue<S extends keyof Props>(name: S) {
+        return this._values[name].value !== undefined;
+    }
+
     getValue<S extends keyof Props>(name: S) {
         return clone(this._values[name].value);
     }

package/src/style/style.ts

@@ -191,6 +191,12 @@ export type StyleSwapOptions = {
     transformStyle?: TransformStyleFunction;
 }
 
+/**
+ * Specifies a layer to be added to a {@link Style}. In addition to a standard {@link LayerSpecification}
+ * or a {@link CustomLayerInterface}, a {@link LayerSpecification} with an embedded {@link SourceSpecification} can also be provided.
+ */
+export type AddLayerObject = LayerSpecification | (Omit<LayerSpecification, 'source'> & {source: SourceSpecification}) | CustomLayerInterface;
+
 /**
  * The Style base class
  */
@@ -362,7 +368,7 @@ export class Style extends Evented {
 
         this.light = new Light(this.stylesheet.light);
 
-        this.map.setTerrain(this.stylesheet.terrain);
+        this.map.setTerrain(this.stylesheet.terrain ?? null);
 
         this.fire(new Event('data', {dataType: 'style'}));
         this.fire(new Event('style.load'));
@@ -848,7 +854,7 @@ export class Style extends Evented {
      * @param options - Style setter options.
      * @returns `this`.
      */
-    addLayer(layerObject: LayerSpecification | CustomLayerInterface, before?: string, options: StyleSetterOptions = {}): this {
+    addLayer(layerObject: AddLayerObject, before?: string, options: StyleSetterOptions = {}): this {
         this._checkLoaded();
 
         const id = layerObject.id;
@@ -858,7 +864,7 @@ export class Style extends Evented {
             return;
         }
 
-        let layer;
+        let layer: ReturnType<typeof createStyleLayer>;
         if (layerObject.type === 'custom') {
 
             if (emitValidationErrors(this, validateCustomStyleLayer(layerObject))) return;
@@ -866,17 +872,17 @@ export class Style extends Evented {
             layer = createStyleLayer(layerObject);
 
         } else {
-            if (typeof (layerObject as any).source === 'object') {
-                this.addSource(id, (layerObject as any).source);
+            if ('source' in layerObject && typeof layerObject.source === 'object') {
+                this.addSource(id, layerObject.source);
                 layerObject = clone(layerObject);
-                layerObject = (extend(layerObject, {source: id}) as any);
+                layerObject = extend(layerObject, {source: id});
             }
 
             // this layer is not in the style.layers array, so we pass an impossible array index
             if (this._validate(validateStyle.layer,
                 `layers.${id}`, layerObject, {arrayIndex: -1}, options)) return;
 
-            layer = createStyleLayer(layerObject);
+            layer = createStyleLayer(layerObject as LayerSpecification | CustomLayerInterface);
             this._validateLayer(layer);
 
             layer.setEventedParent(this, {layer: {id}});
@@ -994,7 +1000,7 @@ export class Style extends Evented {
      * @param id - id of the desired layer
      * @returns a layer, if one with the given `id` exists
      */
-    getLayer(id: string): StyleLayer {
+    getLayer(id: string): StyleLayer | undefined {
         return this._layers[id];
     }
 

package/src/style/style_layer/background_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 

package/src/style/style_layer/circle_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 export type CircleLayoutProps = {

package/src/style/style_layer/fill_extrusion_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 

package/src/style/style_layer/fill_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 export type FillLayoutProps = {

package/src/style/style_layer/heatmap_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 

package/src/style/style_layer/hillshade_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 

package/src/style/style_layer/line_style_layer_properties.g.ts

@@ -14,12 +14,7 @@ import {
     CrossFaded
 } from '../properties';
 
-import type {Color} from '@maplibre/maplibre-gl-style-spec';
-import type {Padding} from '@maplibre/maplibre-gl-style-spec';
-
-import type {Formatted} from '@maplibre/maplibre-gl-style-spec';
-
-import type {ResolvedImage} from '@maplibre/maplibre-gl-style-spec';
+import type {Color, Formatted, Padding, ResolvedImage, VariableAnchorOffsetCollection} from '@maplibre/maplibre-gl-style-spec';
 import {StylePropertySpecification} from '@maplibre/maplibre-gl-style-spec';
 
 export type LineLayoutProps = {