Fix TypeScript typings (#787)

Fixes #776 

* Initial commit to fix array types

* Rename get/setType to get/setSourceType

* Last fixes beside conflict in dom.d.ts

* Fix build

* Fix lint

* Fix rename

* Fix types in tests

* Fix type error in test

* Copy grid-index from mapbox and migrate to TypeScript

* Add vector tile to declaration file

* Copy grid-index unit tests from mapbox

* Move static methods into the right class

* Added serialization test, bump version, added changelog remarks

* Move @types/pbf to dependencies

Co-authored-by: HarelM <harel.mazor@gmail.com>

Author: wipfli

CHANGELOG.md

@@ -8,6 +8,12 @@
 
 - *...Add new stuff here...*
 
+## 2.0.2
+
+### 🐞 Bug fixes
+
+- Fix typescript generated file (#776).
+
 ## 2.0.1
 
 ### 🐞 Bug fixes

build/generate-struct-arrays.ts

@@ -87,7 +87,7 @@ function createStructArrayType(name: string, layout: StructArrayLayout, includeS
             includeStructAccessors
         });
     } else {
-        arrayTypeEntries.add(`${layoutClass} as ${arrayClass}`);
+        arrayTypeEntries.add(`export class ${arrayClass} extends ${layoutClass} {}`);
     }
 }
 
@@ -432,8 +432,8 @@ import Point from '../util/point';
 
 ${layouts.map(emitStructArrayLayout).join('\n')}
 ${arraysWithStructAccessors.map(emitStructArray).join('\n')}
+${[...arrayTypeEntries].join('\n')}
 export {
-    ${layouts.map(layout => layout.className).join(',\n    ')},
-    ${[...arrayTypeEntries].join(',\n    ')}
+    ${layouts.map(layout => layout.className).join(',\n    ')}
 };
 `);

build/post-ts-build.js

@@ -35,7 +35,17 @@ console.log(`Starting bundling types`);
 const outputFile = "./dist/maplibre-gl.d.ts";
 child_process.execSync(`dts-bundle-generator --no-check --umd-module-name=maplibregl -o ${outputFile} ./src/index.ts`);
 let types = fs.readFileSync(outputFile, 'utf8');
+// Classes are not exported but should be since this is exported as UMD - fixing...
 types = types.replace(/declare class/g, "export declare class");
+// Missing vector-tile types that are added to this file too
+let file = fs.readFileSync("./src/types/packages-types/vector-tile/index.d.ts", 'utf8');
+let lines = file.split("\n").filter(Boolean);
+lines.pop(); // last } is removed too.
+types = lines.join("\n") + "\n" + types;
+// remove imports of vector-tile and declare module lines
+types = types.split("\n")
+    .filter(l => !l.includes("@mapbox/vector-tile"))
+    .join("\n");
 fs.writeFileSync(outputFile, types);
 console.log(`Finished bundling types`);
 

package-lock.json

@@ -1,7 +1,7 @@
 {
   "name": "maplibre-gl",
   "description": "BSD licensed community fork of mapbox-gl, a WebGL interactive maps library",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "main": "dist/maplibre-gl.js",
   "style": "dist/maplibre-gl.css",
   "license": "BSD-3-Clause",
@@ -22,11 +22,11 @@
     "@mapbox/unitbezier": "^0.0.1",
     "@mapbox/vector-tile": "^1.3.1",
     "@mapbox/whoots-js": "^3.1.0",
+    "@types/pbf": "^3.0.2",
     "csscolorparser": "~1.0.3",
     "earcut": "^2.2.2",
     "geojson-vt": "^3.2.1",
     "gl-matrix": "^3.2.1",
-    "grid-index": "^1.1.0",
     "murmurhash-js": "^1.0.0",
     "pbf": "^3.2.1",
     "potpack": "^1.0.1",
@@ -69,7 +69,6 @@
     "@types/node-notifier": "^8.0.0",
     "@types/npm-packlist": "^1.1.1",
     "@types/offscreencanvas": "^2019.6.3",
-    "@types/pbf": "^3.0.2",
     "@types/pixelmatch": "^5.2.2",
     "@types/pngjs": "^6.0.1",
     "@types/puppeteer": "^5.4.4",

package.json

@@ -1031,6 +1031,25 @@ export class FeatureIndexArray extends StructArrayLayout1ul2ui8 {
 
 register('FeatureIndexArray', FeatureIndexArray);
 
+export class PosArray extends StructArrayLayout2i4 {}
+export class RasterBoundsArray extends StructArrayLayout4i8 {}
+export class CircleLayoutArray extends StructArrayLayout2i4 {}
+export class FillLayoutArray extends StructArrayLayout2i4 {}
+export class FillExtrusionLayoutArray extends StructArrayLayout2i4i12 {}
+export class HeatmapLayoutArray extends StructArrayLayout2i4 {}
+export class LineLayoutArray extends StructArrayLayout2i4ub8 {}
+export class LineExtLayoutArray extends StructArrayLayout2f8 {}
+export class PatternLayoutArray extends StructArrayLayout10ui20 {}
+export class SymbolLayoutArray extends StructArrayLayout4i4ui4i24 {}
+export class SymbolDynamicLayoutArray extends StructArrayLayout3f12 {}
+export class SymbolOpacityArray extends StructArrayLayout1ul4 {}
+export class CollisionBoxLayoutArray extends StructArrayLayout2i2i2i12 {}
+export class CollisionCircleLayoutArray extends StructArrayLayout2f1f2i16 {}
+export class CollisionVertexArray extends StructArrayLayout2ub2f12 {}
+export class QuadTriangleArray extends StructArrayLayout3ui6 {}
+export class TriangleIndexArray extends StructArrayLayout3ui6 {}
+export class LineIndexArray extends StructArrayLayout2ui4 {}
+export class LineStripIndexArray extends StructArrayLayout1ui2 {}
 export {
     StructArrayLayout2i4,
     StructArrayLayout4i8,
@@ -1053,24 +1072,5 @@ export {
     StructArrayLayout1ul2ui8,
     StructArrayLayout2ui4,
     StructArrayLayout1ui2,
-    StructArrayLayout4f16,
-    StructArrayLayout2i4 as PosArray,
-    StructArrayLayout4i8 as RasterBoundsArray,
-    StructArrayLayout2i4 as CircleLayoutArray,
-    StructArrayLayout2i4 as FillLayoutArray,
-    StructArrayLayout2i4i12 as FillExtrusionLayoutArray,
-    StructArrayLayout2i4 as HeatmapLayoutArray,
-    StructArrayLayout2i4ub8 as LineLayoutArray,
-    StructArrayLayout2f8 as LineExtLayoutArray,
-    StructArrayLayout10ui20 as PatternLayoutArray,
-    StructArrayLayout4i4ui4i24 as SymbolLayoutArray,
-    StructArrayLayout3f12 as SymbolDynamicLayoutArray,
-    StructArrayLayout1ul4 as SymbolOpacityArray,
-    StructArrayLayout2i2i2i12 as CollisionBoxLayoutArray,
-    StructArrayLayout2f1f2i16 as CollisionCircleLayoutArray,
-    StructArrayLayout2ub2f12 as CollisionVertexArray,
-    StructArrayLayout3ui6 as QuadTriangleArray,
-    StructArrayLayout3ui6 as TriangleIndexArray,
-    StructArrayLayout2ui4 as LineIndexArray,
-    StructArrayLayout1ui2 as LineStripIndexArray
+    StructArrayLayout4f16
 };

src/data/array_types.ts

@@ -42,7 +42,7 @@ test('FillBucket', () => {
             new Point(10, 20)
         ]], undefined, undefined, undefined);
 
-        bucket.addFeature(feature, feature.loadGeometry(), undefined, undefined, undefined);
+        bucket.addFeature(feature as any, feature.loadGeometry(), undefined, undefined, undefined);
     }).not.toThrow();
 });
 

src/data/bucket/fill_bucket.test.ts

@@ -96,7 +96,7 @@ describe('LineBucket', () => {
                 new Point(0, 0)
             ], polygon, undefined, undefined, undefined, undefined);
 
-            bucket.addFeature(feature, feature.loadGeometry(), undefined, undefined, undefined);
+            bucket.addFeature(feature as any, feature.loadGeometry(), undefined, undefined, undefined);
         }).not.toThrow();
     });
 

src/data/bucket/line_bucket.test.ts

@@ -3,7 +3,7 @@ import loadGeometry from './load_geometry';
 import toEvaluationFeature from './evaluation_feature';
 import EXTENT from './extent';
 import featureFilter from '../style-spec/feature_filter';
-import TransferableGridIndex from 'grid-index';
+import TransferableGridIndex from '../util/transferable_grid_index';
 import DictionaryCoder from '../util/dictionary_coder';
 import vt from '@mapbox/vector-tile';
 import Protobuf from 'pbf';
@@ -296,7 +296,7 @@ class FeatureIndex {
         let id: string | number = feature.id;
         if (this.promoteId) {
             const propName = typeof this.promoteId === 'string' ? this.promoteId : this.promoteId[sourceLayerId];
-            id = feature.properties[propName];
+            id = feature.properties[propName] as string | number;
             if (typeof id === 'boolean') id = Number(id);
         }
         return id;

src/data/feature_index.ts

@@ -1,5 +1,4 @@
 /// <reference path="./types/glsl.d.ts" />
-/// <reference path="./types/non-typed-modules.d.ts" />
 import assert from 'assert';
 import {supported} from '@mapbox/mapbox-gl-supported';