maplibre-gl 3.2.1 → 3.2.2

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.1",
+  "version": "3.2.2",
   "main": "dist/maplibre-gl.js",
   "style": "dist/maplibre-gl.css",
   "license": "BSD-3-Clause",
@@ -54,7 +54,7 @@
     "@types/d3": "^7.4.0",
     "@types/diff": "^5.0.3",
     "@types/earcut": "^2.1.1",
-    "@types/eslint": "^8.44.0",
+    "@types/eslint": "^8.44.1",
     "@types/gl": "^6.0.2",
     "@types/glob": "^8.1.0",
     "@types/jest": "^29.5.3",
@@ -62,40 +62,40 @@
     "@types/minimist": "^1.2.2",
     "@types/murmurhash-js": "^1.0.4",
     "@types/nise": "^1.4.1",
-    "@types/node": "^20.4.4",
+    "@types/node": "^20.4.5",
     "@types/offscreencanvas": "^2019.7.0",
     "@types/pixelmatch": "^5.2.4",
     "@types/pngjs": "^6.0.1",
-    "@types/react": "^18.2.15",
+    "@types/react": "^18.2.17",
     "@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": "^5.61.0",
-    "@typescript-eslint/parser": "^5.62.0",
+    "@typescript-eslint/eslint-plugin": "^6.2.0",
+    "@typescript-eslint/parser": "^6.2.0",
     "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.1170846",
+    "devtools-protocol": "^0.0.1173815",
     "diff": "^5.1.0",
     "dts-bundle-generator": "^8.0.1",
-    "eslint": "^8.45.0",
+    "eslint": "^8.46.0",
     "eslint-config-mourner": "^3.0.0",
     "eslint-plugin-html": "^7.1.0",
-    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-import": "^2.28.0",
     "eslint-plugin-jest": "^27.2.3",
+    "eslint-plugin-react": "^7.33.1",
     "eslint-plugin-tsdoc": "0.2.17",
-    "eslint-plugin-react": "^7.33.0",
-    "expect": "^29.5.0",
+    "expect": "^29.6.2",
     "gl": "^6.0.2",
     "glob": "^10.3.3",
     "is-builtin-module": "^3.2.1",
-    "jest": "^29.6.1",
+    "jest": "^29.6.2",
     "jest-canvas-mock": "^2.5.2",
-    "jest-environment-jsdom": "^29.6.1",
+    "jest-environment-jsdom": "^29.6.2",
     "jsdom": "^22.1.0",
     "json-stringify-pretty-compact": "^4.0.0",
     "minimist": "^1.2.8",
@@ -107,14 +107,14 @@
     "pdf-merger-js": "^4.3.0",
     "pixelmatch": "^5.3.0",
     "pngjs": "^7.0.0",
-    "postcss": "^8.4.26",
+    "postcss": "^8.4.27",
     "postcss-cli": "^10.1.0",
     "postcss-inline-svg": "^6.0.0",
     "pretty-bytes": "^6.1.1",
     "puppeteer": "^20.9.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "rollup": "^3.26.3",
+    "rollup": "^3.27.0",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "rw": "^1.3.3",
     "semver": "^7.5.4",
@@ -125,10 +125,10 @@
     "stylelint-config-standard": "^34.0.0",
     "ts-jest": "^29.1.1",
     "ts-node": "^10.9.1",
-    "tslib": "^2.6.0",
+    "tslib": "^2.6.1",
     "typedoc": "^0.24.8",
-    "typedoc-plugin-markdown": "^3.15.3",
-    "typedoc-plugin-missing-exports": "^2.0.0",
+    "typedoc-plugin-markdown": "^3.15.4",
+    "typedoc-plugin-missing-exports": "^2.0.1",
     "typescript": "^5.1.6"
   },
   "overrides": {

package/src/data/array_types.g.ts

@@ -5,6 +5,7 @@ import {register} from '../util/web_worker_transfer';
 import Point from '@mapbox/point-geometry';
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[2]
  *
@@ -36,6 +37,7 @@ StructArrayLayout2i4.prototype.bytesPerElement = 4;
 register('StructArrayLayout2i4', StructArrayLayout2i4);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[3]
  *
@@ -68,6 +70,7 @@ StructArrayLayout3i6.prototype.bytesPerElement = 6;
 register('StructArrayLayout3i6', StructArrayLayout3i6);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[4]
  *
@@ -101,6 +104,7 @@ StructArrayLayout4i8.prototype.bytesPerElement = 8;
 register('StructArrayLayout4i8', StructArrayLayout4i8);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[2]
  * [4]: Int16[4]
@@ -137,6 +141,7 @@ StructArrayLayout2i4i12.prototype.bytesPerElement = 12;
 register('StructArrayLayout2i4i12', StructArrayLayout2i4i12);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[2]
  * [4]: Uint8[4]
@@ -174,6 +179,7 @@ StructArrayLayout2i4ub8.prototype.bytesPerElement = 8;
 register('StructArrayLayout2i4ub8', StructArrayLayout2i4ub8);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Float32[2]
  *
@@ -205,6 +211,7 @@ StructArrayLayout2f8.prototype.bytesPerElement = 8;
 register('StructArrayLayout2f8', StructArrayLayout2f8);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint16[10]
  *
@@ -244,6 +251,7 @@ StructArrayLayout10ui20.prototype.bytesPerElement = 20;
 register('StructArrayLayout10ui20', StructArrayLayout10ui20);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[4]
  * [8]: Uint16[4]
@@ -289,6 +297,7 @@ StructArrayLayout4i4ui4i24.prototype.bytesPerElement = 24;
 register('StructArrayLayout4i4ui4i24', StructArrayLayout4i4ui4i24);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Float32[3]
  *
@@ -321,6 +330,7 @@ StructArrayLayout3f12.prototype.bytesPerElement = 12;
 register('StructArrayLayout3f12', StructArrayLayout3f12);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint32[1]
  *
@@ -351,6 +361,7 @@ StructArrayLayout1ul4.prototype.bytesPerElement = 4;
 register('StructArrayLayout1ul4', StructArrayLayout1ul4);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[6]
  * [12]: Uint32[1]
@@ -396,6 +407,7 @@ StructArrayLayout6i1ul2ui20.prototype.bytesPerElement = 20;
 register('StructArrayLayout6i1ul2ui20', StructArrayLayout6i1ul2ui20);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[2]
  * [4]: Int16[2]
@@ -433,6 +445,7 @@ StructArrayLayout2i2i2i12.prototype.bytesPerElement = 12;
 register('StructArrayLayout2i2i2i12', StructArrayLayout2i2i2i12);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Float32[2]
  * [8]: Float32[1]
@@ -472,6 +485,7 @@ StructArrayLayout2f1f2i16.prototype.bytesPerElement = 16;
 register('StructArrayLayout2f1f2i16', StructArrayLayout2f1f2i16);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint8[2]
  * [4]: Float32[2]
@@ -507,6 +521,7 @@ StructArrayLayout2ub2f12.prototype.bytesPerElement = 12;
 register('StructArrayLayout2ub2f12', StructArrayLayout2ub2f12);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint16[3]
  *
@@ -539,6 +554,7 @@ StructArrayLayout3ui6.prototype.bytesPerElement = 6;
 register('StructArrayLayout3ui6', StructArrayLayout3ui6);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[2]
  * [4]: Uint16[2]
@@ -600,6 +616,7 @@ StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48.prototype.bytesPerElement = 48;
 register('StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48', StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Int16[8]
  * [16]: Uint16[15]
@@ -667,6 +684,7 @@ StructArrayLayout8i15ui1ul4f68.prototype.bytesPerElement = 68;
 register('StructArrayLayout8i15ui1ul4f68', StructArrayLayout8i15ui1ul4f68);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Float32[1]
  *
@@ -697,6 +715,7 @@ StructArrayLayout1f4.prototype.bytesPerElement = 4;
 register('StructArrayLayout1f4', StructArrayLayout1f4);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint32[1]
  * [4]: Uint16[2]
@@ -733,6 +752,7 @@ StructArrayLayout1ul2ui8.prototype.bytesPerElement = 8;
 register('StructArrayLayout1ul2ui8', StructArrayLayout1ul2ui8);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint16[2]
  *
@@ -764,6 +784,7 @@ StructArrayLayout2ui4.prototype.bytesPerElement = 4;
 register('StructArrayLayout2ui4', StructArrayLayout2ui4);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Uint16[1]
  *
@@ -794,6 +815,7 @@ StructArrayLayout1ui2.prototype.bytesPerElement = 2;
 register('StructArrayLayout1ui2', StructArrayLayout1ui2);
 
 /**
+ * @internal
  * Implementation of the StructArray layout:
  * [0]: Float32[4]
  *
@@ -826,7 +848,7 @@ class StructArrayLayout4f16 extends StructArray {
 StructArrayLayout4f16.prototype.bytesPerElement = 16;
 register('StructArrayLayout4f16', StructArrayLayout4f16);
 
-/** */
+/** @internal */
 class CollisionBoxStruct extends Struct {
     _structArray: CollisionBoxArray;
     get anchorPointX() { return this._structArray.int16[this._pos2 + 0]; }
@@ -845,7 +867,7 @@ CollisionBoxStruct.prototype.size = 20;
 
 export type CollisionBox = CollisionBoxStruct;
 
-/** */
+/** @internal */
 export class CollisionBoxArray extends StructArrayLayout6i1ul2ui20 {
     /**
      * Return the CollisionBoxStruct at the given location in the array.
@@ -858,7 +880,7 @@ export class CollisionBoxArray extends StructArrayLayout6i1ul2ui20 {
 
 register('CollisionBoxArray', CollisionBoxArray);
 
-/** */
+/** @internal */
 class PlacedSymbolStruct extends Struct {
     _structArray: PlacedSymbolArray;
     get anchorX() { return this._structArray.int16[this._pos2 + 0]; }
@@ -887,7 +909,7 @@ PlacedSymbolStruct.prototype.size = 48;
 
 export type PlacedSymbol = PlacedSymbolStruct;
 
-/** */
+/** @internal */
 export class PlacedSymbolArray extends StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48 {
     /**
      * Return the PlacedSymbolStruct at the given location in the array.
@@ -900,7 +922,7 @@ export class PlacedSymbolArray extends StructArrayLayout2i2ui3ul3ui2f3ub1ul1i48
 
 register('PlacedSymbolArray', PlacedSymbolArray);
 
-/** */
+/** @internal */
 class SymbolInstanceStruct extends Struct {
     _structArray: SymbolInstanceArray;
     get anchorX() { return this._structArray.int16[this._pos2 + 0]; }
@@ -938,7 +960,7 @@ SymbolInstanceStruct.prototype.size = 68;
 
 export type SymbolInstance = SymbolInstanceStruct;
 
-/** */
+/** @internal */
 export class SymbolInstanceArray extends StructArrayLayout8i15ui1ul4f68 {
     /**
      * Return the SymbolInstanceStruct at the given location in the array.
@@ -951,14 +973,14 @@ export class SymbolInstanceArray extends StructArrayLayout8i15ui1ul4f68 {
 
 register('SymbolInstanceArray', SymbolInstanceArray);
 
-/** */
+/** @internal */
 export class GlyphOffsetArray extends StructArrayLayout1f4 {
     getoffsetX(index: number) { return this.float32[index * 1 + 0]; }
 }
 
 register('GlyphOffsetArray', GlyphOffsetArray);
 
-/** */
+/** @internal */
 export class SymbolLineVertexArray extends StructArrayLayout3i6 {
     getx(index: number) { return this.int16[index * 3 + 0]; }
     gety(index: number) { return this.int16[index * 3 + 1]; }
@@ -967,7 +989,7 @@ export class SymbolLineVertexArray extends StructArrayLayout3i6 {
 
 register('SymbolLineVertexArray', SymbolLineVertexArray);
 
-/** */
+/** @internal */
 class FeatureIndexStruct extends Struct {
     _structArray: FeatureIndexArray;
     get featureIndex() { return this._structArray.uint32[this._pos4 + 0]; }
@@ -979,7 +1001,7 @@ FeatureIndexStruct.prototype.size = 8;
 
 export type FeatureIndex = FeatureIndexStruct;
 
-/** */
+/** @internal */
 export class FeatureIndexArray extends StructArrayLayout1ul2ui8 {
     /**
      * Return the FeatureIndexStruct at the given location in the array.

package/src/data/bucket/circle_bucket.ts

@@ -35,6 +35,7 @@ function addCircleVertex(layoutVertexArray, x, y, extrudeX, extrudeY) {
 }
 
 /**
+ * @internal
  * Circles are represented by two triangles.
  *
  * Each corner has a pos that is the center of the circle and an extrusion

package/src/data/bucket/line_bucket.ts

@@ -82,6 +82,7 @@ type GradientTexture = {
 };
 
 /**
+ * @internal
  * Line bucket class
  */
 export class LineBucket implements Bucket {

package/src/data/bucket/symbol_bucket.ts

@@ -276,6 +276,7 @@ class CollisionBuffers {
 register('CollisionBuffers', CollisionBuffers);
 
 /**
+ * @internal
  * Unlike other buckets, which simply implement #addFeature with type-specific
  * logic for (essentially) triangulating feature geometries, SymbolBucket
  * requires specialized behavior:

package/src/data/feature_index.ts

@@ -40,6 +40,7 @@ type QueryParameters = {
 };
 
 /**
+ * @internal
  * An in memory index class to allow fast interaction with features
  */
 export class FeatureIndex {

package/src/data/program_configuration.ts

@@ -393,6 +393,7 @@ class CrossFadedCompositeBinder implements AttributeBinder {
 }
 
 /**
+ * @internal
  * ProgramConfiguration contains the logic for binding style layer properties and tile
  * layer feature data into GL program uniforms and vertex attributes.
  *

package/src/data/segment.ts

@@ -6,6 +6,7 @@ import type {VertexArrayObject} from '../render/vertex_array_object';
 import type {StructArray} from '../util/struct_array';
 
 /**
+ * @internal
  * A single segment of a vector
  */
 export type Segment = {
@@ -18,6 +19,7 @@ export type Segment = {
 };
 
 /**
+ * @internal
  * Used for calculations on vector segments
  */
 export class SegmentVector {

package/src/geo/transform.ts

@@ -14,6 +14,7 @@ import type {PaddingOptions} from './edge_insets';
 import {Terrain} from '../render/terrain';
 
 /**
+ * @internal
  * A single transform, generally used for a single tile to be
  * scaled, rotated, and zoomed.
  */

package/src/gl/context.ts

@@ -24,6 +24,7 @@ type ClearArgs = {
 };
 
 /**
+ * @internal
  * A webgl wrapper class to allow injection, mocking and abstaction
  */
 export class Context {

package/src/gl/framebuffer.ts

@@ -3,6 +3,7 @@ import {ColorAttachment, DepthAttachment, DepthStencilAttachment} from './value'
 import type {Context} from './context';
 
 /**
+ * @internal
  * A framebuffer holder object
  */
 export class Framebuffer {

package/src/gl/index_buffer.ts

@@ -4,6 +4,7 @@ import type {TriangleIndexArray, LineIndexArray, LineStripIndexArray} from '../d
 import type {Context} from '../gl/context';
 
 /**
+ * @internal
  * an index buffer class
  */
 export class IndexBuffer {

package/src/gl/render_pool.ts

@@ -10,7 +10,8 @@ export type PoolObject = {
     inUse: boolean;
 };
 /**
- * RenderPool a resource pool for textures and framebuffers
+ * @internal
+ * `RenderPool` is a resource pool for textures and framebuffers
  */
 export class RenderPool {
     private _objects: Array<PoolObject>;

package/src/gl/vertex_buffer.ts

@@ -21,6 +21,7 @@ const AttributeType = {
 };
 
 /**
+ * @internal
  * The `VertexBuffer` class turns a `StructArray` into a WebGL buffer. Each member of the StructArray's
  * Struct type is converted to a WebGL attribute.
  */

package/src/render/image_atlas.ts

@@ -61,6 +61,7 @@ export class ImagePosition {
 }
 
 /**
+ * @internal
  * A class holding all the images
  */
 export class ImageAtlas {

package/src/render/line_atlas.ts

@@ -12,6 +12,7 @@ type DashEntry = {
 }
 
 /**
+ * @internal
  * A LineAtlas lets us reuse rendered dashed lines
  * by writing many of them to a texture and then fetching their positions
  * using {@link LineAtlas#getDash}.

package/src/render/painter.ts

@@ -61,6 +61,7 @@ type PainterOptions = {
 };
 
 /**
+ * @internal
  * Initialize a new painter object.
  */
 export class Painter {

package/src/render/program.ts

@@ -30,6 +30,7 @@ function getTokenizedAttributesAndUniforms(array: Array<string>): Array<string>
 }
 
 /**
+ * @internal
  * A webgl program to execute in the GPU space
  */
 export class Program<Us extends UniformBindings> {

package/src/render/render_to_texture.ts

@@ -9,7 +9,9 @@ import {RenderPool} from '../gl/render_pool';
 import {Texture} from './texture';
 import type {StyleLayer} from '../style/style_layer';
 
-// lookup table which layers should rendered to texture
+/**
+ * lookup table which layers should rendered to texture
+ */
 const LAYERS: { [keyof in StyleLayer['type']]?: boolean } = {
     background: true,
     fill: true,
@@ -19,30 +21,45 @@ const LAYERS: { [keyof in StyleLayer['type']]?: boolean } = {
 };
 
 /**
- * RenderToTexture
+ * @internal
+ * A helper class to help define what should be rendered to texture and how
  */
 export class RenderToTexture {
     painter: Painter;
     terrain: Terrain;
     pool: RenderPool;
-    // coordsDescendingInv contains a list of all tiles which should be rendered for one render-to-texture tile
-    // e.g. render 4 raster-tiles with size 256px to the 512px render-to-texture tile
+    /**
+     * coordsDescendingInv contains a list of all tiles which should be rendered for one render-to-texture tile
+     * e.g. render 4 raster-tiles with size 256px to the 512px render-to-texture tile
+     */
     _coordsDescendingInv: {[_: string]: {[_:string]: Array<OverscaledTileID>}};
-    // create a string representation of all to tiles rendered to render-to-texture tiles
-    // this string representation is used to check if tile should be re-rendered.
+    /**
+     * create a string representation of all to tiles rendered to render-to-texture tiles
+     * this string representation is used to check if tile should be re-rendered.
+     */
     _coordsDescendingInvStr: {[_: string]: {[_:string]: string}};
-    // store for render-stacks
-    // a render stack is a set of layers which should be rendered into one texture
-    // every stylesheet can have multiple stacks. A new stack is created if layers which should
-    // not rendered to texture sit inbetween layers which should rendered to texture. e.g. hillshading or symbols
+    /**
+     * store for render-stacks
+     * a render stack is a set of layers which should be rendered into one texture
+     * every stylesheet can have multiple stacks. A new stack is created if layers which should
+     * not rendered to texture sit inbetween layers which should rendered to texture. e.g. hillshading or symbols
+     */
     _stacks: Array<Array<string>>;
-    // remember the previous processed layer to check if a new stack is needed
+    /**
+     * remember the previous processed layer to check if a new stack is needed
+     */
     _prevType: string;
-    // a list of tiles that can potentially rendered
+    /**
+     * a list of tiles that can potentially rendered
+     */
     _renderableTiles: Array<Tile>;
-    // a list of tiles that should be rendered to screen in the next render-call
+    /**
+     * a list of tiles that should be rendered to screen in the next render-call
+     */
     _rttTiles: Array<Tile>;
-    // a list of all layer-ids which should be rendered
+    /**
+     * a list of all layer-ids which should be rendered
+     */
     _renderableLayerIds: Array<string>;
 
     constructor(painter: Painter, terrain: Terrain) {

package/src/render/terrain.ts

@@ -21,6 +21,7 @@ import type {TerrainSpecification} from '@maplibre/maplibre-gl-style-spec';
 import {LngLat, earthRadius} from '../geo/lng_lat';
 
 /**
+ * @internal
  * A terrain GPU related object
  */
 export type TerrainData = {
@@ -36,6 +37,7 @@ export type TerrainData = {
 }
 
 /**
+ * @internal
  * A terrain mesh object
  */
 export type TerrainMesh = {
@@ -45,6 +47,7 @@ export type TerrainMesh = {
 }
 
 /**
+ * @internal
  * This is the main class which handles most of the 3D Terrain logic. It has the following topics:
  *    1) loads raster-dem tiles via the internal sourceCache this.sourceCache
  *    2) creates a depth-framebuffer, which is used to calculate the visibility of coordinates

package/src/render/texture.ts

@@ -16,6 +16,7 @@ type DataTextureImage = RGBAImage | AlphaImage | EmptyImage;
 export type TextureImage = TexImageSource | DataTextureImage;
 
 /**
+ * @internal
  * A `Texture` GL related object
  */
 export class Texture {

package/src/render/uniform_binding.ts

@@ -11,6 +11,7 @@ export type UniformValues<Us extends {}> = $ObjMap<Us, <V>(u: Uniform<V>) => V>;
 export type UniformLocations = {[_: string]: WebGLUniformLocation};
 
 /**
+ * @internal
  * A base uniform abstract class
  */
 abstract class Uniform<T> {
@@ -150,6 +151,7 @@ export {
 };
 
 /**
+ * @internal
  * A uniform bindings
  */
 export type UniformBindings = {[_: string]: Uniform<any>};

package/src/render/vertex_array_object.ts

@@ -5,6 +5,7 @@ import type {IndexBuffer} from '../gl/index_buffer';
 import type {Context} from '../gl/context';
 
 /**
+ * @internal
  * A vertex array object used to pass data to the webgl code
  */
 export class VertexArrayObject {

package/src/shaders/symbol_sdf.fragment.glsl

@@ -33,16 +33,22 @@ void main() {
 
     lowp vec4 color = fill_color;
     highp float gamma = EDGE_GAMMA / (fontScale * u_gamma_scale);
-    lowp float buff = (256.0 - 64.0) / 256.0;
+    lowp float inner_edge = (256.0 - 64.0) / 256.0;
     if (u_is_halo) {
         color = halo_color;
         gamma = (halo_blur * 1.19 / SDF_PX + EDGE_GAMMA) / (fontScale * u_gamma_scale);
-        buff = (6.0 - halo_width / fontScale) / SDF_PX;
+        inner_edge = inner_edge + gamma * gamma_scale;
     }
 
     lowp float dist = texture(u_texture, tex).a;
     highp float gamma_scaled = gamma * gamma_scale;
-    highp float alpha = smoothstep(buff - gamma_scaled, buff + gamma_scaled, dist);
+    highp float alpha = smoothstep(inner_edge - gamma_scaled, inner_edge + gamma_scaled, dist);
+    if (u_is_halo) {
+        // When drawing halos, we want the inside of the halo to be transparent as well
+        // in case the text fill is transparent.
+        lowp float halo_edge = (6.0 - halo_width / fontScale) / SDF_PX;
+        alpha = min(smoothstep(halo_edge - gamma_scaled, halo_edge + gamma_scaled, dist), 1.0 - alpha);
+    }
 
     fragColor = color * (alpha * opacity * fade_opacity);