@maptiler/sdk 3.2.2 → 3.3.0-rc3

package/dist/src/Map.d.ts

@@ -4,6 +4,8 @@ import { SdkConfig } from './config';
 import { LanguageInfo } from './language';
 import { MinimapOptionsInput } from './controls/Minimap';
 import { Telemetry } from './Telemetry';
+import { CubemapDefinition, CubemapLayer, CubemapLayerConstructorOptions } from './custom-layers/CubemapLayer';
+import { GradientDefinition, RadialGradientLayer, RadialGradientLayerOptions } from './custom-layers/RadialGradientLayer';
 export type LoadWithTerrainEvent = {
     type: "loadWithTerrain";
     target: Map;
@@ -125,13 +127,32 @@ export type MapOptions = Omit<MapOptionsML, "style" | "maplibreLogo"> & {
      * If not provided, the style takes precedence. If provided, overwrite the style.
      */
     projection?: ProjectionTypes;
+    /**
+     * Turn on/off spacebox.
+     *
+     * Default: { color: "#1D29F1" }
+     */
+    space?: CubemapLayerConstructorOptions | boolean;
+    halo?: RadialGradientLayerOptions | boolean;
 };
 /**
  * The Map class can be instanciated to display a map in a `<div>`
  */
 export declare class Map extends maplibregl.Map {
-    private options;
     readonly telemetry: Telemetry;
+    private space?;
+    private halo?;
+    getSpace(): CubemapLayer | undefined;
+    setSpace(space: CubemapDefinition): void;
+    private setSpaceFromStyle;
+    private setHaloFromStyle;
+    private setSpaceFromCurrentStyle;
+    private setHaloFromCurrentStyle;
+    private initSpace;
+    private initHalo;
+    getHalo(): RadialGradientLayer | undefined;
+    setHalo(halo: GradientDefinition): void;
+    private options;
     private isTerrainEnabled;
     private terrainExaggeration;
     private primaryLanguage;

package/dist/src/custom-layers/CubemapLayer/CubemapLayer.d.ts

@@ -0,0 +1,33 @@
+import { CustomLayerInterface, CustomRenderMethodInput } from 'maplibre-gl';
+import { Map as MapSDK } from '../../Map';
+import { WebGLContext } from '../../utils/webgl-utils';
+import { CubemapDefinition, CubemapLayerConstructorOptions } from './types';
+declare class CubemapLayer implements CustomLayerInterface {
+    id: string;
+    type: CustomLayerInterface["type"];
+    renderingMode: CustomLayerInterface["renderingMode"];
+    private map;
+    private faces?;
+    private useCubemapTexture;
+    private currentFadeOpacity;
+    private cubeMapNeedsUpdate;
+    private bgColor;
+    private previousBgColor;
+    private targetBgColor;
+    private transitionDelta;
+    private gl;
+    private cubemap?;
+    private texture?;
+    constructor(cubemapConfig: CubemapLayerConstructorOptions | true);
+    updateCubemap(): void;
+    onAdd(map: MapSDK, gl: WebGLRenderingContext | WebGL2RenderingContext): void;
+    onRemove(_map: MapSDK, gl: WebGLRenderingContext | WebGL2RenderingContext): void;
+    prerender(gl: WebGLContext, _options: CustomRenderMethodInput): void;
+    private animateTo;
+    private animateIn;
+    render(gl: WebGLRenderingContext | WebGL2RenderingContext, _options: CustomRenderMethodInput): void;
+    setCubemap(cubemap: CubemapDefinition): void;
+    show(): void;
+    hide(): void;
+}
+export { CubemapLayer };

package/dist/src/custom-layers/CubemapLayer/constants.d.ts

@@ -0,0 +1,3 @@
+declare const VERTICES: number[];
+declare const INDICES: number[];
+export { VERTICES, INDICES };

package/dist/src/custom-layers/CubemapLayer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CubemapLayer';
+export * from './types';

package/dist/src/custom-layers/CubemapLayer/loadCubemapTexture.d.ts

@@ -0,0 +1,6 @@
+import { CubemapFaces } from './types';
+export declare function loadCubemapTexture({ gl, faces, onLoadedCallback }: {
+    gl: WebGLRenderingContext | WebGL2RenderingContext;
+    faces?: CubemapFaces;
+    onLoadedCallback?: () => void;
+}): WebGLTexture | undefined;

package/dist/src/custom-layers/CubemapLayer/types.d.ts

@@ -0,0 +1,37 @@
+export declare enum CubemapImagesPresets {
+    UNIVERSE_DARK = "universe-dark"
+}
+export type CubemapLayerConstructorOptions = CubemapDefinition & {};
+export type CubemapDefinition = {
+    path: {
+        baseUrl: string;
+        format?: "png" | "jpg" | "webp";
+    };
+    faces?: never;
+    preset?: never;
+    color?: string;
+} | {
+    faces: CubemapFaces;
+    path?: never;
+    preset?: never;
+    color?: string;
+} | {
+    preset: string;
+    path?: never;
+    faces?: never;
+    color?: string;
+} | {
+    color: string;
+    path?: never;
+    faces?: never;
+    preset?: never;
+};
+export declare enum CubemapFaceNames {
+    POSITIVE_X = "pX",
+    NEGATIVE_X = "nX",
+    POSITIVE_Y = "pY",
+    NEGATIVE_Y = "nY",
+    POSITIVE_Z = "pZ",
+    NEGATIVE_Z = "nZ"
+}
+export type CubemapFaces = Record<CubemapFaceNames, string>;

package/dist/src/custom-layers/RadialGradientLayer/RadialGradientLayer.d.ts

@@ -0,0 +1,26 @@
+import { CustomLayerInterface, CustomRenderMethodInput } from 'maplibre-gl';
+import { Map as MapSDK } from '../../Map';
+import { GradientDefinition, RadialGradientLayerOptions } from './types';
+export declare class RadialGradientLayer implements CustomLayerInterface {
+    id: string;
+    type: CustomLayerInterface["type"];
+    renderingMode: CustomLayerInterface["renderingMode"];
+    private gradient;
+    private scale;
+    private animationDelta;
+    private map;
+    private plane?;
+    constructor(gradient: RadialGradientLayerOptions | boolean);
+    onAdd(map: MapSDK, gl: WebGLRenderingContext | WebGL2RenderingContext): void;
+    private animateIn;
+    private animateOut;
+    onRemove(_map: MapSDK, gl: WebGLRenderingContext | WebGL2RenderingContext): void;
+    prerender(_gl: WebGLRenderingContext | WebGL2RenderingContext, _options: CustomRenderMethodInput): void;
+    render(gl: WebGLRenderingContext | WebGL2RenderingContext, options: CustomRenderMethodInput): void;
+    /**
+     * Value settings methods
+     */
+    setGradient(gradient: GradientDefinition): Promise<void>;
+    show(): void;
+    hide(): void;
+}

package/dist/src/custom-layers/RadialGradientLayer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './RadialGradientLayer';
+export * from './types';

package/dist/src/custom-layers/RadialGradientLayer/types.d.ts

@@ -0,0 +1,11 @@
+import { Object3D } from '../../utils/webgl-utils';
+export type Color = string;
+export type GradientStop = number;
+export type RadialGradientLayerOptions = GradientDefinition;
+export type GradientDefinition = {
+    stops: Array<[GradientStop, Color]>;
+    scale: number;
+};
+export type GradientAttributeKey = "vertexPosition";
+export type GradientUniformKey = "stopsNumber" | "stops" | "colors";
+export type GradientPlaneObject3D = Pick<Object3D<GradientAttributeKey, GradientUniformKey>, "shaderProgram" | "programInfo" | "positionBuffer">;

package/dist/src/custom-layers/extractCustomLayerStyle.d.ts

@@ -0,0 +1,17 @@
+import { Map as MapSDK } from '../Map';
+import { StyleSpecification } from 'maplibre-gl';
+import { CubemapLayerConstructorOptions, RadialGradientLayerOptions } from 'custom-layers';
+export type StyleSpecificationWithMetaData = StyleSpecification & {
+    metadata?: {
+        "maptiler:copyright": string;
+        maptiler?: {
+            halo: RadialGradientLayerOptions;
+            space: CubemapLayerConstructorOptions;
+        };
+    };
+};
+export interface IExtractCustomLayerStyleOptions {
+    map: MapSDK;
+    property: "halo" | "space";
+}
+export default function extractCustomLayerStyle<T extends CubemapLayerConstructorOptions | RadialGradientLayerOptions | null>(options: IExtractCustomLayerStyleOptions): T | null;

package/dist/src/custom-layers/index.d.ts

@@ -0,0 +1,5 @@
+import { RadialGradientLayer } from './RadialGradientLayer';
+import { CubemapLayer } from './CubemapLayer';
+export { RadialGradientLayer, CubemapLayer };
+export * from './RadialGradientLayer/types';
+export * from './CubemapLayer/types';

package/dist/src/helpers/index.d.ts

@@ -1,3 +1,13 @@
-export * from './screenshot';
-export * from './vectorlayerhelpers';
-export * from './stylehelper';
+import { takeScreenshot } from './screenshot';
+import { addPolyline, addPolygon, addPoint, addHeatmap } from './vectorlayerhelpers';
+export type { ZoomStringValues, ZoomNumberValues, PropertyValues, CommonShapeLayerOptions, PolylineLayerOptions, PolygonLayerOptions, PointLayerOptions, HeatmapLayerOptions, } from './vectorlayerhelpers';
+/**
+ * Helpers are a set of functions to facilitate the creation of sources and layers
+ */
+export declare const helpers: {
+    addPolyline: typeof addPolyline;
+    addPolygon: typeof addPolygon;
+    addPoint: typeof addPoint;
+    addHeatmap: typeof addHeatmap;
+    takeScreenshot: typeof takeScreenshot;
+};

package/dist/src/utils/geo-utils.d.ts

@@ -0,0 +1,6 @@
+import { LngLat } from 'maplibre-gl';
+declare function getAntipode(lngLat: LngLat): {
+    lat: number;
+    lng: number;
+};
+export { getAntipode };

package/dist/src/utils/math-utils.d.ts

@@ -0,0 +1,8 @@
+import { Vec4 } from './webgl-utils';
+declare function minMax(value: number, min: number, max: number): number;
+declare function normalize(value: number, min: number, max: number): number;
+declare function diagonalOfSquare(side: number): number;
+type Lerpable = [number, number, number, number] | Vec4;
+declare function lerpVec4(a: Lerpable, b: Lerpable, t: number): Vec4;
+declare function lerp(a: number, b: number, t: number): number;
+export { minMax, normalize, diagonalOfSquare, lerpVec4, lerp };

package/dist/src/utils/webgl-utils.d.ts

@@ -0,0 +1,49 @@
+export type WebGLContext = WebGLRenderingContext | WebGL2RenderingContext;
+/**
+ * Load a shader from a source string
+ */
+export declare function loadShader({ gl, type, source }: {
+    gl: WebGLContext;
+    type: GLenum;
+    source: string;
+}): WebGLShader;
+/**
+ * Create a set of shaders (vertex and fragment) and link them into a program
+ *
+ * @param gl WebGL context
+ * @param vertexShaderSource Vertex shader source code
+ * @param fragmentShaderSource Fragment shader source code
+ *
+ * @returns WebGL program
+ */
+export declare function createShadersSetProgram({ gl, vertexShaderSource, fragmentShaderSource }: {
+    gl: WebGLContext;
+    vertexShaderSource: string;
+    fragmentShaderSource: string;
+}): WebGLProgram;
+/**
+ * null-free version of getUniformLocation
+ */
+export declare function getUniformLocation(gl: WebGLRenderingContext | WebGL2RenderingContext, program: WebGLProgram, name: string): WebGLUniformLocation;
+export type Object3D<Attribute extends string, Uniform extends string> = {
+    shaderProgram: WebGLProgram;
+    programInfo: {
+        attributesLocations: Record<Attribute, number>;
+        uniformsLocations: Record<Uniform, WebGLUniformLocation>;
+    };
+    positionBuffer: WebGLBuffer;
+    indexBuffer?: WebGLBuffer;
+    indexBufferLength?: number;
+};
+export declare function createObject3D<Attribute extends string, Uniform extends string>({ gl, vertexShaderSource, fragmentShaderSource, attributesKeys, uniformsKeys, vertices, indices, }: {
+    gl: WebGLContext;
+    vertexShaderSource: string;
+    fragmentShaderSource: string;
+    attributesKeys: readonly Attribute[];
+    uniformsKeys: readonly Uniform[];
+    vertices: Array<number>;
+    indices?: Array<number>;
+}): Object3D<Attribute, Uniform>;
+export type Vec4 = [number, number, number, number];
+export declare function parseColorStringToVec4(color?: string): Vec4;
+export declare function degreesToRadians(degrees: number): number;

package/eslint.config.mjs

@@ -8,77 +8,6 @@ export default tseslint.config(
   tseslint.configs.strictTypeChecked,
   tseslint.configs.stylisticTypeChecked,
   tseslint.configs.recommendedTypeChecked,
-  {
-    // forked from https://www.npmjs.com/package/eslint-plugin-restrict-imports
-    plugins: {
-      import: {
-        rules: {
-          "default-imports-only": {
-            meta: {
-              type: "suggestion",
-              docs: {},
-              schema: [
-                {
-                  bannedImport: {
-                    locations: ["filePaths"],
-                    message: "string",
-                    fixedLocation: "string",
-                  },
-                },
-              ],
-            },
-            create: function (context) {
-              const filePath = context.getFilename();
-              const options = context.options[0] || {
-                "^/(.*)": {
-                  locations: ["(.*)"],
-                },
-              };
-
-              return {
-                ImportDeclaration: (node) => {
-                  Object.entries(options).forEach(([bannedImport, config]) => {
-                    const importLocationRegex = new RegExp(bannedImport);
-
-                    if (config.ignoreTypeImports && node.importKind === "type") return;
-
-                    if (importLocationRegex.test(node.source.value)) {
-                      config.locations.forEach((fp) => {
-                        const bannedLocationRegex = new RegExp(fp);
-
-                        if (bannedLocationRegex.test(filePath)) {
-                          node.specifiers.forEach((specifier) => {
-                            if (specifier.type !== "ImportDefaultSpecifier") {
-                              context.report({
-                                message: config.message ?? `Importing from '${bannedImport}' is banned in '${fp}'`,
-                                node,
-                              });
-                            }
-                          });
-                        }
-                      });
-                    }
-                  });
-                },
-              };
-            },
-          },
-        },
-      },
-    },
-    rules: {
-      "import/default-imports-only": [
-        "error",
-        {
-          "maplibre-gl$": {
-            locations: ["^(?!.*\.d\.ts$).*\.((ts|js))$"],
-            message: `Maplibre-gl uses CJS modules, only default imports are supported, named imports may fail on some setups.`,
-            ignoreTypeImports: true,
-          },
-        },
-      ],
-    },
-  },
   {
     languageOptions: {
       parserOptions: {
@@ -106,7 +35,7 @@ export default tseslint.config(
       "@typescript-eslint/no-unnecessary-condition": "warn",
       "@typescript-eslint/no-unnecessary-type-arguments": "off",
       "@typescript-eslint/no-unnecessary-type-assertion": "off",
-      "@typescript-eslint/no-unnecessary-type-parameters": "warn",
+      "@typescript-eslint/no-unnecessary-type-parameters": "off", // as we are a lib, types serve as documentation
       "@typescript-eslint/no-unused-vars": "warn",
       "@typescript-eslint/no-unsafe-argument": "warn",
       "@typescript-eslint/no-unsafe-assignment": "warn",

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@maptiler/sdk",
-  "version": "3.2.2",
+  "version": "3.3.0-rc3",
   "description": "The Javascript & TypeScript map SDK tailored for MapTiler Cloud",
   "author": "MapTiler",
   "module": "dist/maptiler-sdk.mjs",
   "types": "dist/maptiler-sdk.d.ts",
   "style": "dist/maptiler-sdk.css",
   "type": "module",
+  "main": "dist/maptiler-sdk.mjs",
   "exports": {
     ".": {
       "import": "./dist/maptiler-sdk.mjs",
@@ -54,9 +55,14 @@
   "lint-staged": {
     "*.ts": "npm run lint:fix"
   },
+  "ts-typecheck": {
+    "*.ts": "npm tsc --noEmit"
+  },
   "devDependencies": {
     "@canvas/image-data": "^1.0.0",
     "@eslint/js": "^9.21.0",
+    "@types/color-convert": "^2.0.4",
+    "@types/color-name": "^2.0.0",
     "@types/uuid": "^10.0.0",
     "@types/xmldom": "^0.1.31",
     "@vitest/web-worker": "^3.0.9",
@@ -78,10 +84,11 @@
   },
   "dependencies": {
     "@maplibre/maplibre-gl-style-spec": "^23.0.0",
-    "@maptiler/client": "^2.3.2",
+    "@maptiler/client": "^2.3.0",
     "events": "^3.3.0",
+    "gl-matrix": "^3.4.3",
     "js-base64": "^3.7.7",
-    "maplibre-gl": "^5.3.1",
+    "maplibre-gl": "^5.0.1",
     "uuid": "^11.0.5"
   }
 }

package/tsconfig.json

@@ -26,6 +26,7 @@
   },
   "include": [
     "src",
+    "./eslint.config.mjs",
     "test",
     "./vite.config-test.ts",
     "./vitest-setup-tests.ts"