leaflet-city-mapper 0.0.2 → 0.0.4

package/src/core/popupAdjustPan.js

@@ -0,0 +1,29 @@
+import { popupPan } from '../globals/popupPan.js';
+
+import { mapGetPitch } from '../camera/mapGetPitch.js';
+import { mapGetBearing } from '../camera/mapGetBearing.js';
+
+import { pointOf } from '../camera/pointOf.js';
+
+export function popupAdjustPan() {
+  const map = this._map;
+  if (!mapGetPitch(map) && !mapGetBearing(map)) return popupPan.value.call(this);
+  if (!this.options.autoPan) return;
+  if (map._panAnim) map._panAnim.stop();
+  if (this._autopanning) { this._autopanning = false; return; }
+  const rect = this._container.getBoundingClientRect(), container = map.getContainer().getBoundingClientRect();
+  const min = pointOf(this.options.autoPanPaddingTopLeft || this.options.autoPanPadding);
+  const max = map.getSize().subtract(pointOf(this.options.autoPanPaddingBottomRight || this.options.autoPanPadding));
+  const left = rect.left - container.left, top = rect.top - container.top;
+  const right = rect.right - container.left, bottom = rect.bottom - container.top;
+  const dx = Math.min(0, left - min.x) || Math.max(0, right - max.x);
+  const dy = Math.min(0, top - min.y) || Math.max(0, bottom - max.y);
+  if (!dx && !dy) return;
+  if (this.options.keepInView) this._autopanning = true;
+  const screen = map.latLngToContainerPoint(this._latlng);
+  screen.x -= dx;
+  screen.y -= dy;
+  const delta = map.latLngToLayerPoint(this._latlng).subtract(map.containerPointToLayerPoint(screen));
+  map.fire('autopanstart');
+  map.panTo(map.unproject(map.project(map.getCenter()).add(delta)));
+}

package/src/core/popupGetEvents.js

@@ -0,0 +1,8 @@
+import { popupEvents } from '../globals/popupEvents.js';
+
+
+export function popupGetEvents() {
+  const events = popupEvents.value.call(this);
+  events.rotate = events.pitch = events.move = this._updatePosition;
+  return events;
+}

package/src/core/popupUpdatePosition.js

@@ -0,0 +1,17 @@
+import { L } from '../globals/L.js';
+import { popupPosition } from '../globals/popupPosition.js';
+
+
+import { displayPoint } from '../camera/displayPoint.js';
+
+export function popupUpdatePosition() {
+  popupPosition.value.call(this);
+  if (!this._map) return;
+  const point = this._map.latLngToLayerPoint(this._latlng), delta = displayPoint(this._map, point).subtract(point);
+  if (this._zoomAnimated) {
+    L.DomUtil.setPosition(this._container, L.DomUtil.getPosition(this._container).add(delta));
+  } else {
+    this._container.style.left = `${this._containerLeft + delta.x}px`;
+    this._container.style.bottom = `${this._containerBottom - delta.y}px`;
+  }
+}

package/src/core/pruneNativeResources.js

@@ -0,0 +1,20 @@
+import { disposeMesh } from '../rendering/disposeMesh.js';
+import { destroyTexture } from '../rendering/destroyTexture.js';
+
+export function pruneNativeResources(state) {
+  const { meshes, textures, backend } = state;
+  let mesh, texture, key;
+  for ([key, mesh] of meshes) {
+    if (mesh._nativeUsed) continue;
+    disposeMesh(backend, mesh);
+    meshes.delete(key);
+    texture = textures.get(key);
+    if (texture) destroyTexture(backend, texture.texture);
+    textures.delete(key);
+  }
+  for ([key, texture] of textures) {
+    if (texture.used) continue;
+    destroyTexture(backend, texture.texture);
+    textures.delete(key);
+  }
+}

package/src/core/putNativeMesh.js

@@ -0,0 +1,36 @@
+import { L } from '../globals/L.js';
+import { disposeMesh } from '../rendering/disposeMesh.js';
+import { createMesh } from '../rendering/createMesh.js';
+import { styleNativeMesh } from './styleNativeMesh.js';
+
+export function putNativeMesh(state, key, position, color, opacity, texture, uv) {
+  const { backend, source, meshes } = state;
+  if (!position.length) return;
+  let mesh = meshes.get(key);
+  if (!mesh || mesh.geometry.attributes.position.data.length !== position.length ||
+    mesh.program.uniforms.baseTexture?.value !== texture) {
+    const normal = /* alloc */ [];
+    let index;
+    for (index = 0; index < position.length; index++) normal.push(index % 3 === 1 ? 1 : 0);
+    const data = /* alloc */ { position, normal };
+    if (uv) data.uv = uv;
+    const material = /* alloc */ {
+      vertexColors: false, color, opacity, unlit: true, alphaMode: 'BLEND',
+    };
+    if (texture) material.baseTexture = texture;
+    if (mesh) disposeMesh(backend, mesh);
+    mesh = createMesh(backend, data, material, 0, source instanceof L.GridLayer ? state.rasterProgram : undefined);
+    if (source instanceof L.GridLayer) {
+      state.rasterProgram ||= mesh.program;
+      mesh.texture = texture;
+    }
+    meshes.set(key, mesh);
+  } else {
+    const attribute = mesh.geometry.attributes.position;
+    attribute.data.set(position);
+    attribute.needsUpdate = true;
+    mesh.geometry.bounds = null;
+  }
+  styleNativeMesh(state, mesh, color, opacity);
+  return mesh;
+}

package/src/core/quadNativeMesh.js

@@ -0,0 +1,20 @@
+import { coreQuadIndices } from '../globals/coreQuadIndices.js';
+import { coreQuadUV } from '../globals/coreQuadUV.js';
+import { coreWhite } from '../globals/coreWhite.js';
+import { textureFor } from './textureFor.js';
+import { putNativeMesh } from './putNativeMesh.js';
+
+
+export function quadNativeMesh(state, key, image, corners, opacity) {
+  const texture = textureFor(state, key, image);
+  if (!texture) return;
+  const indices = coreQuadIndices;
+  const position = /* alloc */ [];
+  const uv = /* alloc */ [];
+  let index;
+  for (index of indices) {
+    position.push(...corners[index]);
+    uv.push(coreQuadUV[index * 2], coreQuadUV[index * 2 + 1]);
+  }
+  return putNativeMesh(state, key, position, coreWhite, opacity, texture, uv);
+}

package/src/core/readyNativeGPU.js

@@ -0,0 +1,9 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { nativeLayer } from './nativeLayer.js';
+
+export function readyNativeGPU(state) {
+  if (sceneByLayer.get(state.source)._nativeGPU !== state) return state.source;
+  return nativeLayer(state);
+}

package/src/core/redrawPath.js

@@ -0,0 +1,6 @@
+import { refreshNativeLayerContract } from './refreshNativeLayerContract.js';
+
+export function redrawPath() {
+  refreshNativeLayerContract(this);
+  return this;
+}

package/src/core/refreshNativeEvent.js

@@ -0,0 +1,5 @@
+import { refreshNativeLayer } from './refreshNativeLayer.js';
+
+export function refreshNativeEvent() {
+  refreshNativeLayer(this);
+}

package/src/core/refreshNativeLayer.js

@@ -0,0 +1,34 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { nativeImageRefresh } from './nativeImageRefresh.js';
+import { nativeImageError } from './nativeImageError.js';
+import { removeImageState } from './removeImageState.js';
+import { addImageState } from './addImageState.js';
+import { update } from '../scene/update.js';
+import { hideTargets } from './hideTargets.js';
+
+export function refreshNativeLayer(state = this) {
+  state.dirty = true;
+  state.viewDirty = true;
+  state.failed = false;
+  hideTargets(state);
+  const source = state.source;
+  let i, image;
+  for (image of state.images) {
+    if (image === source._icon || image === source._shadow || image === source._image) continue;
+    image.removeEventListener('load', nativeImageRefresh);
+    image.removeEventListener('error', nativeImageError);
+    removeImageState(image, state);
+    state.images.delete(image);
+  }
+  for (i = 0; i < 3; i++) {
+    image = i === 0 ? source._icon : i === 1 ? source._shadow : source._image;
+    if (!(image instanceof HTMLImageElement) || state.images.has(image)) continue;
+    state.images.add(image);
+    addImageState(image, state);
+    image.addEventListener('load', nativeImageRefresh);
+    image.addEventListener('error', nativeImageError);
+  }
+  if (sceneByLayer.get(state.backend)._shared) update(state.backend);
+}

package/src/core/refreshNativeLayerContract.js

@@ -0,0 +1,8 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+import { refreshNativeLayer } from './refreshNativeLayer.js';
+
+export function refreshNativeLayerContract(layer = this) {
+  const native = sceneByLayer.get(layer)?._nativeGPU;
+  if (native?.backend && !native.disposed) refreshNativeLayer(native);
+}

package/src/core/rejectNativeReady.js

@@ -0,0 +1,4 @@
+
+export function rejectNativeReady({ error }) {
+  this.ready.reject(error);
+}

package/src/core/removeImageState.js

@@ -0,0 +1,9 @@
+import { imageStates } from '../globals/imageStates.js';
+
+
+export function removeImageState(image, state) {
+  const states = imageStates.get(image);
+  if (!states) return;
+  states.delete(state);
+  if (!states.size) imageStates.delete(image);
+}

package/src/core/removeLayer.js

@@ -0,0 +1,22 @@
+import { L } from '../globals/L.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { removeLayer as sharedRemoveLayer } from '../globals/removeLayer.js';
+
+import { removeSceneLayer } from '../scene/removeSceneLayer.js';
+
+
+
+export function removeLayer(layer) {
+  const id = L.Util.stamp(layer);
+  if (!this._layers[id]) return this;
+  const state = sceneByLayer.get(layer);
+  if (!state.kind) return sharedRemoveLayer.value.call(this, layer);
+  if (this._loaded) removeSceneLayer(layer, this);
+  delete this._layers[id];
+  if (this._loaded) {
+    this.fire('layerremove', /* alloc */ { layer });
+    layer.fire('remove');
+  }
+  layer._map = layer._mapToAdd = null;
+  return this;
+}

package/src/core/removeNativeEvents.js

@@ -0,0 +1,17 @@
+import { nativeEventMaps } from '../globals/nativeEventMaps.js';
+
+
+export function removeNativeEvents(state) {
+  const context = state._nativeEventContext;
+  if (!context) return;
+  const { map } = context;
+  context.states.delete(state);
+  if (context.hovered === state.source) {
+    context.hovered = null;
+    map.getContainer().style.cursor = '';
+  }
+  state._nativeEventContext = null;
+  if (context.states.size) return;
+  context.restore();
+  nativeEventMaps.delete(map);
+}

package/src/core/removeTargets.js

@@ -0,0 +1,12 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+import { disposeNativeLayer } from './disposeNativeLayer.js';
+
+export function removeTargets(state) {
+  if (sceneByLayer.get(state.source)._nativeGPU === state) sceneByLayer.get(state.source)._nativeGPU = null;
+  if (state.backend) disposeNativeLayer.call(state);
+  let element;
+  for (element of state.hidden) {
+    element.classList.remove('leaflet-webgpu-target');
+  }
+}

package/src/core/reorderNativeLayer.js

@@ -0,0 +1,9 @@
+import { cameraByMap } from '../globals/cameraByMap.js';
+
+
+import { refreshNativeLayer } from './refreshNativeLayer.js';
+
+export function reorderNativeLayer(front) {
+  this.order = front ? ++cameraByMap.get(this.map)._nativeGPUOrder : --cameraByMap.get(this.map)._nativeGPUBack;
+  refreshNativeLayer(this);
+}

package/src/core/resolveNativeReady.js

@@ -0,0 +1,4 @@
+
+export function resolveNativeReady() {
+  this.ready.resolve();
+}

package/src/core/restoreNativeEvents.js

@@ -0,0 +1,6 @@
+export function restoreNativeEvents() {
+  const { map, descriptor, handle } = this;
+  if (map._fireDOMEvent !== handle) return;
+  if (descriptor) Object.defineProperty(map, '_fireDOMEvent', descriptor);
+  else delete map._fireDOMEvent;
+}

package/src/core/runGridFades.js

@@ -0,0 +1,19 @@
+import { gridFadeFrame } from '../globals/gridFadeFrame.js';
+import { pendingGridFades } from '../globals/pendingGridFades.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+
+import { updateGridOpacity } from './updateGridOpacity.js';
+
+export function runGridFades() {
+  gridFadeFrame.value = null;
+  const layers = /* alloc */ [...pendingGridFades];
+  let layer, version;
+  for ([layer, version] of layers) {
+    if (pendingGridFades.get(layer) !== version) continue;
+    pendingGridFades.delete(layer);
+    sceneByLayer.get(layer)._fadeFrame = null;
+    updateGridOpacity.call(layer);
+  }
+}

package/src/core/runMarkerPanFrame.js

@@ -0,0 +1,14 @@
+import { markerPanFrame } from '../globals/markerPanFrame.js';
+import { pendingMarkerPan } from '../globals/pendingMarkerPan.js';
+
+
+export function runMarkerPanFrame() {
+  markerPanFrame.value = null;
+  const pending = /* alloc */ [...pendingMarkerPan];
+  pendingMarkerPan.clear();
+  let drag, event;
+  for ([drag, event] of pending) {
+    drag._panRequest = null;
+    drag._adjustPan(event);
+  }
+}

package/src/core/scheduleGridFade.js

@@ -0,0 +1,14 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { pendingGridFades } from '../globals/pendingGridFades.js';
+import { gridFadeFrame } from '../globals/gridFadeFrame.js';
+
+
+
+import { runGridFades } from './runGridFades.js';
+
+export function scheduleGridFade(layer) {
+  sceneByLayer.get(layer)._fadeVersion = (sceneByLayer.get(layer)._fadeVersion || 0) + 1;
+  pendingGridFades.set(layer, sceneByLayer.get(layer)._fadeVersion);
+  if (gridFadeFrame.value === null) gridFadeFrame.value = requestAnimationFrame(runGridFades);
+  sceneByLayer.get(layer)._fadeFrame = gridFadeFrame.value;
+}

package/src/core/scheduleMarkerPan.js

@@ -0,0 +1,11 @@
+import { pendingMarkerPan } from '../globals/pendingMarkerPan.js';
+import { markerPanFrame } from '../globals/markerPanFrame.js';
+
+
+import { runMarkerPanFrame } from './runMarkerPanFrame.js';
+
+export function scheduleMarkerPan(drag, event) {
+  pendingMarkerPan.set(drag, event);
+  if (markerPanFrame.value === null) markerPanFrame.value = requestAnimationFrame(runMarkerPanFrame);
+  drag._panRequest = markerPanFrame.value;
+}

package/src/core/setRotation.js

@@ -0,0 +1,5 @@
+import { markerSetRotation } from './markerSetRotation.js';
+
+export function setRotation(rotation) {
+  return markerSetRotation(this, rotation);
+}

package/src/core/styleNativeMesh.js

@@ -0,0 +1,14 @@
+import { L } from '../globals/L.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+export function styleNativeMesh(state, mesh, color, opacity) {
+  const { source, marker, paneOrder, order } = state;
+  mesh.program.uniforms.baseColor.value = color;
+  mesh.program.uniforms.opacity.value = opacity;
+  if (source instanceof L.GridLayer) mesh.opacity = opacity;
+  const zIndex = marker ? source._zIndex + (sceneByLayer.get(source)._cameraZIndexOffset || 0) : source.options.zIndex;
+  mesh.renderOrder = paneOrder * 1e6 + (zIndex || 0) * 1000 + order;
+  mesh._nativeSource = source;
+  mesh._nativeUsed = true;
+}

package/src/core/syncGridLayer.js

@@ -0,0 +1,29 @@
+import { L } from '../globals/L.js';
+import { coreWhite } from '../globals/coreWhite.js';
+
+import { styleNativeMesh } from './styleNativeMesh.js';
+import { quadNativeMesh } from './quadNativeMesh.js';
+import { boundsQuad } from './boundsQuad.js';
+
+
+export function syncGridLayer(state) {
+  const { source, textures, meshes } = state;
+  let key, tile, opacity, retained, mesh, nw, se;
+  for (key in source._tiles) {
+    if (!Object.hasOwn(source._tiles, key)) continue;
+    tile = source._tiles[key];
+    if (!tile.loaded || tile.el instanceof HTMLImageElement && !tile.el.naturalWidth) continue;
+    opacity = (source.options.opacity ?? 1) * (tile._gpuOpacity ?? 1);
+    retained = textures.get(key);
+    mesh = meshes.get(key);
+    if (mesh && retained?.image === tile.el && retained.url === (tile.el.currentSrc || tile.el.src)) {
+      retained.used = true;
+      styleNativeMesh(state, mesh, coreWhite, opacity);
+    } else {
+      [nw, se] = source._tileCoordsToNwSe(tile.coords);
+      mesh = quadNativeMesh(state, key, tile.el, boundsQuad(state,
+        /* alloc */ new L.LatLngBounds(nw, se)), opacity);
+    }
+    if (mesh) mesh.renderOrder += tile.coords.z / 100;
+  }
+}

package/src/core/syncImageOverlay.js

@@ -0,0 +1,9 @@
+import { quadNativeMesh } from './quadNativeMesh.js';
+import { boundsQuad } from './boundsQuad.js';
+
+export function syncImageOverlay(state) {
+  const { source } = state;
+  if (source._image?.complete && source._image.naturalWidth) {
+    quadNativeMesh(state, 'image', source._image, boundsQuad(state, source.getBounds()), source.options.opacity ?? 1);
+  }
+}

package/src/core/syncMarker.js

@@ -0,0 +1,14 @@
+import { quadNativeMesh } from './quadNativeMesh.js';
+import { markerQuadCorners } from './markerQuadCorners.js';
+
+export function syncMarker(state) {
+  const { source } = state;
+  let i, key, image, mesh;
+  for (i = 0; i < 2; i++) {
+    key = i ? 'icon' : 'shadow';
+    image = i ? source._icon : source._shadow;
+    if (!(image instanceof HTMLImageElement) || !image.complete || !image.naturalWidth) continue;
+    mesh = quadNativeMesh(state, key, image, markerQuadCorners(state, key, image), source.options.opacity ?? 1);
+    if (key === 'shadow' && mesh) mesh.renderOrder -= 100 * 1e6;
+  }
+}

package/src/core/syncVectorLayer.js

@@ -0,0 +1,29 @@
+import { geometryPixelStates } from '../globals/geometryPixelStates.js';
+
+
+import { nativeGeometry } from '../geometry/nativeGeometry.js';
+import { localPixelForGeometry } from './localPixelForGeometry.js';
+import { parseColor } from '../utils/parseColor.js';
+import { putNativeMesh } from './putNativeMesh.js';
+
+export function syncVectorLayer(state) {
+  const { source } = state;
+  geometryPixelStates.push(state);
+  let geometry;
+  try {
+    geometry = nativeGeometry(source, state.map, localPixelForGeometry);
+  } finally {
+    geometryPixelStates.pop();
+  }
+  const { fill, stroke } = geometry;
+  let i, key, positions, color, opacity, r, g, b;
+  for (i = 0; i < 2; i++) {
+    key = i ? 'stroke' : 'fill';
+    positions = i ? stroke : fill;
+    color = i ? source.options.color : source.options.fillColor || source.options.color;
+    opacity = i ? source.options.opacity : source.options.fillOpacity;
+    if (!positions.length) continue;
+    ({ r, g, b } = parseColor(color));
+    putNativeMesh(state, key, positions, /* alloc */ [r, g, b], opacity ?? 1);
+  }
+}

package/src/core/synchronizeNativeLayer.js

@@ -0,0 +1,26 @@
+import { L } from '../globals/L.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { current } from './current.js';
+import { syncGridLayer } from './syncGridLayer.js';
+import { syncImageOverlay } from './syncImageOverlay.js';
+import { syncMarker } from './syncMarker.js';
+import { syncVectorLayer } from './syncVectorLayer.js';
+import { pruneNativeResources } from './pruneNativeResources.js';
+
+export function synchronizeNativeLayer(state) {
+  const { source, meshes, textures } = state;
+  if (!current(state) || !sceneByLayer.get(state.backend).renderer || state.failed) return;
+  if (!state.dirty && (!state.marker || !state.viewDirty)) return;
+  state.dirty = false;
+  state.viewDirty = false;
+  let mesh, texture;
+  for (mesh of meshes.values()) mesh._nativeUsed = false;
+  for (texture of textures.values()) texture.used = false;
+  if (source instanceof L.GridLayer) syncGridLayer(state);
+  else if (source instanceof L.ImageOverlay) syncImageOverlay(state);
+  else if (state.marker) syncMarker(state);
+  else syncVectorLayer(state);
+  pruneNativeResources(state);
+}

package/src/core/textureFor.js

@@ -0,0 +1,46 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { coreSampler } from '../globals/coreSampler.js';
+
+import { disposeMesh } from '../rendering/disposeMesh.js';
+import { destroyTexture } from '../rendering/destroyTexture.js';
+import { uploadCanvasTexture } from './uploadCanvasTexture.js';
+import { uploadNativeImage } from './uploadNativeImage.js';
+
+
+export function textureFor(state, key, image) {
+  if (!(image instanceof HTMLImageElement) && !(image instanceof HTMLCanvasElement)) {
+    throw /* alloc */ new Error('WebGPU native raster layers require image or canvas tiles');
+  }
+  const { backend, textures, meshes } = state;
+  let texture = textures.get(key);
+  const url = image.currentSrc || image.src;
+  if (!texture || texture.image !== image || texture.url !== url) {
+    if (texture) {
+      const mesh = meshes.get(key);
+      if (mesh) disposeMesh(backend, mesh);
+      meshes.delete(key);
+      destroyTexture(backend, texture.texture);
+      textures.delete(key);
+    }
+    const width = image.naturalWidth || image.width, height = image.naturalHeight || image.height;
+    if (!width || !height) return;
+    const { device } = sceneByLayer.get(backend).renderer;
+    texture = /* alloc */ {
+      device, image, url, format: 'rgba8unorm', uploaded: null,
+      texture: device.createTexture(/* alloc */ {
+        size: /* alloc */ [width, height], format: 'rgba8unorm',
+        usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT,
+      }),
+      sampler: device.createSampler(coreSampler),
+    };
+    textures.set(key, texture);
+    if (image instanceof HTMLCanvasElement) {
+      texture.pending = true;
+      uploadCanvasTexture(state, key, texture, image, device, width, height);
+    } else {
+      uploadNativeImage(state, key, texture, image, device, width, height);
+    }
+  }
+  texture.used = true;
+  return texture.uploaded === image ? texture : undefined;
+}

package/src/core/tooltipGetEvents.js

@@ -0,0 +1,8 @@
+import { tooltipEvents } from '../globals/tooltipEvents.js';
+
+
+export function tooltipGetEvents() {
+  const events = tooltipEvents.value.call(this);
+  events.rotate = events.pitch = events.move = this._updatePosition;
+  return events;
+}

package/src/core/tooltipSetPosition.js

@@ -0,0 +1,11 @@
+import { L } from '../globals/L.js';
+import { tooltipPosition } from '../globals/tooltipPosition.js';
+
+
+import { displayPoint } from '../camera/displayPoint.js';
+
+export function tooltipSetPosition(point) {
+  tooltipPosition.value.call(this, point);
+  const delta = displayPoint(this._map, point).subtract(point);
+  L.DomUtil.setPosition(this._container, L.DomUtil.getPosition(this._container).add(delta));
+}

package/src/core/transformNativePoint.js

@@ -0,0 +1,7 @@
+export function transformNativePoint(target, matrix, x, y, z, w) {
+  target.x = matrix.m11 * x + matrix.m21 * y + matrix.m31 * z + matrix.m41 * w;
+  target.y = matrix.m12 * x + matrix.m22 * y + matrix.m32 * z + matrix.m42 * w;
+  target.z = matrix.m13 * x + matrix.m23 * y + matrix.m33 * z + matrix.m43 * w;
+  target.w = matrix.m14 * x + matrix.m24 * y + matrix.m34 * z + matrix.m44 * w;
+  return target;
+}

package/src/core/updateGridOpacity.js

@@ -0,0 +1,27 @@
+
+import { cancelGridFade } from './cancelGridFade.js';
+import { scheduleGridFade } from './scheduleGridFade.js';
+
+export function updateGridOpacity() {
+  if (!this._map) return;
+  const layer = this, now = Date.now();
+  let fading = false, prune = false;
+  let key, tile;
+  for (key in this._tiles) {
+    if (!Object.hasOwn(this._tiles, key)) continue;
+    tile = this._tiles[key];
+    if (!tile.current || !tile.loaded) continue;
+    tile._gpuOpacity = this._map._fadeAnimated ? Math.min(1, (now - tile.loaded) / 200) : 1;
+    if (tile._gpuOpacity < 1) fading = true;
+    else if (!tile.active) {
+      this._onOpaqueTile(tile);
+      tile.active = true;
+      prune = true;
+    }
+  }
+  if (prune && !this._noPrune) this._pruneTiles();
+  refreshNativeLayerContract(this);
+  cancelGridFade(layer);
+  if (fading) scheduleGridFade(layer);
+}
+import { refreshNativeLayerContract } from './refreshNativeLayerContract.js';

package/src/core/updateNativeHover.js

@@ -0,0 +1,7 @@
+export function updateNativeHover(map, context, event, source) {
+  if (context.hovered === source) return;
+  if (context.hovered) context.fireDOMEvent.call(map, event, context.out, /* alloc */ [context.hovered]);
+  context.hovered = source;
+  if (source) context.fireDOMEvent.call(map, event, context.over, /* alloc */ [source]);
+  map.getContainer().style.cursor = source ? 'pointer' : '';
+}

package/src/core/updateNativeLayerView.js

@@ -0,0 +1,9 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { update } from '../scene/update.js';
+
+export function updateNativeLayerView() {
+  this.viewDirty = true;
+  if (sceneByLayer.get(this.backend)._shared) update(this.backend);
+}