@dereekb/dbx-web 13.41.0 → 13.42.0

package/eslint/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@dereekb/dbx-web/eslint",
-  "version": "13.41.0",
+  "version": "13.42.0",
   "type": "module",
   "peerDependencies": {
-    "@dereekb/util": "13.41.0",
+    "@dereekb/util": "13.42.0",
     "@typescript-eslint/utils": "8.59.3"
   },
   "devDependencies": {
     "@angular-eslint/template-parser": "21.4.0",
     "@angular/core": "21.2.11",
-    "@dereekb/dbx-core": "13.41.0",
-    "@dereekb/rxjs": "13.41.0",
+    "@dereekb/dbx-core": "13.42.0",
+    "@dereekb/rxjs": "13.42.0",
     "@typescript-eslint/parser": "8.59.3",
     "eslint": "10.4.0",
     "rxjs": "^7.8.2"

package/fesm2022/dereekb-dbx-web-mapbox.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { inject, Injectable, ChangeDetectionStrategy, Component, Directive, Optional, SkipSelf, Injector, output, viewChild, ElementRef, input, signal, effect, computed, NgModule, makeEnvironmentProviders } from '@angular/core';
+import { inject, Injectable, ChangeDetectionStrategy, Component, Directive, Optional, SkipSelf, Injector, output, viewChild, ElementRef, input, signal, effect, computed, NgModule, provideAppInitializer, makeEnvironmentProviders } from '@angular/core';
 import { asObservable, cleanup, filterMaybe, onTrueToFalse, SubscriptionObject, distinctUntilMapHasDifferentKeys } from '@dereekb/rxjs';
 import { distinctUntilChanged, switchMap, map, combineLatestWith, shareReplay, NEVER, defaultIfEmpty, tap, EMPTY, interval, of, first, combineLatest, filter, startWith, throttleTime, Subject, merge, delay } from 'rxjs';
 import { latLngPoint, LAT_LONG_10M_PRECISION, latLngPointFunction, roundNumberToStepFunction, latLngBoundFunction, latLngBoundFromInput, filterUndefinedValues, diffLatLngBoundPoints, latLngBoundCenterPoint, addLatLngPoints, isSameLatLngPoint, isSameVector, vectorMinimumSizeResizeFunction, isSameLatLngBound, isDefaultLatLngPoint, swMostLatLngPoint, neMostLatLngPoint, latLngBoundWrapsMap, isWithinLatLngBoundFunction, overlapsLatLngBoundFunction, isNotFalse, DestroyFunctionObject, getValueFromGetter, pushItemOrArrayItemsIntoArray, spaceSeparatedCssClasses } from '@dereekb/util';
 import { ComponentStore } from '@ngrx/component-store';
-import { LngLatBounds } from 'mapbox-gl';
+import mapboxgl, { LngLatBounds } from 'mapbox-gl';
 import { bounds } from '@placemarkio/geo-viewport';
 import { DbxInjectionArrayComponent, DbxInjectionComponent, completeOnDestroy, cleanSubscription, clean } from '@dereekb/dbx-core';
 import { toSignal, toObservable } from '@angular/core/rxjs-interop';
@@ -1344,14 +1344,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
                 }]
         }] });
 
+/**
+ * Relative url the mapbox-gl CSP web worker asset is expected to be served from.
+ *
+ * The asset itself is copied out of `node_modules/mapbox-gl/dist/mapbox-gl-csp-worker.js`
+ * by the consuming app's build configuration, which keeps it in version lockstep with the
+ * `mapbox-gl` the app actually bundles.
+ */
+const DEFAULT_DBX_MAPBOX_WORKER_URL = 'assets/mapbox-gl/mapbox-gl-csp-worker.js';
+/**
+ * Checks whether the mapbox-gl web worker asset is actually served from the given url.
+ *
+ * @param workerUrl - Url the worker asset is expected at.
+ * @returns True when the asset responds successfully.
+ */
+async function isDbxMapboxWorkerAssetAvailable(workerUrl) {
+    let available;
+    try {
+        const response = await fetch(workerUrl, { method: 'HEAD' });
+        available = response.ok;
+    }
+    catch {
+        available = false;
+    }
+    return available;
+}
+/**
+ * Configures mapbox-gl to load its web worker from a self-hosted copy of mapbox's prebuilt
+ * CSP worker rather than from the blob url it generates itself.
+ *
+ * mapbox-gl's default worker is built by stringifying two of its own functions into a blob.
+ * Only those function bodies are serialized, so any helper the bundler hoists to module
+ * scope is missing at runtime. `@angular/build` unconditionally disables esbuild's
+ * `object-rest-spread` support, which rewrites every object spread in mapbox-gl 3.26.0+ into
+ * exactly such a hoisted helper, and the worker then dies with a `ReferenceError` while
+ * loading tiles. Pointing `workerUrl` at a real file — mapbox's own documented CSP escape
+ * hatch — sidesteps the bug entirely, at any mapbox-gl version.
+ *
+ * Must be applied before the first `Map` is constructed.
+ *
+ * @param inputConfig - Configuration. Optional.
+ * @returns The applied configuration.
+ */
+async function configureDbxMapboxWorker(inputConfig) {
+    const config = inputConfig ?? {};
+    let result;
+    if (config.enabled === false || typeof window === 'undefined') {
+        result = { configured: false, workerUrl: null, available: null };
+    }
+    else {
+        const workerUrl = config.workerUrl || DEFAULT_DBX_MAPBOX_WORKER_URL;
+        mapboxgl.workerUrl = workerUrl;
+        const available = await isDbxMapboxWorkerAssetAvailable(workerUrl);
+        if (!available) {
+            console.error(`dbx-web/mapbox: the mapbox-gl web worker asset was not found at "${workerUrl}", so the map will fail to load tiles. Copy it into your app's assets by adding this entry to the build target's "assets" in project.json: { "input": "node_modules/mapbox-gl/dist", "glob": "mapbox-gl-csp-worker.js", "output": "assets/mapbox-gl" }`);
+        }
+        result = { configured: true, workerUrl, available };
+    }
+    return result;
+}
+
 /**
  * Creates EnvironmentProviders for providing DbxMapboxConfig and configuring the NgxMapboxGLModule.
  *
+ * Also registers an app initializer that points mapbox-gl at the self-hosted CSP web worker
+ * asset before any map is created.
+ *
  * @param config - Configuration.
  * @returns EnvironmentProviders.
  */
 function provideDbxMapbox(config) {
-    const { dbxMapboxConfig, ngxMapboxGLModuleConfig } = config;
+    const { dbxMapboxConfig, ngxMapboxGLModuleConfig, worker } = config;
     const providers = [
         // config
         {
@@ -1360,6 +1423,8 @@ function provideDbxMapbox(config) {
         },
         // service
         DbxMapboxService,
+        // worker: must be configured before the first Map is constructed
+        provideAppInitializer(() => configureDbxMapboxWorker(worker)),
         // ngxMapboxGL
         provideMapboxGL(ngxMapboxGLModuleConfig)
     ];
@@ -1411,5 +1476,5 @@ function mapboxZoomLevel(input) {
  * Generated bundle index. Do not edit.
  */
 
-export { DEFAULT_MAPBOX_CENTER, DEFAULT_MAPBOX_LAYOUT_DRAWER_WIDTH, DEFAULT_MAPBOX_MAP_STORE_TIMER_REFRESH_PERIOD, DEFAULT_MAPBOX_STYLE, DEFAULT_MAPBOX_ZOOM, DbxMapboxChangeService, DbxMapboxConfig, DbxMapboxInjectionComponent, DbxMapboxInjectionStore, DbxMapboxInjectionStoreInjectionBlockDirective, DbxMapboxInjectionStoreProviderBlock, DbxMapboxLayoutComponent, DbxMapboxLayoutDrawerComponent, DbxMapboxLayoutVirtualResizeSyncComponent, DbxMapboxMapDirective, DbxMapboxMapStore, DbxMapboxMapStoreInjectionBlockDirective, DbxMapboxMapStoreProviderBlock, DbxMapboxMarkerComponent, DbxMapboxMarkersComponent, DbxMapboxMenuComponent, DbxMapboxModule, DbxMapboxService, KNOWN_MAPBOX_STYLES, MAPBOX_MAX_ZOOM_LEVEL, MAPBOX_MIN_ZOOM_LEVEL, dbxMapboxColoredDotStyle, filterByMapboxViewportBound, mapboxViewportBoundFunction, mapboxZoomLevel, provideDbxMapbox, provideMapboxInjectionStoreIfParentIsUnavailable, provideMapboxStoreIfParentIsUnavailable, updateDbxMapboxMapInjectionStoreStateWithInjectionConfig, updateDbxMapboxMapInjectionStoreStateWithRemovedKey };
+export { DEFAULT_DBX_MAPBOX_WORKER_URL, DEFAULT_MAPBOX_CENTER, DEFAULT_MAPBOX_LAYOUT_DRAWER_WIDTH, DEFAULT_MAPBOX_MAP_STORE_TIMER_REFRESH_PERIOD, DEFAULT_MAPBOX_STYLE, DEFAULT_MAPBOX_ZOOM, DbxMapboxChangeService, DbxMapboxConfig, DbxMapboxInjectionComponent, DbxMapboxInjectionStore, DbxMapboxInjectionStoreInjectionBlockDirective, DbxMapboxInjectionStoreProviderBlock, DbxMapboxLayoutComponent, DbxMapboxLayoutDrawerComponent, DbxMapboxLayoutVirtualResizeSyncComponent, DbxMapboxMapDirective, DbxMapboxMapStore, DbxMapboxMapStoreInjectionBlockDirective, DbxMapboxMapStoreProviderBlock, DbxMapboxMarkerComponent, DbxMapboxMarkersComponent, DbxMapboxMenuComponent, DbxMapboxModule, DbxMapboxService, KNOWN_MAPBOX_STYLES, MAPBOX_MAX_ZOOM_LEVEL, MAPBOX_MIN_ZOOM_LEVEL, configureDbxMapboxWorker, dbxMapboxColoredDotStyle, filterByMapboxViewportBound, isDbxMapboxWorkerAssetAvailable, mapboxViewportBoundFunction, mapboxZoomLevel, provideDbxMapbox, provideMapboxInjectionStoreIfParentIsUnavailable, provideMapboxStoreIfParentIsUnavailable, updateDbxMapboxMapInjectionStoreStateWithInjectionConfig, updateDbxMapboxMapInjectionStoreStateWithRemovedKey };
 //# sourceMappingURL=dereekb-dbx-web-mapbox.mjs.map