Free map tiles for your websites and apps Fast. Free. Forever.

let maplibrePromise = null;
let cssLoaded = false;

/**
 * Lazily loads MapLibre GL and its CSS when needed
 * @returns {Promise} The MapLibre GL module
 */
async function loadMapLibre() {
    if (!maplibrePromise) {
        maplibrePromise = Promise.all([
            import('maplibre-gl'),
            loadMapLibreCSS()
        ]).then(([module]) => module.default);
    }
    return maplibrePromise;
}

/**
 * Loads MapLibre GL CSS dynamically
 */
async function loadMapLibreCSS() {
    if (!cssLoaded) {
        await import('maplibre-gl/dist/maplibre-gl.css');
        cssLoaded = true;
    }
}

/**
 * MapLibre GL Lazy Loader Class
 * Provides an API similar to maplibregl but with lazy loading
 */
export class MapLibreLoader {
    constructor() {
        this.maplibregl = null;
    }

    /**
     * Creates a new map instance, lazily loading MapLibre GL if needed
     * @param {Object} options - Map configuration options
     * @returns {Promise} A MapLibre GL Map instance
     */
    async createMap(options) {
        this.maplibregl = await loadMapLibre();
        return new this.maplibregl.Map(options);
    }

    /**
     * Gets the MapLibre GL library, lazily loading if needed
     * @returns {Promise} The MapLibre GL library
     */
    async getLibrary() {
        this.maplibregl = await loadMapLibre();
        return this.maplibregl;
    }
}

export default new MapLibreLoader();