@maptiler/sdk 3.10.2 → 3.11.0-rc.1

package/dist/src/ImageViewer/ImageViewer.d.ts

@@ -4,7 +4,7 @@ import { Map } from '../Map';
 import { ImageViewerFitImageToBoundsControl } from '../controls/ImageViewerFitImageToBoundsControl';
 import { lngLatToPxInternalSymbolKey, pxToLngLatInternalSymbolKey } from './symbols';
 declare const Evented: typeof MaplibreGL.Evented;
-export type AllowedConstrcutorOptions = "container" | "apiKey" | "maxZoom" | "minZoom" | "zoom" | "bearing";
+export type AllowedConstructorOptions = "container" | "apiKey" | "maxZoom" | "minZoom" | "zoom" | "bearing";
 export type ImageViewerFlyToOptions = Omit<FlyToOptions, "pitch"> & {
     center: [number, number];
 };
@@ -14,7 +14,7 @@ export type ImageViewerJumpToOptions = Omit<JumpToOptions, "pitch"> & {
 export type ImageViewerEaseToOptions = Omit<EaseToOptions, "pitch"> & {
     center: [number, number];
 };
-export type ImageViewerConstructorOptions = Pick<MapOptions, AllowedConstrcutorOptions> & {
+export type ImageViewerConstructorOptions = Pick<MapOptions, AllowedConstructorOptions> & {
     /**
      * The UUID of the image.
      */

package/dist/src/Map.d.ts

@@ -154,6 +154,22 @@ export type MapOptions = Omit<MapOptionsML, "style" | "maplibreLogo"> & {
      */
     rtlTextPlugin?: boolean | string;
 };
+/**
+ * Options to provide to the {@link Map.setProjection} method
+ */
+export interface ProjectionChangeOptions {
+    /**
+     * Whether the new projection should be persisted for any future style changes.
+     *
+     * If `true`, the new projection is persisted and is applied after all future style changes.
+     * If `false` or not specified, the new projection will be used only until the next style change, when it will get replaced with the first applicable value from this list:
+     * - a previously persisted projection
+     * - a projection specified in {@link Map} constructor options ({@link MapOptions})
+     * - a projection specified in `projection` property of the style itself
+     * - the Mercator projection
+     */
+    persist?: boolean;
+}
 /**
  * The Map class can be instanciated to display a map in a `<div>`
  */
@@ -467,14 +483,38 @@ export declare class Map extends maplibregl.Map {
      */
     isGlobeProjection(): boolean;
     /**
-     * Activate the globe projection.
+     * Activate the globe projection and persist this change during future style changes.
+     * @deprecated Will be removed in v4.0.0. Use `map.setProjection("globe", { persist: true })` instead.
      */
     enableGlobeProjection(): void;
     /**
-     * Activate the mercator projection.
+     * Activate the mercator projection and persist this change during future style changes.
+     * @deprecated Will be removed in v4.0.0. Use `map.setProjection("mercator", { persist: true })` instead.
      */
     enableMercatorProjection(): void;
+    /**
+     * Sets the projection to one of {@linkcode ProjectionTypes}.
+     * @param projection - the projection type to set
+     * @param options - configure behaviour of the projection change
+     */
+    setProjection(projection: NonNullable<ProjectionTypes>, options?: ProjectionChangeOptions): this;
+    /**
+     * Sets the projection to one of {@linkcode ProjectionTypes}.
+     * @param projection - the projection type to set, wrapped in {@link ProjectionSpecification}
+     * @param options - configure behaviour of the projection change
+     */
+    setProjection(projection: {
+        type: NonNullable<ProjectionTypes>;
+    }, options?: ProjectionChangeOptions): this;
+    /**
+     * Sets the projection to a {@linkcode ProjectionSpecification}.
+     * @param projection - the projection specification to set
+     */
     setProjection(projection: maplibregl.ProjectionSpecification): this;
+    /**
+     * Forget the persisted projection - from both constructor option and result of any `map.setProjection(..., { persist: true })` calls.
+     */
+    forgetPersistedProjection(): this;
     /**
      * Returns `true` is the language was ever updated, meaning changed
      * from what is delivered in the style.

package/dist/src/MaptilerAnimation/AnimationManager.d.ts

@@ -0,0 +1,41 @@
+import { MaptilerAnimation } from './index';
+/**
+ * Manager for handling animation lifecycle and updates.
+ *
+ * The AnimationManager provides a centralized system for registering and
+ * coordinating multiple animations. To avoid individual calls to request animation frame
+ * for each animation, it maintains an animation loop
+ *
+ * This is not a class as it never needs to be instantiated,
+ * it's just a singeton object.
+ *
+ * It's not called directly but used within the MaptilerAnimation class.
+ */
+declare const AnimationManager: {
+    animations: MaptilerAnimation[];
+    running: boolean;
+    /**
+     * Adds an animation to the manager. If this is the first animation added,
+     * it starts the animation loop.
+     *
+     * @param {MaptilerAnimation} animation - The animation to add.
+     */
+    add(animation: MaptilerAnimation): void;
+    /**
+     * Removes an animation from the manager. If there are no more animations,
+     * it stops the animation loop.
+     *
+     * @param {MaptilerAnimation} animation - The animation to remove.
+     */
+    remove(animation: MaptilerAnimation): void;
+    /**
+     * Stops the animation loop.
+     */
+    stop(): void;
+    /**
+     * Starts the animation loop. This function is called recursively using
+     * requestAnimationFrame to ensure smooth updates.
+     */
+    start(): void;
+};
+export default AnimationManager;

package/dist/src/MaptilerAnimation/MaptilerAnimation.d.ts

@@ -0,0 +1,238 @@
+import { AnimationEventCallback, AnimationEventTypes, EasingFunctionName, Keyframe } from './types';
+/**
+ * Configuration options for creating an animation.
+ *
+ * @interface MaptilerAnimationOptions
+ * @property {Keyframe[]} keyframes - The keyframes that define the animation states at various points in time.
+ * @property {number} duration - The total duration of the animation in milliseconds.
+ * @property {number} iterations - The number of times the animation should repeat. Use 0 for no repeat, or Infinity for an infinite loop.
+ * @property {delay} [delay] - Optional. The delay before the animation starts, in milliseconds. Defaults to 0 if not specified.
+ * @property {boolean} [manualMode] - Optional. If true, the animation will not be automatically managed by the animation manager
+ *                                   and must be updated manually by calling update(). Defaults to false if not specified.
+ */
+export interface MaptilerAnimationOptions {
+    keyframes: Keyframe[];
+    duration: number;
+    iterations: number;
+    manualMode?: boolean;
+    delay?: number;
+}
+/**
+ * A keyframe in the animation sequence where null or undefined values
+ * are interpolated to fill in the gaps between keyframes.
+ *
+ * @extends Keyframe
+ * @property {Record<string, number>} props - The properties to be animated at this keyframe.
+ * @property {EasingFunctionName} easing - The easing function to use for this keyframe.
+ * @property {string} id - A unique identifier for this keyframe.
+ */
+export type InterpolatedKeyFrame = Keyframe & {
+    props: Record<string, number>;
+    easing: EasingFunctionName;
+    id: string;
+};
+/**
+ * Animation controller for keyframe-based animation sequences.
+ *
+ * MaptilerAnimation handles interpolation between keyframes, timing control,
+ * and event dispatching during animation playback.
+ *
+ * @example
+ * ```typescript
+ * const animation = new MaptilerAnimation({
+ *   keyframes: [
+ *     { delta: 0, props: { x: 0, y: 0 } },
+ *     { delta: 0.5, props: { x: 50, y: 20 } },
+ *     { delta: 1, props: { x: 100, y: 0 } }
+ *   ],
+ *   duration: 1000, // milliseconds
+ *   iterations: 2
+ * });
+ *
+ * animation.addEventListener("timeupdate", (event) => {
+ *   // Use interpolated property values to update something
+ *   console.log(event.props);
+ * });
+ *
+ * animation.play();
+ * ```
+ *
+ * @remarks
+ * The animation supports various playback controls (play, pause, stop, reset),
+ * time manipulation, and an event system for tracking animation progress.
+ * Properties missing in keyframes will be automatically interpolated.
+ *
+ * Animation events include play, pause, stop, timeupdate, iteration, and more.
+ *
+ * When not using manualMode, animations are automatically added to the AnimationManager.
+ */
+export default class MaptilerAnimation {
+    private playing;
+    /**
+     * Indicates if the animation is currently playing
+     * @returns {boolean} - true if the animation is playing, false otherwise
+     */
+    get isPlaying(): boolean;
+    /**
+     * The number of times to repeat the animation
+     * 0 is no repeat, Infinity is infinite repeat
+     */
+    private iterations;
+    private currentIteration;
+    /** An array of keyframes animations to interpolate between */
+    private keyframes;
+    /** The current keyframe id */
+    private currentKeyframe?;
+    /**The duration of the animation in milliseconds (when playbackRate === 1) */
+    readonly duration: number;
+    /**
+     * The duration of the animation affected by the playback rate
+     * if playback rate is 2, the effective duration is double
+     */
+    private effectiveDuration;
+    /** the rate at which the animation is playing */
+    private playbackRate;
+    /** the current time in milliseconds */
+    private currentTime;
+    /** 0 start of the animation, 1 end of the animation */
+    private currentDelta;
+    /** The time at which the animation started */
+    private animationStartTime;
+    /** The time at which the last frame was rendered */
+    private lastFrameAt;
+    /** The delay before the animation starts */
+    private delay;
+    /** The timeout ID for the delay before the animation starts */
+    private delayTimeoutID?;
+    /** The listeners added for each event */
+    private listeners;
+    /** The props from the previous frame */
+    private previousProps;
+    constructor({ keyframes, duration, iterations, manualMode, delay }: MaptilerAnimationOptions);
+    /**
+     * Starts or resumes the animation
+     * @returns This animation instance for method chaining
+     * @event "play"
+     */
+    play(): this;
+    /**
+     * Pauses the animation
+     * @returns This animation instance for method chaining
+     * @event "pause"
+     */
+    pause(): this;
+    /**
+     * Stops the animation and resets to initial state
+     * @returns This animation instance for method chaining
+     * @event "stop"
+     */
+    stop(silent?: boolean): this;
+    /**
+     * Resets the animation to its initial state without stopping
+     * @returns This animation instance for method chaining
+     * @event "reset"
+     */
+    reset(manual?: boolean): this;
+    /**
+     * Updates the animation state if playing, this is used by the AnimationManager
+     * to update all animations in the loop
+     * @returns This animation instance for method chaining
+     */
+    updateInternal(): this;
+    /**
+     * Updates the animation state, interpolating between keyframes
+     * and emitting events as necessary
+     * @event "timeupdate"
+     * @event "keyframe"
+     * @event "iteration"
+     * @event "animationend"
+     * @returns This animation instance for method chaining
+     */
+    update(manual?: boolean, ignoreIteration?: boolean): this;
+    /**
+     * Gets the current and next keyframes at a specific time
+     * @param time - The time position to query
+     * @returns Object containing current and next keyframes, which may be null
+     */
+    getCurrentAndNextKeyFramesAtTime(time: number): {
+        current: InterpolatedKeyFrame | null;
+        next: InterpolatedKeyFrame | null;
+    };
+    /**
+     * Gets the current and next keyframes at a specific delta value
+     * @param delta - The delta value to query
+     * @returns Object containing current and next keyframes, which may be null
+     */
+    getCurrentAndNextKeyFramesAtDelta(delta: number): {
+        current: InterpolatedKeyFrame | null;
+        next: InterpolatedKeyFrame | null;
+    };
+    /**
+     * Gets the current time position of the animation
+     * @returns The current time in milliseconds
+     */
+    getCurrentTime(): number;
+    /**
+     * Sets the current time position of the animation
+     * @param time - The time to set in milliseconds
+     * @returns This animation instance for method chaining
+     * @throws Error if time is greater than the duration
+     * @event "scrub"
+     */
+    setCurrentTime(time: number): this;
+    /**
+     * Gets the current delta value of the animation
+     * @returns The current delta value (normalized progress between 0 and 1)
+     */
+    getCurrentDelta(): number;
+    /**
+     * Sets the current delta value of the animation
+     * @param delta - The delta value to set (normalized progress between 0 and 1)
+     * @returns This animation instance for method chaining
+     * @throws Error if delta is greater than 1
+     * @event "scrub"
+     */
+    setCurrentDelta(delta: number): this;
+    /**
+     * Sets the playback rate of the animation
+     * @param rate - The playback rate (1.0 is normal speed)
+     * @returns This animation instance for method chaining
+     * @event "playbackratechange"
+     */
+    setPlaybackRate(rate: number): this;
+    /**
+     * Gets the current playback rate
+     * @returns The current playback rate
+     */
+    getPlaybackRate(): number;
+    /**
+     * Adds an event listener to the animation
+     * @param type - The type of event to listen for
+     * @param callback - The callback function to execute when the event occurs
+     * @returns This animation instance for method chaining
+     */
+    addEventListener(type: AnimationEventTypes, callback: AnimationEventCallback): this;
+    /**
+     * Removes an event listener from the animation
+     * @param type - The type of event to remove
+     * @param callback - The callback function to remove
+     * @returns This animation instance for method chaining
+     */
+    removeEventListener(type: AnimationEventTypes, callback: AnimationEventCallback): this;
+    /**
+     * Emits an event to all listeners of a specific type
+     * @param event - The type of event to emit
+     * @param keyframe - The keyframe that triggered the event
+     * @param props - The interpolated properties at the current delta
+     */
+    emitEvent(event: AnimationEventTypes, keyframe?: Keyframe | null, nextKeyframe?: Keyframe | null, props?: Record<string, number>, previousProps?: Record<string, number>): void;
+    /**
+     * Creates a clone of this animation
+     * @returns A new animation instance with the same properties as this one
+     */
+    clone(): MaptilerAnimation;
+    /**
+     * Destroys the animation instance, removing all event listeners and stopping playback
+     */
+    destroy(): void;
+}

package/dist/src/MaptilerAnimation/animation-helpers.d.ts

@@ -0,0 +1,183 @@
+import { Feature, LineString, MultiLineString, MultiPoint, Polygon } from 'geojson';
+import { EasingFunctionName, Keyframe, NumericArrayWithNull } from './types';
+/**
+ * Performs simple linear interpolation between two numbers.
+ *
+ * @param a - The start value
+ * @param b - The end value
+ * @param alpha - The interpolation factor (typically between 0 and 1):
+ *                0 returns a, 1 returns b, and values in between return a proportional mix
+ * @returns The interpolated value between a and b
+ */
+export declare function lerp(a: number, b: number, alpha: number): number;
+/**
+ * Interpolates an array of numbers, replacing null values with interpolated values.
+ *
+ * `null` is treated as an empty value where an interpolation is needed.
+ *
+ * @param {NumericArrayWithNull} numericArray - The array of numbers to interpolate, which may contain null values
+ * @returns A new array with null values replaced by interpolated values
+ */
+export declare function lerpArrayValues(numericArray: NumericArrayWithNull): number[];
+/**
+ * Looks ahead in an array for the next entry that is not null.
+ *
+ * @param arr - The array to search through
+ * @param currentIndex - The index to start searching from
+ * @returns [index, value] A tuple containing the index of the next entry and its value, or null if not found
+ */
+export declare function findNextEntryAndIndexWithValue(arr: NumericArrayWithNull, currentIndex: number): (number | null)[];
+/**
+ * Looks back in an array for the previous entry that is not null.
+ *
+ * @param arr - The array to search through
+ * @param currentIndex - The index to start searching from
+ * @returns [index, value] A tuple containing the index of the previous entry and its value, or null if not found
+ */
+export declare function findPreviousEntryAndIndexWithValue(arr: NumericArrayWithNull, currentIndex: number): (number | null)[];
+/**
+ * Options for parsing GeoJSON data into animation keyframes.
+ *
+ * @interface ParseGeoJSONToKeyframesOptions
+ * @property {EasingFunctionName} [defaultEasing] - The default easing function to apply to the animation.
+ * @property {Object|false} [pathSmoothing] - Configuration for path smoothing, or false to disable smoothing.
+ * @property {number} [pathSmoothing.resolution] - The resolution used for path smoothing, higher values produce more detailed paths.
+ * @property {number} [pathSmoothing.epsilon] - Optional tolerance parameter for path simplification.
+ */
+export interface ParseGeoJSONToKeyframesOptions {
+    ignoreFields?: string[];
+    defaultEasing?: EasingFunctionName;
+    pathSmoothing?: {
+        resolution: number;
+        epsilon?: number;
+    } | false;
+}
+/**
+ * Represents geometry types that can be animated using keyframes.
+ *
+ * This type includes geometries like MultiPoint, LineString, MultiLineString, and Polygon
+ * which can be interpolated or transformed over time in animations.
+ */
+export type KeyframeableGeometry = MultiPoint | LineString | MultiLineString | Polygon;
+/**
+ * Represents a GeoJSON Feature that can be animated with keyframes.
+ * Extends the standard GeoJSON Feature with animation-specific properties.
+ *
+ * @typedef {Object} KeyframeableGeoJSONFeature
+ * @extends {Feature<KeyframeableGeometry>}
+ * @property {Object} properties - Contains both standard GeoJSON properties (as number arrays) and animation controls
+ * @property {EasingFunctionName[]} [properties.@easing] - Easing functions to apply to property animations
+ * @property {number[]} [properties.@delta] - Delta values for animation calculations
+ * @property {number} [properties.@duration] - Duration of the animation in milliseconds
+ * @property {number} [properties.@delay] - Delay before animation starts in milliseconds
+ * @property {number} [properties.@iterations] - Number of times the animation should repeat
+ * @property {boolean} [properties.@autoplay] - Whether the animation should start automatically
+ */
+export type KeyframeableGeoJSONFeature = Feature<KeyframeableGeometry> & {
+    properties: Record<string, number[] | boolean | number | EasingFunctionName[]> & {
+        "@easing"?: EasingFunctionName[];
+        "@delta"?: number[];
+        "@duration"?: number;
+        "@delay"?: number;
+        "@iterations"?: number;
+        "@autoplay"?: boolean;
+        altitude?: (number | null)[];
+    };
+};
+/**
+ * Converts a GeoJSON feature into an array of animation keyframes.
+ *
+ * Parses a GeoJSON feature with reserved properties to create animation keyframes.
+ * It extracts coordinates from the geometry and uses properties prefixed with '@' as animation
+ * control parameters (easing functions, delta values). Non-reserved properties are preserved
+ * and passed to the keyframe objects as props that will be interpolated
+ *
+ * @param {KeyframeableGeoJSONFeature} feature - The GeoJSON feature to convert to keyframes
+ * @param {ParseGeoJSONToKeyframesOptions} options - Configuration options
+ *
+ * @returns Array of keyframe objects that can be used for animation
+ *
+ * @throws {Error} When no geometry is found in the feature
+ * @throws {Error} When the geometry type is not supported
+ */
+export declare function parseGeoJSONFeatureToKeyframes(feature: KeyframeableGeoJSONFeature, options?: ParseGeoJSONToKeyframesOptions): Keyframe[];
+/**
+ *
+ * "Stretches" an array of numbers to a new length, filling in null values for the new indices.
+ *
+ * @param source the array to stretch
+ * @param targetLength the length to stretch to
+ * @returns {number[]} the stretched array with null values
+ */
+export declare function stretchNumericalArray(source: number[], targetLength: number): (number | null)[];
+/**
+ * Generates an array of keyframes from coordinates, deltas, easings, and other properties provided by the geoJSON feature.
+ * Assumes that the coordinates are in the format [longitude, latitude, altitude?]. If altitude is not provided, it defaults to 0.
+ *
+ * @param coordinates - Array of coordinate points, where each point is an array of [longitude, latitude, altitude?]
+ * @param deltas - Array of time deltas between keyframes
+ * @param easings - Array of easing function names to apply to each keyframe transition
+ * @param properties - Optional additional properties as key-value pairs, where each value is an array
+ * of numbers corresponding to each keyframe
+ *
+ * @returns An array of Keyframe objects, each containing coordinate props, delta, and easing information
+ *
+ * @throws Error if the arrays for coordinates, deltas, easings, and any property values don't have matching lengths
+ *
+ * @example
+ * const keyframes = getKeyframes(
+ *   [[0, 0, 10], [10, 10, 20]], // coordinates
+ *   [1000, 2000], // deltas (in milliseconds)
+ *   ["Linear", "ElasticIn"], // easings
+ *   { zoom: [10, 15] } // additional properties
+ * );
+ */
+export declare function getKeyframes(coordinates: number[][], deltas: number[], easings: EasingFunctionName[], properties?: Record<string, number[]>): Keyframe[];
+/**
+ * Creates a smoothed path using cubic Bezier curves from an array of coordinates.
+ *
+ * This function takes a series of points and creates a smooth path by generating cubic
+ * Bezier curves between them. It uses the Catmull-Rom method to automatically calculate
+ * control points for each curve segment. If the path has fewer than 4 points, the original
+ * path is returned unchanged.
+ *
+ * @param inputPath - Array of [x, y] coordinates that define the original path
+ * @param outputResolution - Controls how many points are generated along each segment
+ *                           (higher values create smoother curves with more points)
+ * @param simplificationThreshold - Optional threshold for simplifying the input path before
+ *                                  creating the curves.
+ * @returns An array of [x, y] coordinates representing the smoothed path
+ */
+export declare function createBezierPathFromCoordinates(inputPath: [number, number][], outputResolution?: number, simplificationThreshold?: number): [number, number][];
+/**
+ * Calculates the average distance between points in an array of coordinates.
+ *
+ * This function computes the average distance between consecutive points in the array.
+ * It uses the LngLat class from MapLibre to calculate distances based on geographical coordinates.
+ *
+ * @param arr - An array of coordinate pairs [longitude, latitude]
+ * @returns The average distance between points in the array
+ */
+export declare function getAverageDistance(arr: [number, number][]): number;
+/**
+ * Simplfies a path by removing points that are too close together.
+ *
+ * This function first resamples the path based on the average distance between points,
+ * then filters out points that are closer than the specified distance from the last included point.
+ * The first and last points of the original path are always preserved.
+ *
+ * @param points - An array of coordinate pairs [longitude, latitude]
+ * @param distance - The minimum distance between points in the simplified path
+ * @returns A new array containing a simplified version of the input path
+ */
+export declare function simplifyPath(points: [number, number][], distance: number): [number, number][];
+/**
+ * Resamples a geographic path to have points spaced at approximately equal distances.
+ * If the original path has fewer than 2 points, it is returned unchanged.
+ *
+ * @param path - An array of coordinate pairs [longitude, latitude] representing the path to resample
+ * @param spacing - The desired spacing between points in the resampled path (in the same unit as used by the distanceTo method), defaults to 10
+ * @returns A new array of coordinate pairs representing the resampled path with approximately equal spacing between points
+ *
+ */
+export declare function resamplePath(path: [number, number][], spacing?: number): [number, number][];

package/dist/src/MaptilerAnimation/easing.d.ts

@@ -0,0 +1,3 @@
+import { EasingFunctionName } from './types';
+declare const EasingFunctions: Record<EasingFunctionName, (K: number) => number>;
+export default EasingFunctions;

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

@@ -0,0 +1,7 @@
+import { default as MaptilerAnimation } from './MaptilerAnimation';
+export { MaptilerAnimation };
+export type * from './MaptilerAnimation';
+export type * from './types';
+export * from './easing';
+export { type KeyframeableGeometry, type KeyframeableGeoJSONFeature, lerp, lerpArrayValues, parseGeoJSONFeatureToKeyframes, createBezierPathFromCoordinates, getAverageDistance, simplifyPath, resamplePath, stretchNumericalArray, } from './animation-helpers';
+export type * from './animation-helpers';

package/dist/src/MaptilerAnimation/types.d.ts

@@ -0,0 +1,26 @@
+import { default as MaptilerAnimation } from './MaptilerAnimation';
+export type EasingFunctionName = "Linear" | "QuadraticIn" | "QuadraticOut" | "QuadraticInOut" | "CubicIn" | "CubicOut" | "CubicInOut" | "SinusoidalIn" | "SinusoidalOut" | "SinusoidalInOut" | "ExponentialIn" | "ExponentialOut" | "ExponentialInOut" | "ElasticIn" | "ElasticOut" | "ElasticInOut" | "BounceIn" | "BounceOut" | "BounceInOut";
+export type Keyframe = {
+    props: Record<string, number | null>;
+    delta: number;
+    easing?: EasingFunctionName;
+    userData?: Record<string, any>;
+};
+export type AnimationEventTypes = "pause" | "reset" | "play" | "stop" | "timeupdate" | "scrub" | "playbackratechange" | "animationstart" | "animationend" | "keyframe" | "iteration";
+export declare const AnimationEventTypesArray: AnimationEventTypes[];
+export type NumericArrayWithNull = (number | null)[];
+export type AnimationEvent = {
+    type: AnimationEventTypes;
+    target: MaptilerAnimation;
+    currentTime: number;
+    currentDelta: number;
+    playbackRate: number;
+    keyframe?: Keyframe | null;
+    nextKeyframe?: Keyframe | null;
+    props: Record<string, number>;
+    previousProps: Record<string, number>;
+    iteration?: number;
+};
+export type AnimationEventListenersRecord = Record<AnimationEventTypes, AnimationEventCallback[]>;
+export type AnimationEventCallback = (event: AnimationEvent) => void;
+export { MaptilerAnimation };