@deck.gl/extensions 9.4.0-alpha.2 → 9.4.0-beta.3

package/dist/index.cjs

@@ -15,11 +15,11 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __toCommonJS = (mod2) => __copyProps(__defProp({}, "__esModule", { value: true }), mod2);
 
 // dist/index.js
-var dist_exports = {};
-__export(dist_exports, {
+var index_exports = {};
+__export(index_exports, {
   BrushingExtension: () => brushing_extension_default,
   ClipExtension: () => clip_extension_default,
   CollisionFilterExtension: () => collision_filter_extension_default,
@@ -31,13 +31,2642 @@ __export(dist_exports, {
   _TerrainExtension: () => terrain_extension_default,
   project64: () => project64_default
 });
-module.exports = __toCommonJS(dist_exports);
+module.exports = __toCommonJS(index_exports);
 
-// dist/brushing/brushing-extension.js
-var import_core2 = require("@deck.gl/core");
+// ../core/src/utils/log.ts
+var import_log = require("@probe.gl/log");
+var defaultLogger = new import_log.Log({ id: "deck" });
+var log_default = defaultLogger;
+
+// ../core/src/shaderlib/index.ts
+var import_shadertools2 = require("@luma.gl/shadertools");
+
+// ../core/src/shaderlib/misc/geometry.ts
+var source = (
+  /* wgsl */
+  `const SMOOTH_EDGE_RADIUS: f32 = 0.5;
+
+struct VertexGeometry {
+  position: vec4<f32>,
+  worldPosition: vec3<f32>,
+  worldPositionAlt: vec3<f32>,
+  normal: vec3<f32>,
+  uv: vec2<f32>,
+  pickingColor: vec3<f32>,
+};
+
+var<private> geometry_: VertexGeometry = VertexGeometry(
+  vec4<f32>(0.0, 0.0, 1.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec2<f32>(0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0)
+);
+
+struct FragmentGeometry {
+  uv: vec2<f32>,
+};
+
+var<private> fragmentGeometry: FragmentGeometry;
+
+fn smoothedge(edge: f32, x: f32) -> f32 {
+  return smoothstep(edge - SMOOTH_EDGE_RADIUS, edge + SMOOTH_EDGE_RADIUS, x);
+}
+`
+);
+var defines = "#define SMOOTH_EDGE_RADIUS 0.5";
+var vs = (
+  /* glsl */
+  `${defines}
+
+struct VertexGeometry {
+  vec4 position;
+  vec3 worldPosition;
+  vec3 worldPositionAlt;
+  vec3 normal;
+  vec2 uv;
+  vec3 pickingColor;
+} geometry = VertexGeometry(
+  vec4(0.0, 0.0, 1.0, 0.0),
+  vec3(0.0),
+  vec3(0.0),
+  vec3(0.0),
+  vec2(0.0),
+  vec3(0.0)
+);
+`
+);
+var fs = (
+  /* glsl */
+  `${defines}
+
+struct FragmentGeometry {
+  vec2 uv;
+};
+FragmentGeometry geometry;
+
+float smoothedge(float edge, float x) {
+  return smoothstep(edge - SMOOTH_EDGE_RADIUS, edge + SMOOTH_EDGE_RADIUS, x);
+}
+`
+);
+var geometry_default = {
+  name: "geometry",
+  source,
+  vs,
+  fs
+};
+
+// ../core/src/shaderlib/project/project.ts
+var import_shadertools = require("@luma.gl/shadertools");
+
+// ../core/src/shaderlib/project/viewport-uniforms.ts
+var import_core = require("@math.gl/core");
+
+// ../core/src/lib/constants.ts
+var import_mjolnir = require("mjolnir.js");
+var COORDINATE_SYSTEM = {
+  /**
+   * `LNGLAT` if rendering into a geospatial viewport, `CARTESIAN` otherwise
+   */
+  DEFAULT: "default",
+  /**
+   * Positions are interpreted as [longitude, latitude, elevation]
+   * longitude/latitude are in degrees, elevation is in meters.
+   * Dimensions are in meters.
+   */
+  LNGLAT: "lnglat",
+  /**
+   * Positions are interpreted as [x, y, z] in meter offsets from the coordinate origin.
+   * Dimensions are in meters.
+   */
+  METER_OFFSETS: "meter-offsets",
+  /**
+   * Positions are interpreted as [deltaLng, deltaLat, elevation] from the coordinate origin.
+   * deltaLng/deltaLat are in degrees, elevation is in meters.
+   * Dimensions are in meters.
+   */
+  LNGLAT_OFFSETS: "lnglat-offsets",
+  /**
+   * Positions and dimensions are in the common units of the viewport.
+   */
+  CARTESIAN: "cartesian"
+};
+Object.defineProperty(COORDINATE_SYSTEM, "IDENTITY", {
+  get: () => {
+    log_default.deprecated("COORDINATE_SYSTEM.IDENTITY", "COORDINATE_SYSTEM.CARTESIAN")();
+    return COORDINATE_SYSTEM.CARTESIAN;
+  }
+});
+var PROJECTION_MODE = {
+  /**
+   * Render geospatial data in Web Mercator projection
+   */
+  WEB_MERCATOR: 1,
+  /**
+   * Render geospatial data as a 3D globe
+   */
+  GLOBE: 2,
+  /**
+   * (Internal use only) Web Mercator projection at high zoom
+   */
+  WEB_MERCATOR_AUTO_OFFSET: 4,
+  /**
+   * No transformation
+   */
+  IDENTITY: 0
+};
+var UNIT = {
+  common: 0,
+  meters: 1,
+  pixels: 2
+};
+
+// ../core/src/utils/memoize.ts
+function isEqual(a, b) {
+  if (a === b) {
+    return true;
+  }
+  if (Array.isArray(a)) {
+    const len = a.length;
+    if (!b || b.length !== len) {
+      return false;
+    }
+    for (let i = 0; i < len; i++) {
+      if (a[i] !== b[i]) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return false;
+}
+function memoize(compute) {
+  let cachedArgs = {};
+  let cachedResult;
+  return (args) => {
+    for (const key in args) {
+      if (!isEqual(args[key], cachedArgs[key])) {
+        cachedResult = compute(args);
+        cachedArgs = args;
+        break;
+      }
+    }
+    return cachedResult;
+  };
+}
+
+// ../core/src/shaderlib/project/viewport-uniforms.ts
+var ZERO_VECTOR = [0, 0, 0, 0];
+var VECTOR_TO_POINT_MATRIX = [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0];
+var IDENTITY_MATRIX = [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1];
+var DEFAULT_PIXELS_PER_UNIT2 = [0, 0, 0];
+var DEFAULT_COORDINATE_ORIGIN = [0, 0, 0];
+var COORDINATE_SYSTEM_NUMBERS = {
+  default: -1,
+  cartesian: 0,
+  lnglat: 1,
+  "meter-offsets": 2,
+  "lnglat-offsets": 3
+};
+function getShaderCoordinateSystem(coordinateSystem) {
+  const shaderCoordinateSystem = COORDINATE_SYSTEM_NUMBERS[coordinateSystem];
+  if (shaderCoordinateSystem === void 0) {
+    throw new Error(`Invalid coordinateSystem: ${coordinateSystem}`);
+  }
+  return shaderCoordinateSystem;
+}
+var getMemoizedViewportUniforms = memoize(calculateViewportUniforms);
+function getOffsetOrigin(viewport, coordinateSystem, coordinateOrigin = DEFAULT_COORDINATE_ORIGIN) {
+  if (coordinateOrigin.length < 3) {
+    coordinateOrigin = [coordinateOrigin[0], coordinateOrigin[1], 0];
+  }
+  let shaderCoordinateOrigin = coordinateOrigin;
+  let geospatialOrigin;
+  let offsetMode = true;
+  if (coordinateSystem === "lnglat-offsets" || coordinateSystem === "meter-offsets") {
+    geospatialOrigin = coordinateOrigin;
+  } else {
+    geospatialOrigin = viewport.isGeospatial ? (
+      // @ts-expect-error longitude and latitude are not defined on the base Viewport, but is expected on geospatial viewports
+      [Math.fround(viewport.longitude), Math.fround(viewport.latitude), 0]
+    ) : null;
+  }
+  switch (viewport.projectionMode) {
+    case PROJECTION_MODE.WEB_MERCATOR:
+      if (coordinateSystem === "lnglat" || coordinateSystem === "cartesian") {
+        geospatialOrigin = [0, 0, 0];
+        offsetMode = false;
+      }
+      break;
+    case PROJECTION_MODE.WEB_MERCATOR_AUTO_OFFSET:
+      if (coordinateSystem === "lnglat") {
+        shaderCoordinateOrigin = geospatialOrigin;
+      } else if (coordinateSystem === "cartesian") {
+        shaderCoordinateOrigin = [
+          Math.fround(viewport.center[0]),
+          Math.fround(viewport.center[1]),
+          0
+        ];
+        geospatialOrigin = viewport.unprojectPosition(shaderCoordinateOrigin);
+        shaderCoordinateOrigin[0] -= coordinateOrigin[0];
+        shaderCoordinateOrigin[1] -= coordinateOrigin[1];
+        shaderCoordinateOrigin[2] -= coordinateOrigin[2];
+      }
+      break;
+    case PROJECTION_MODE.IDENTITY:
+      shaderCoordinateOrigin = viewport.position.map(Math.fround);
+      shaderCoordinateOrigin[2] = shaderCoordinateOrigin[2] || 0;
+      break;
+    case PROJECTION_MODE.GLOBE:
+      offsetMode = false;
+      geospatialOrigin = null;
+      break;
+    default:
+      offsetMode = false;
+  }
+  return { geospatialOrigin, shaderCoordinateOrigin, offsetMode };
+}
+function calculateMatrixAndOffset(viewport, coordinateSystem, coordinateOrigin) {
+  const { viewMatrixUncentered, projectionMatrix } = viewport;
+  let { viewMatrix: viewMatrix2, viewProjectionMatrix } = viewport;
+  let projectionCenter = ZERO_VECTOR;
+  let originCommon = ZERO_VECTOR;
+  let cameraPosCommon = viewport.cameraPosition;
+  const { geospatialOrigin, shaderCoordinateOrigin, offsetMode } = getOffsetOrigin(
+    viewport,
+    coordinateSystem,
+    coordinateOrigin
+  );
+  if (offsetMode) {
+    originCommon = viewport.projectPosition(geospatialOrigin || shaderCoordinateOrigin);
+    cameraPosCommon = [
+      cameraPosCommon[0] - originCommon[0],
+      cameraPosCommon[1] - originCommon[1],
+      cameraPosCommon[2] - originCommon[2]
+    ];
+    originCommon[3] = 1;
+    projectionCenter = import_core.vec4.transformMat4([], originCommon, viewProjectionMatrix);
+    viewMatrix2 = viewMatrixUncentered || viewMatrix2;
+    viewProjectionMatrix = import_core.mat4.multiply([], projectionMatrix, viewMatrix2);
+    viewProjectionMatrix = import_core.mat4.multiply([], viewProjectionMatrix, VECTOR_TO_POINT_MATRIX);
+  }
+  return {
+    viewMatrix: viewMatrix2,
+    viewProjectionMatrix,
+    projectionCenter,
+    originCommon,
+    cameraPosCommon,
+    shaderCoordinateOrigin,
+    geospatialOrigin
+  };
+}
+function getUniformsFromViewport({
+  viewport,
+  devicePixelRatio = 1,
+  modelMatrix = null,
+  // Match Layer.defaultProps
+  coordinateSystem = "default",
+  coordinateOrigin = DEFAULT_COORDINATE_ORIGIN,
+  autoWrapLongitude = false
+}) {
+  if (coordinateSystem === "default") {
+    coordinateSystem = viewport.isGeospatial ? "lnglat" : "cartesian";
+  }
+  const uniforms = getMemoizedViewportUniforms({
+    viewport,
+    devicePixelRatio,
+    coordinateSystem,
+    coordinateOrigin
+  });
+  uniforms.wrapLongitude = autoWrapLongitude;
+  uniforms.modelMatrix = modelMatrix || IDENTITY_MATRIX;
+  return uniforms;
+}
+function calculateViewportUniforms({
+  viewport,
+  devicePixelRatio,
+  coordinateSystem,
+  coordinateOrigin
+}) {
+  const {
+    projectionCenter,
+    viewProjectionMatrix,
+    originCommon,
+    cameraPosCommon,
+    shaderCoordinateOrigin,
+    geospatialOrigin
+  } = calculateMatrixAndOffset(viewport, coordinateSystem, coordinateOrigin);
+  const distanceScales = viewport.getDistanceScales();
+  const viewportSize = [
+    viewport.width * devicePixelRatio,
+    viewport.height * devicePixelRatio
+  ];
+  const focalDistance = import_core.vec4.transformMat4([], [0, 0, -viewport.focalDistance, 1], viewport.projectionMatrix)[3] || 1;
+  const uniforms = {
+    // Projection mode values
+    coordinateSystem: getShaderCoordinateSystem(coordinateSystem),
+    projectionMode: viewport.projectionMode,
+    coordinateOrigin: shaderCoordinateOrigin,
+    commonOrigin: originCommon.slice(0, 3),
+    center: projectionCenter,
+    // Backward compatibility
+    // TODO: remove in v9
+    // @ts-expect-error _pseudoMeters is only defined on WebMercator viewport
+    pseudoMeters: Boolean(viewport._pseudoMeters),
+    // Screen size
+    viewportSize,
+    devicePixelRatio,
+    focalDistance,
+    commonUnitsPerMeter: distanceScales.unitsPerMeter,
+    commonUnitsPerWorldUnit: distanceScales.unitsPerMeter,
+    commonUnitsPerWorldUnit2: DEFAULT_PIXELS_PER_UNIT2,
+    scale: viewport.scale,
+    // This is the mercator scale (2 ** zoom)
+    wrapLongitude: false,
+    viewProjectionMatrix,
+    modelMatrix: IDENTITY_MATRIX,
+    // This is for lighting calculations
+    cameraPosition: cameraPosCommon
+  };
+  if (geospatialOrigin) {
+    const distanceScalesAtOrigin = viewport.getDistanceScales(geospatialOrigin);
+    switch (coordinateSystem) {
+      case "meter-offsets":
+        uniforms.commonUnitsPerWorldUnit = distanceScalesAtOrigin.unitsPerMeter;
+        uniforms.commonUnitsPerWorldUnit2 = distanceScalesAtOrigin.unitsPerMeter2;
+        break;
+      case "lnglat":
+      case "lnglat-offsets":
+        if (!viewport._pseudoMeters) {
+          uniforms.commonUnitsPerMeter = distanceScalesAtOrigin.unitsPerMeter;
+        }
+        uniforms.commonUnitsPerWorldUnit = distanceScalesAtOrigin.unitsPerDegree;
+        uniforms.commonUnitsPerWorldUnit2 = distanceScalesAtOrigin.unitsPerDegree2;
+        break;
+      // a.k.a "preprojected" positions
+      case "cartesian":
+        uniforms.commonUnitsPerWorldUnit = [1, 1, distanceScalesAtOrigin.unitsPerMeter[2]];
+        uniforms.commonUnitsPerWorldUnit2 = [0, 0, distanceScalesAtOrigin.unitsPerMeter2[2]];
+        break;
+      default:
+        break;
+    }
+  }
+  if (viewport.projectionMode === PROJECTION_MODE.GLOBE && coordinateSystem === "meter-offsets") {
+    const EARTH_RADIUS2 = 6370972;
+    const GLOBE_RADIUS2 = 256;
+    const lambda = coordinateOrigin[0] * Math.PI / 180;
+    const phi = coordinateOrigin[1] * Math.PI / 180;
+    const cosPhi = Math.cos(phi);
+    const D = ((coordinateOrigin[2] || 0) / EARTH_RADIUS2 + 1) * GLOBE_RADIUS2;
+    uniforms.commonOrigin = [
+      Math.sin(lambda) * cosPhi * D,
+      -Math.cos(lambda) * cosPhi * D,
+      Math.sin(phi) * D
+    ];
+  }
+  return uniforms;
+}
+
+// ../core/src/shaderlib/project/project.wgsl.ts
+var SHADER_COORDINATE_SYSTEMS = [
+  "default",
+  "lnglat",
+  "meter-offsets",
+  "lnglat-offsets",
+  "cartesian"
+];
+var COORDINATE_SYSTEM_WGSL_CONSTANTS = SHADER_COORDINATE_SYSTEMS.map(
+  (coordinateSystem) => `const COORDINATE_SYSTEM_${coordinateSystem.toUpperCase().replaceAll("-", "_")}: i32 = ${getShaderCoordinateSystem(coordinateSystem)};`
+).join("");
+var PROJECTION_MODE_WGSL_CONSTANTS = Object.keys(PROJECTION_MODE).map((key) => `const PROJECTION_MODE_${key}: i32 = ${PROJECTION_MODE[key]};`).join("");
+var UNIT_WGSL_CONSTANTS = Object.keys(UNIT).map((key) => `const UNIT_${key.toUpperCase()}: i32 = ${UNIT[key]};`).join("");
+var projectWGSLHeader = (
+  /* wgsl */
+  `${COORDINATE_SYSTEM_WGSL_CONSTANTS}
+${PROJECTION_MODE_WGSL_CONSTANTS}
+${UNIT_WGSL_CONSTANTS}
+
+const TILE_SIZE: f32 = 512.0;
+const PI: f32 = 3.1415926536;
+const WORLD_SCALE: f32 = TILE_SIZE / (PI * 2.0);
+const ZERO_64_LOW: vec3<f32> = vec3<f32>(0.0, 0.0, 0.0);
+const EARTH_RADIUS: f32 = 6370972.0; // meters
+const GLOBE_RADIUS: f32 = 256.0;
+
+// -----------------------------------------------------------------------------
+// Uniform block (converted from GLSL uniform block)
+// -----------------------------------------------------------------------------
+struct ProjectUniforms {
+  wrapLongitude: i32,
+  coordinateSystem: i32,
+  commonUnitsPerMeter: vec3<f32>,
+  projectionMode: i32,
+  scale: f32,
+  commonUnitsPerWorldUnit: vec3<f32>,
+  commonUnitsPerWorldUnit2: vec3<f32>,
+  center: vec4<f32>,
+  modelMatrix: mat4x4<f32>,
+  viewProjectionMatrix: mat4x4<f32>,
+  viewportSize: vec2<f32>,
+  devicePixelRatio: f32,
+  focalDistance: f32,
+  cameraPosition: vec3<f32>,
+  coordinateOrigin: vec3<f32>,
+  commonOrigin: vec3<f32>,
+  pseudoMeters: i32,
+};
+
+@group(0) @binding(auto)
+var<uniform> project: ProjectUniforms;
+
+// -----------------------------------------------------------------------------
+// Geometry data shared across the project helpers.
+// The active layer shader is responsible for populating this private module
+// state before calling the project functions below.
+// -----------------------------------------------------------------------------
+
+// Structure to carry additional geometry data used by deck.gl filters.
+struct Geometry {
+  worldPosition: vec3<f32>,
+  worldPositionAlt: vec3<f32>,
+  position: vec4<f32>,
+  normal: vec3<f32>,
+  uv: vec2<f32>,
+  pickingColor: vec3<f32>,
+};
+
+var<private> geometry: Geometry;
+`
+);
+var projectWGSL = (
+  /* wgsl */
+  `${projectWGSLHeader}
+
+// -----------------------------------------------------------------------------
+// Functions
+// -----------------------------------------------------------------------------
+
+// Returns an adjustment factor for commonUnitsPerMeter
+fn _project_size_at_latitude(lat: f32) -> f32 {
+  let y = clamp(lat, -89.9, 89.9);
+  return 1.0 / cos(radians(y));
+}
+
+// Overloaded version: scales a value in meters at a given latitude.
+fn _project_size_at_latitude_m(meters: f32, lat: f32) -> f32 {
+  return meters * project.commonUnitsPerMeter.z * _project_size_at_latitude(lat);
+}
+
+// Computes a non-linear scale factor based on geometry.
+// (Note: This function relies on "geometry" being provided.)
+fn project_size() -> f32 {
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR &&
+      project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT &&
+      project.pseudoMeters == 0) {
+    if (geometry.position.w == 0.0) {
+      return _project_size_at_latitude(geometry.worldPosition.y);
+    }
+    let y: f32 = geometry.position.y / TILE_SIZE * 2.0 - 1.0;
+    let y2 = y * y;
+    let y4 = y2 * y2;
+    let y6 = y4 * y2;
+    return 1.0 + 4.9348 * y2 + 4.0587 * y4 + 1.5642 * y6;
+  }
+  return 1.0;
+}
+
+// Overloads to scale offsets (meters to world units)
+fn project_size_float(meters: f32) -> f32 {
+  return meters * project.commonUnitsPerMeter.z * project_size();
+}
+
+fn project_size_vec2(meters: vec2<f32>) -> vec2<f32> {
+  return meters * project.commonUnitsPerMeter.xy * project_size();
+}
+
+fn project_size_vec3(meters: vec3<f32>) -> vec3<f32> {
+  return meters * project.commonUnitsPerMeter * project_size();
+}
+
+fn project_size_vec4(meters: vec4<f32>) -> vec4<f32> {
+  return vec4<f32>(meters.xyz * project.commonUnitsPerMeter, meters.w);
+}
+
+// Returns a rotation matrix aligning the z\u2011axis with the given up vector.
+fn project_get_orientation_matrix(up: vec3<f32>) -> mat3x3<f32> {
+  let uz = normalize(up);
+  let ux = select(
+    vec3<f32>(1.0, 0.0, 0.0),
+    normalize(vec3<f32>(uz.y, -uz.x, 0.0)),
+    abs(uz.z) == 1.0
+  );
+  let uy = cross(uz, ux);
+  return mat3x3<f32>(ux, uy, uz);
+}
+
+// Since WGSL does not support "out" parameters, we return a struct.
+struct RotationResult {
+  needsRotation: bool,
+  transform: mat3x3<f32>,
+};
+
+fn project_needs_rotation(commonPosition: vec3<f32>) -> RotationResult {
+  if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+    return RotationResult(true, project_get_orientation_matrix(commonPosition));
+  } else {
+    return RotationResult(false, mat3x3<f32>());  // identity alternative if needed
+  };
+}
+
+// Projects a normal vector from the current coordinate system to world space.
+fn project_normal(vector: vec3<f32>) -> vec3<f32> {
+  let normal_modelspace = project.modelMatrix * vec4<f32>(vector, 0.0);
+  var n = normalize(normal_modelspace.xyz * project.commonUnitsPerMeter);
+  let rotResult = project_needs_rotation(geometry.position.xyz);
+  if (rotResult.needsRotation) {
+    n = rotResult.transform * n;
+  }
+  return n;
+}
+
+// Applies a scale offset based on y-offset (dy)
+fn project_offset_(offset: vec4<f32>) -> vec4<f32> {
+  let dy: f32 = offset.y;
+  let commonUnitsPerWorldUnit = project.commonUnitsPerWorldUnit + project.commonUnitsPerWorldUnit2 * dy;
+  return vec4<f32>(offset.xyz * commonUnitsPerWorldUnit, offset.w);
+}
+
+// Projects lng/lat coordinates to a unit tile [0,1]
+fn project_mercator_(lnglat: vec2<f32>) -> vec2<f32> {
+  var x = lnglat.x;
+  if (project.wrapLongitude != 0) {
+    x = ((x + 180.0) % 360.0) - 180.0;
+  }
+  let y = clamp(lnglat.y, -89.9, 89.9);
+  return vec2<f32>(
+    radians(x) + PI,
+    PI + log(tan_fp32(PI * 0.25 + radians(y) * 0.5))
+  ) * WORLD_SCALE;
+}
+
+// Projects lng/lat/z coordinates for a globe projection.
+fn project_globe_(lnglatz: vec3<f32>) -> vec3<f32> {
+  let lambda = radians(lnglatz.x);
+  let phi = radians(lnglatz.y);
+  let cosPhi = cos(phi);
+  let D = (lnglatz.z / EARTH_RADIUS + 1.0) * GLOBE_RADIUS;
+  return vec3<f32>(
+    sin(lambda) * cosPhi,
+    -cos(lambda) * cosPhi,
+    sin(phi)
+  ) * D;
+}
+
+// Projects positions (with an optional 64-bit low part) from the input
+// coordinate system to the common space.
+fn project_position_vec4_f64(position: vec4<f32>, position64Low: vec3<f32>) -> vec4<f32> {
+  var position_world = project.modelMatrix * position;
+
+  // Work around for a Mac+NVIDIA bug:
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      return vec4<f32>(
+        project_mercator_(position_world.xy),
+        _project_size_at_latitude_m(position_world.z, position_world.y),
+        position_world.w
+      );
+    }
+    if (project.coordinateSystem == COORDINATE_SYSTEM_CARTESIAN) {
+      position_world = vec4f(position_world.xyz + project.coordinateOrigin, position_world.w);
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      return vec4<f32>(
+        project_globe_(position_world.xyz),
+        position_world.w
+      );
+    }
+    if (project.coordinateSystem == COORDINATE_SYSTEM_METER_OFFSETS) {
+      let enuMatrix = project_get_orientation_matrix(project.commonOrigin);
+      let metersToCommon = GLOBE_RADIUS / EARTH_RADIUS;
+      let offsetCommon = (enuMatrix * vec3<f32>(-position_world.x, -position_world.y, position_world.z)) * metersToCommon;
+      return vec4<f32>(project.commonOrigin + offsetCommon, position_world.w);
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      if (abs(position_world.y - project.coordinateOrigin.y) > 0.25) {
+        return vec4<f32>(
+          project_mercator_(position_world.xy) - project.commonOrigin.xy,
+          project_size_float(position_world.z),
+          position_world.w
+        );
+      }
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_IDENTITY ||
+      (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET &&
+       (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT ||
+        project.coordinateSystem == COORDINATE_SYSTEM_CARTESIAN))) {
+    position_world = vec4f(position_world.xyz - project.coordinateOrigin, position_world.w);
+  }
+
+  return project_offset_(position_world) +
+         project_offset_(project.modelMatrix * vec4<f32>(position64Low, 0.0));
+}
+
+// Overloaded versions for different input types.
+fn project_position_vec4_f32(position: vec4<f32>) -> vec4<f32> {
+  return project_position_vec4_f64(position, ZERO_64_LOW);
+}
+
+fn project_position_vec3_f64(position: vec3<f32>, position64Low: vec3<f32>) -> vec3<f32> {
+  let projected_position = project_position_vec4_f64(vec4<f32>(position, 1.0), position64Low);
+  return projected_position.xyz;
+}
+
+fn project_position_vec3_f32(position: vec3<f32>) -> vec3<f32> {
+  let projected_position = project_position_vec4_f64(vec4<f32>(position, 1.0), ZERO_64_LOW);
+  return projected_position.xyz;
+}
+
+fn project_position_vec2_f32(position: vec2<f32>) -> vec2<f32> {
+  let projected_position = project_position_vec4_f64(vec4<f32>(position, 0.0, 1.0), ZERO_64_LOW);
+  return projected_position.xy;
+}
+
+// Transforms a common space position to clip space.
+fn project_common_position_to_clipspace_with_projection(position: vec4<f32>, viewProjectionMatrix: mat4x4<f32>, center: vec4<f32>) -> vec4<f32> {
+  var clipPosition = viewProjectionMatrix * position + center;
+  // deck.gl projection matrices use WebGL's [-w, w] depth range; WebGPU clips z to [0, w].
+  clipPosition.z = (clipPosition.z + clipPosition.w) * 0.5;
+  return clipPosition;
+}
+
+// Uses the project viewProjectionMatrix and center.
+fn project_common_position_to_clipspace(position: vec4<f32>) -> vec4<f32> {
+  return project_common_position_to_clipspace_with_projection(position, project.viewProjectionMatrix, project.center);
+}
+
+// Returns a clip space offset corresponding to a given number of screen pixels.
+fn project_pixel_size_to_clipspace(pixels: vec2<f32>) -> vec2<f32> {
+  let offset = pixels / project.viewportSize * project.devicePixelRatio * 2.0;
+  return offset * project.focalDistance;
+}
+
+fn project_meter_size_to_pixel(meters: f32) -> f32 {
+  return project_size_float(meters) * project.scale;
+}
+
+fn project_unit_size_to_pixel(size: f32, unit: i32) -> f32 {
+  if (unit == UNIT_METERS) {
+    return project_meter_size_to_pixel(size);
+  } else if (unit == UNIT_COMMON) {
+    return size * project.scale;
+  }
+  // UNIT_PIXELS: no scaling applied.
+  return size;
+}
+
+fn project_pixel_size_float(pixels: f32) -> f32 {
+  return pixels / project.scale;
+}
+
+fn project_pixel_size_vec2(pixels: vec2<f32>) -> vec2<f32> {
+  return pixels / project.scale;
+}
+`
+);
+
+// ../core/src/shaderlib/project/project.glsl.ts
+var SHADER_COORDINATE_SYSTEMS2 = [
+  "default",
+  "lnglat",
+  "meter-offsets",
+  "lnglat-offsets",
+  "cartesian"
+];
+var COORDINATE_SYSTEM_GLSL_CONSTANTS = SHADER_COORDINATE_SYSTEMS2.map(
+  (coordinateSystem) => `const int COORDINATE_SYSTEM_${coordinateSystem.toUpperCase().replaceAll("-", "_")} = ${getShaderCoordinateSystem(coordinateSystem)};`
+).join("");
+var PROJECTION_MODE_GLSL_CONSTANTS = Object.keys(PROJECTION_MODE).map((key) => `const int PROJECTION_MODE_${key} = ${PROJECTION_MODE[key]};`).join("");
+var UNIT_GLSL_CONSTANTS = Object.keys(UNIT).map((key) => `const int UNIT_${key.toUpperCase()} = ${UNIT[key]};`).join("");
+var projectGLSL = (
+  /* glsl */
+  `${COORDINATE_SYSTEM_GLSL_CONSTANTS}
+${PROJECTION_MODE_GLSL_CONSTANTS}
+${UNIT_GLSL_CONSTANTS}
+
+layout(std140) uniform projectUniforms {
+  bool wrapLongitude;
+  int coordinateSystem;
+  vec3 commonUnitsPerMeter;
+  int projectionMode;
+  float scale;
+  vec3 commonUnitsPerWorldUnit;
+  vec3 commonUnitsPerWorldUnit2;
+  vec4 center;
+  mat4 modelMatrix;
+  mat4 viewProjectionMatrix;
+  vec2 viewportSize;
+  float devicePixelRatio;
+  float focalDistance;
+  vec3 cameraPosition;
+  vec3 coordinateOrigin;
+  vec3 commonOrigin;
+  bool pseudoMeters;
+} project;
+
+
+const float TILE_SIZE = 512.0;
+const float PI = 3.1415926536;
+const float WORLD_SCALE = TILE_SIZE / (PI * 2.0);
+const vec3 ZERO_64_LOW = vec3(0.0);
+const float EARTH_RADIUS = 6370972.0; // meters
+const float GLOBE_RADIUS = 256.0;
+
+// returns an adjustment factor for uCommonUnitsPerMeter
+float project_size_at_latitude(float lat) {
+  float y = clamp(lat, -89.9, 89.9);
+  return 1.0 / cos(radians(y));
+}
+
+float project_size() {
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR &&
+    project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT &&
+    project.pseudoMeters == false) {
+
+    // uCommonUnitsPerMeter in low-zoom Web Mercator is non-linear
+    // Adjust by 1 / cos(latitude)
+    // If geometry.position (vertex in common space) is populated, use it
+    // Otherwise use geometry.worldPosition (anchor in world space)
+
+    if (geometry.position.w == 0.0) {
+      return project_size_at_latitude(geometry.worldPosition.y);
+    }
+
+    // latitude from common y: 2.0 * (atan(exp(y / TILE_SIZE * 2.0 * PI - PI)) - PI / 4.0)
+    // Taylor series of 1 / cos(latitude)
+    // Max error < 0.003
+
+    float y = geometry.position.y / TILE_SIZE * 2.0 - 1.0;
+    float y2 = y * y;
+    float y4 = y2 * y2;
+    float y6 = y4 * y2;
+    return 1.0 + 4.9348 * y2 + 4.0587 * y4 + 1.5642 * y6;
+  }
+  return 1.0;
+}
+
+float project_size_at_latitude(float meters, float lat) {
+  return meters * project.commonUnitsPerMeter.z * project_size_at_latitude(lat);
+}
+
+//
+// Scaling offsets - scales meters to "world distance"
+// Note the scalar version of project_size is for scaling the z component only
+//
+float project_size(float meters) {
+  // For scatter relevant
+  return meters * project.commonUnitsPerMeter.z * project_size();
+}
+
+vec2 project_size(vec2 meters) {
+  return meters * project.commonUnitsPerMeter.xy * project_size();
+}
+
+vec3 project_size(vec3 meters) {
+  return meters * project.commonUnitsPerMeter * project_size();
+}
+
+vec4 project_size(vec4 meters) {
+  return vec4(meters.xyz * project.commonUnitsPerMeter, meters.w);
+}
+
+// Get rotation matrix that aligns the z axis with the given up vector
+// Find 3 unit vectors ux, uy, uz that are perpendicular to each other and uz == up
+mat3 project_get_orientation_matrix(vec3 up) {
+  vec3 uz = normalize(up);
+  // Tangent on XY plane
+  vec3 ux = abs(uz.z) == 1.0 ? vec3(1.0, 0.0, 0.0) : normalize(vec3(uz.y, -uz.x, 0));
+  vec3 uy = cross(uz, ux);
+  return mat3(ux, uy, uz);
+}
+
+bool project_needs_rotation(vec3 commonPosition, out mat3 transform) {
+  if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+    transform = project_get_orientation_matrix(commonPosition);
+    return true;
+  }
+  return false;
+}
+
+//
+// Projecting normal - transform deltas from current coordinate system to
+// normals in the worldspace
+//
+vec3 project_normal(vec3 vector) {
+  // Apply model matrix
+  vec4 normal_modelspace = project.modelMatrix * vec4(vector, 0.0);
+  vec3 n = normalize(normal_modelspace.xyz * project.commonUnitsPerMeter);
+  mat3 rotation;
+  if (project_needs_rotation(geometry.position.xyz, rotation)) {
+    n = rotation * n;
+  }
+  return n;
+}
+
+vec4 project_offset_(vec4 offset) {
+  float dy = offset.y;
+  vec3 commonUnitsPerWorldUnit = project.commonUnitsPerWorldUnit + project.commonUnitsPerWorldUnit2 * dy;
+  return vec4(offset.xyz * commonUnitsPerWorldUnit, offset.w);
+}
+
+//
+// Projecting positions - non-linear projection: lnglats => unit tile [0-1, 0-1]
+//
+vec2 project_mercator_(vec2 lnglat) {
+  float x = lnglat.x;
+  if (project.wrapLongitude) {
+    x = mod(x + 180., 360.0) - 180.;
+  }
+  float y = clamp(lnglat.y, -89.9, 89.9);
+  return vec2(
+    radians(x) + PI,
+    PI + log(tan_fp32(PI * 0.25 + radians(y) * 0.5))
+  ) * WORLD_SCALE;
+}
+
+vec3 project_globe_(vec3 lnglatz) {
+  float lambda = radians(lnglatz.x);
+  float phi = radians(lnglatz.y);
+  float cosPhi = cos(phi);
+  float D = (lnglatz.z / EARTH_RADIUS + 1.0) * GLOBE_RADIUS;
+
+  return vec3(
+    sin(lambda) * cosPhi,
+    -cos(lambda) * cosPhi,
+    sin(phi)
+  ) * D;
+}
+
+//
+// Projects positions (defined by project.coordinateSystem) to common space (defined by project.projectionMode)
+//
+vec4 project_position(vec4 position, vec3 position64Low) {
+  vec4 position_world = project.modelMatrix * position;
+
+  // Work around for a Mac+NVIDIA bug https://github.com/visgl/deck.gl/issues/4145
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      return vec4(
+        project_mercator_(position_world.xy),
+        project_size_at_latitude(position_world.z, position_world.y),
+        position_world.w
+      );
+    }
+    if (project.coordinateSystem == COORDINATE_SYSTEM_CARTESIAN) {
+      position_world.xyz += project.coordinateOrigin;
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      return vec4(
+        project_globe_(position_world.xyz),
+        position_world.w
+      );
+    }
+    if (project.coordinateSystem == COORDINATE_SYSTEM_METER_OFFSETS) {
+      mat3 enuMatrix = project_get_orientation_matrix(project.commonOrigin);
+      float metersToCommon = GLOBE_RADIUS / EARTH_RADIUS;
+      vec3 offsetCommon = (enuMatrix * vec3(-position_world.xy, position_world.z)) * metersToCommon;
+      return vec4(project.commonOrigin + offsetCommon, position_world.w);
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
+    if (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+      if (abs(position_world.y - project.coordinateOrigin.y) > 0.25) {
+        // Too far from the projection center for offset mode to be accurate
+        // Only use high parts
+        return vec4(
+          project_mercator_(position_world.xy) - project.commonOrigin.xy,
+          project_size(position_world.z),
+          position_world.w
+        );
+      }
+    }
+  }
+  if (project.projectionMode == PROJECTION_MODE_IDENTITY ||
+    (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET &&
+    (project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT ||
+     project.coordinateSystem == COORDINATE_SYSTEM_CARTESIAN))) {
+    // Subtract high part of 64 bit value. Convert remainder to float32, preserving precision.
+    position_world.xyz -= project.coordinateOrigin;
+  }
+
+  // Translation is already added to the high parts
+  return project_offset_(position_world) + project_offset_(project.modelMatrix * vec4(position64Low, 0.0));
+}
+
+vec4 project_position(vec4 position) {
+  return project_position(position, ZERO_64_LOW);
+}
+
+vec3 project_position(vec3 position, vec3 position64Low) {
+  vec4 projected_position = project_position(vec4(position, 1.0), position64Low);
+  return projected_position.xyz;
+}
+
+vec3 project_position(vec3 position) {
+  vec4 projected_position = project_position(vec4(position, 1.0), ZERO_64_LOW);
+  return projected_position.xyz;
+}
+
+vec2 project_position(vec2 position) {
+  vec4 projected_position = project_position(vec4(position, 0.0, 1.0), ZERO_64_LOW);
+  return projected_position.xy;
+}
+
+vec4 project_common_position_to_clipspace(vec4 position, mat4 viewProjectionMatrix, vec4 center) {
+  return viewProjectionMatrix * position + center;
+}
+
+//
+// Projects from common space coordinates to clip space.
+// Uses project.viewProjectionMatrix
+//
+vec4 project_common_position_to_clipspace(vec4 position) {
+  return project_common_position_to_clipspace(position, project.viewProjectionMatrix, project.center);
+}
+
+// Returns a clip space offset that corresponds to a given number of screen pixels
+vec2 project_pixel_size_to_clipspace(vec2 pixels) {
+  vec2 offset = pixels / project.viewportSize * project.devicePixelRatio * 2.0;
+  return offset * project.focalDistance;
+}
+
+float project_size_to_pixel(float meters) {
+  return project_size(meters) * project.scale;
+}
+vec2 project_size_to_pixel(vec2 meters) {
+  return project_size(meters) * project.scale;
+}
+float project_size_to_pixel(float size, int unit) {
+  if (unit == UNIT_METERS) return project_size_to_pixel(size);
+  if (unit == UNIT_COMMON) return size * project.scale;
+  // UNIT_PIXELS
+  return size;
+}
+float project_pixel_size(float pixels) {
+  return pixels / project.scale;
+}
+vec2 project_pixel_size(vec2 pixels) {
+  return pixels / project.scale;
+}
+`
+);
+
+// ../core/src/shaderlib/project/project.ts
+var INITIAL_MODULE_OPTIONS = {};
+function getUniforms(opts = INITIAL_MODULE_OPTIONS) {
+  if ("viewport" in opts) {
+    return getUniformsFromViewport(opts);
+  }
+  return {};
+}
+var project_default = {
+  name: "project",
+  dependencies: [import_shadertools.fp32, geometry_default],
+  source: projectWGSL,
+  vs: projectGLSL,
+  getUniforms,
+  uniformTypes: {
+    wrapLongitude: "f32",
+    coordinateSystem: "i32",
+    commonUnitsPerMeter: "vec3<f32>",
+    projectionMode: "i32",
+    scale: "f32",
+    commonUnitsPerWorldUnit: "vec3<f32>",
+    commonUnitsPerWorldUnit2: "vec3<f32>",
+    center: "vec4<f32>",
+    modelMatrix: "mat4x4<f32>",
+    viewProjectionMatrix: "mat4x4<f32>",
+    viewportSize: "vec2<f32>",
+    devicePixelRatio: "f32",
+    focalDistance: "f32",
+    cameraPosition: "vec3<f32>",
+    coordinateOrigin: "vec3<f32>",
+    commonOrigin: "vec3<f32>",
+    pseudoMeters: "f32"
+  }
+  // @ts-ignore TODO v9.1
+};
+
+// ../core/src/passes/pass.ts
+var Pass = class {
+  /** Create a new Pass instance */
+  constructor(device, props = { id: "pass" }) {
+    const { id } = props;
+    this.id = id;
+    this.device = device;
+    this.props = { ...props };
+  }
+  setProps(props) {
+    Object.assign(this.props, props);
+  }
+  render(params) {
+  }
+  // eslint-disable-line @typescript-eslint/no-empty-function
+  cleanup() {
+  }
+  // eslint-disable-line @typescript-eslint/no-empty-function
+};
+
+// ../core/src/passes/layers-pass.ts
+var WEBGPU_DEFAULT_DRAW_PARAMETERS = {
+  depthWriteEnabled: true,
+  depthCompare: "less-equal",
+  blendColorOperation: "add",
+  blendColorSrcFactor: "one",
+  blendColorDstFactor: "one-minus-src-alpha",
+  blendAlphaOperation: "add",
+  blendAlphaSrcFactor: "one",
+  blendAlphaDstFactor: "one-minus-src-alpha"
+};
+var LayersPass = class extends Pass {
+  constructor() {
+    super(...arguments);
+    this._lastRenderIndex = -1;
+  }
+  render(options) {
+    this._render(options);
+  }
+  _render(options) {
+    const { canvasContext = this.device.canvasContext } = options;
+    const framebuffer = options.target ?? canvasContext.getCurrentFramebuffer();
+    const [width, height] = canvasContext.getDrawingBufferSize();
+    const clearCanvas = options.clearCanvas ?? true;
+    let clearColor = options.clearColor ?? (clearCanvas ? [0, 0, 0, 0] : false);
+    let clearDepth = clearCanvas ? 1 : false;
+    let clearStencil = clearCanvas ? 0 : false;
+    const colorMask = options.colorMask ?? 15;
+    const parameters2 = { viewport: [0, 0, width, height] };
+    if (options.colorMask) {
+      parameters2.colorMask = colorMask;
+    }
+    if (options.scissorRect) {
+      parameters2.scissorRect = options.scissorRect;
+    }
+    const { shaderModuleProps, viewports, views, onViewportActive, clearStack = true } = options;
+    const pass = options.pass || "unknown";
+    const submitEachRenderPass = this.device.type === "webgpu";
+    if (clearStack) {
+      this._lastRenderIndex = -1;
+    }
+    const renderStats = [];
+    if (!viewports.length) {
+      const renderPass = this.device.beginRenderPass({
+        framebuffer,
+        parameters: parameters2,
+        clearColor,
+        clearDepth,
+        clearStencil
+      });
+      renderPass.end();
+      this.device.submit();
+      return renderStats;
+    }
+    try {
+      for (const viewport of viewports) {
+        onViewportActive == null ? void 0 : onViewportActive(viewport);
+        const drawLayerParams = this._getDrawLayerParams(viewport, options);
+        const view = views && views[viewport.id];
+        const subViewports = viewport.subViewports || [viewport];
+        const renderGroups = submitEachRenderPass ? subViewports.map((subViewport) => [subViewport]) : [subViewports];
+        for (const renderGroup of renderGroups) {
+          const renderPass = this.device.beginRenderPass({
+            framebuffer,
+            parameters: parameters2,
+            clearColor,
+            clearDepth,
+            clearStencil
+          });
+          try {
+            for (const subViewport of renderGroup) {
+              const stats = this._drawLayersInViewport(
+                renderPass,
+                {
+                  target: framebuffer,
+                  canvasContext,
+                  shaderModuleProps,
+                  viewport: subViewport,
+                  view,
+                  pass,
+                  layers: options.layers,
+                  isPicking: options.isPicking
+                },
+                drawLayerParams
+              );
+              renderStats.push(stats);
+            }
+          } finally {
+            renderPass.end();
+            if (submitEachRenderPass) {
+              this.device.submit();
+            }
+          }
+          clearColor = false;
+          clearDepth = false;
+          clearStencil = false;
+        }
+      }
+      return renderStats;
+    } finally {
+      if (!submitEachRenderPass) {
+        this.device.submit();
+      }
+    }
+  }
+  // When a viewport contains multiple subviewports (e.g. repeated web mercator map),
+  // this is only done once for the parent viewport
+  /* Resolve the parameters needed to draw each layer */
+  _getDrawLayerParams(viewport, {
+    layers,
+    pass,
+    isPicking = false,
+    layerFilter,
+    cullRect,
+    views,
+    effects,
+    canvasContext = this.device.canvasContext,
+    shaderModuleProps
+  }, evaluateShouldDrawOnly = false) {
+    var _a, _b;
+    const drawLayerParams = [];
+    const indexResolver = layerIndexResolver(this._lastRenderIndex + 1);
+    const drawContext = {
+      layer: layers[0],
+      viewport,
+      isPicking,
+      renderPass: pass,
+      cullRect
+    };
+    const layerFilterCache = {};
+    for (let layerIndex = 0; layerIndex < layers.length; layerIndex++) {
+      const layer = layers[layerIndex];
+      const shouldDrawLayer = this._shouldDrawLayer(
+        layer,
+        drawContext,
+        layerFilter,
+        layerFilterCache
+      );
+      const layerParam = { shouldDrawLayer };
+      if (shouldDrawLayer && !evaluateShouldDrawOnly) {
+        layerParam.shouldDrawLayer = true;
+        layerParam.layerRenderIndex = indexResolver(layer, shouldDrawLayer);
+        layerParam.shaderModuleProps = this._getShaderModuleProps(
+          layer,
+          effects,
+          pass,
+          canvasContext,
+          shaderModuleProps
+        );
+        const defaultParams = layer.context.device.type === "webgpu" ? WEBGPU_DEFAULT_DRAW_PARAMETERS : null;
+        layerParam.layerParameters = {
+          ...defaultParams,
+          ...(_a = layer.context.deck) == null ? void 0 : _a.props.parameters,
+          ...(_b = views == null ? void 0 : views[viewport.id]) == null ? void 0 : _b.props.parameters,
+          ...this.getLayerParameters(layer, layerIndex, viewport)
+        };
+      }
+      drawLayerParams[layerIndex] = layerParam;
+    }
+    return drawLayerParams;
+  }
+  // Draws a list of layers in one viewport
+  // TODO - when picking we could completely skip rendering viewports that dont
+  // intersect with the picking rect
+  /* eslint-disable max-depth, max-statements, complexity */
+  _drawLayersInViewport(renderPass, {
+    layers,
+    shaderModuleProps: globalModuleParameters,
+    pass,
+    target,
+    canvasContext,
+    viewport,
+    view,
+    isPicking
+  }, drawLayerParams) {
+    const glViewport = getGLViewport(this.device, {
+      canvasContext,
+      shaderModuleProps: globalModuleParameters,
+      target,
+      viewport
+    });
+    if (view) {
+      const { clear, clearColor, clearDepth, clearStencil } = view.props;
+      if (clear) {
+        let colorToUse = [0, 0, 0, 0];
+        let depthToUse = 1;
+        let stencilToUse = 0;
+        if (Array.isArray(clearColor) && !isPicking) {
+          colorToUse = [...clearColor.slice(0, 3), clearColor[3] || 255].map(
+            (c) => c / 255
+          );
+        } else if (clearColor === false) {
+          colorToUse = false;
+        }
+        if (clearDepth !== void 0) {
+          depthToUse = clearDepth;
+        }
+        if (clearStencil !== void 0) {
+          stencilToUse = clearStencil;
+        }
+        const clearRenderPass = this.device.beginRenderPass({
+          framebuffer: target,
+          parameters: {
+            viewport: glViewport,
+            scissorRect: glViewport
+          },
+          clearColor: colorToUse,
+          clearDepth: depthToUse,
+          clearStencil: stencilToUse
+        });
+        clearRenderPass.end();
+      }
+    }
+    const renderStatus = {
+      totalCount: layers.length,
+      visibleCount: 0,
+      compositeCount: 0,
+      pickableCount: 0
+    };
+    renderPass.setParameters({ viewport: glViewport });
+    for (let layerIndex = 0; layerIndex < layers.length; layerIndex++) {
+      const layer = layers[layerIndex];
+      const drawLayerParameters = drawLayerParams[layerIndex];
+      const { shouldDrawLayer } = drawLayerParameters;
+      if (shouldDrawLayer && layer.props.pickable) {
+        renderStatus.pickableCount++;
+      }
+      if (layer.isComposite) {
+        renderStatus.compositeCount++;
+      }
+      if (layer.isDrawable && drawLayerParameters.shouldDrawLayer) {
+        const { layerRenderIndex, shaderModuleProps, layerParameters } = drawLayerParameters;
+        renderStatus.visibleCount++;
+        this._lastRenderIndex = Math.max(this._lastRenderIndex, layerRenderIndex);
+        if (shaderModuleProps.project) {
+          shaderModuleProps.project.viewport = viewport;
+        }
+        layer.context.renderPass = renderPass;
+        try {
+          layer._drawLayer({
+            renderPass,
+            shaderModuleProps,
+            uniforms: { layerIndex: layerRenderIndex },
+            parameters: layerParameters
+          });
+        } catch (err) {
+          layer.raiseError(err, `drawing ${layer} to ${pass}`);
+        }
+      }
+    }
+    return renderStatus;
+  }
+  /* eslint-enable max-depth, max-statements */
+  /* Methods for subclass overrides */
+  shouldDrawLayer(layer) {
+    return true;
+  }
+  getShaderModuleProps(layer, effects, otherShaderModuleProps) {
+    return null;
+  }
+  getLayerParameters(layer, layerIndex, viewport) {
+    return layer.props.parameters;
+  }
+  /* Private */
+  _shouldDrawLayer(layer, drawContext, layerFilter, layerFilterCache) {
+    const shouldDrawLayer = layer.props.visible && this.shouldDrawLayer(layer);
+    if (!shouldDrawLayer) {
+      return false;
+    }
+    drawContext.layer = layer;
+    let parent = layer.parent;
+    while (parent) {
+      if (!parent.props.visible || !parent.filterSubLayer(drawContext)) {
+        return false;
+      }
+      drawContext.layer = parent;
+      parent = parent.parent;
+    }
+    if (layerFilter) {
+      const rootLayerId = drawContext.layer.id;
+      if (!(rootLayerId in layerFilterCache)) {
+        layerFilterCache[rootLayerId] = layerFilter(drawContext);
+      }
+      if (!layerFilterCache[rootLayerId]) {
+        return false;
+      }
+    }
+    layer.activateViewport(drawContext.viewport);
+    return true;
+  }
+  _getShaderModuleProps(layer, effects, pass, canvasContext, overrides) {
+    var _a, _b;
+    const devicePixelRatio = canvasContext.cssToDeviceRatio();
+    const layerProps = ((_a = layer.internalState) == null ? void 0 : _a.propsInTransition) || layer.props;
+    const shaderModuleProps = {
+      layer: layerProps,
+      picking: {
+        isActive: false
+      },
+      project: {
+        viewport: layer.context.viewport,
+        devicePixelRatio,
+        modelMatrix: layerProps.modelMatrix,
+        coordinateSystem: layerProps.coordinateSystem,
+        coordinateOrigin: layerProps.coordinateOrigin,
+        autoWrapLongitude: layer.wrapLongitude
+      }
+    };
+    if (effects) {
+      for (const effect of effects) {
+        mergeModuleParameters(
+          shaderModuleProps,
+          (_b = effect.getShaderModuleProps) == null ? void 0 : _b.call(effect, layer, shaderModuleProps)
+        );
+      }
+    }
+    for (const module2 of layer.context.defaultShaderModules) {
+      if (!(module2.name in shaderModuleProps)) {
+        shaderModuleProps[module2.name] = {};
+      }
+    }
+    return mergeModuleParameters(
+      shaderModuleProps,
+      this.getShaderModuleProps(layer, effects, shaderModuleProps),
+      overrides
+    );
+  }
+};
+function layerIndexResolver(startIndex = 0, layerIndices = {}) {
+  const resolvers = {};
+  const resolveLayerIndex = (layer, isDrawn) => {
+    const indexOverride = layer.props._offset;
+    const layerId = layer.id;
+    const parentId = layer.parent && layer.parent.id;
+    let index;
+    if (parentId && !(parentId in layerIndices)) {
+      resolveLayerIndex(layer.parent, false);
+    }
+    if (parentId in resolvers) {
+      const resolver = resolvers[parentId] = resolvers[parentId] || layerIndexResolver(layerIndices[parentId], layerIndices);
+      index = resolver(layer, isDrawn);
+      resolvers[layerId] = resolver;
+    } else if (Number.isFinite(indexOverride)) {
+      index = indexOverride + (layerIndices[parentId] || 0);
+      resolvers[layerId] = null;
+    } else {
+      index = startIndex;
+    }
+    if (isDrawn && index >= startIndex) {
+      startIndex = index + 1;
+    }
+    layerIndices[layerId] = index;
+    return index;
+  };
+  return resolveLayerIndex;
+}
+function getGLViewport(device, {
+  canvasContext = device.canvasContext,
+  shaderModuleProps,
+  target,
+  viewport
+}) {
+  var _a;
+  const pixelRatio = ((_a = shaderModuleProps == null ? void 0 : shaderModuleProps.project) == null ? void 0 : _a.devicePixelRatio) ?? canvasContext.cssToDeviceRatio();
+  const [, drawingBufferHeight] = canvasContext.getDrawingBufferSize();
+  const height = target ? target.height : drawingBufferHeight;
+  const dimensions = viewport;
+  return [
+    dimensions.x * pixelRatio,
+    height - (dimensions.y + dimensions.height) * pixelRatio,
+    dimensions.width * pixelRatio,
+    dimensions.height * pixelRatio
+  ];
+}
+function mergeModuleParameters(target, ...sources) {
+  for (const source2 of sources) {
+    if (source2) {
+      for (const key in source2) {
+        if (target[key]) {
+          Object.assign(target[key], source2[key]);
+        } else {
+          target[key] = source2[key];
+        }
+      }
+    }
+  }
+  return target;
+}
+
+// ../core/src/utils/math-utils.ts
+var import_core2 = require("@math.gl/core");
+function createMat4() {
+  return [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1];
+}
+function mod(value, divisor) {
+  const modulus = value % divisor;
+  return modulus < 0 ? divisor + modulus : modulus;
+}
+function getCameraPosition(viewMatrixInverse) {
+  return [viewMatrixInverse[12], viewMatrixInverse[13], viewMatrixInverse[14]];
+}
+function getFrustumPlanes(viewProjectionMatrix) {
+  return {
+    left: getFrustumPlane(
+      viewProjectionMatrix[3] + viewProjectionMatrix[0],
+      viewProjectionMatrix[7] + viewProjectionMatrix[4],
+      viewProjectionMatrix[11] + viewProjectionMatrix[8],
+      viewProjectionMatrix[15] + viewProjectionMatrix[12]
+    ),
+    right: getFrustumPlane(
+      viewProjectionMatrix[3] - viewProjectionMatrix[0],
+      viewProjectionMatrix[7] - viewProjectionMatrix[4],
+      viewProjectionMatrix[11] - viewProjectionMatrix[8],
+      viewProjectionMatrix[15] - viewProjectionMatrix[12]
+    ),
+    bottom: getFrustumPlane(
+      viewProjectionMatrix[3] + viewProjectionMatrix[1],
+      viewProjectionMatrix[7] + viewProjectionMatrix[5],
+      viewProjectionMatrix[11] + viewProjectionMatrix[9],
+      viewProjectionMatrix[15] + viewProjectionMatrix[13]
+    ),
+    top: getFrustumPlane(
+      viewProjectionMatrix[3] - viewProjectionMatrix[1],
+      viewProjectionMatrix[7] - viewProjectionMatrix[5],
+      viewProjectionMatrix[11] - viewProjectionMatrix[9],
+      viewProjectionMatrix[15] - viewProjectionMatrix[13]
+    ),
+    near: getFrustumPlane(
+      viewProjectionMatrix[3] + viewProjectionMatrix[2],
+      viewProjectionMatrix[7] + viewProjectionMatrix[6],
+      viewProjectionMatrix[11] + viewProjectionMatrix[10],
+      viewProjectionMatrix[15] + viewProjectionMatrix[14]
+    ),
+    far: getFrustumPlane(
+      viewProjectionMatrix[3] - viewProjectionMatrix[2],
+      viewProjectionMatrix[7] - viewProjectionMatrix[6],
+      viewProjectionMatrix[11] - viewProjectionMatrix[10],
+      viewProjectionMatrix[15] - viewProjectionMatrix[14]
+    )
+  };
+}
+var scratchVector = new import_core2.Vector3();
+function getFrustumPlane(a, b, c, d) {
+  scratchVector.set(a, b, c);
+  const L = scratchVector.len();
+  return { distance: d / L, normal: new import_core2.Vector3(-a / L, -b / L, -c / L) };
+}
+function fp64LowPart(x) {
+  return x - Math.fround(x);
+}
+
+// ../core/src/viewports/viewport.ts
+var import_core3 = require("@math.gl/core");
+var import_web_mercator = require("@math.gl/web-mercator");
+var DEGREES_TO_RADIANS = Math.PI / 180;
+var IDENTITY = createMat4();
+var ZERO_VECTOR2 = [0, 0, 0];
+var DEFAULT_DISTANCE_SCALES = {
+  unitsPerMeter: [1, 1, 1],
+  metersPerUnit: [1, 1, 1]
+};
+function createProjectionMatrix({
+  width,
+  height,
+  orthographic,
+  fovyRadians,
+  focalDistance,
+  padding,
+  near,
+  far
+}) {
+  const aspect = width / height;
+  const matrix = orthographic ? new import_core3.Matrix4().orthographic({ fovy: fovyRadians, aspect, focalDistance, near, far }) : new import_core3.Matrix4().perspective({ fovy: fovyRadians, aspect, near, far });
+  if (padding) {
+    const { left = 0, right = 0, top = 0, bottom = 0 } = padding;
+    const offsetX = (0, import_core3.clamp)((left + width - right) / 2, 0, width) - width / 2;
+    const offsetY = (0, import_core3.clamp)((top + height - bottom) / 2, 0, height) - height / 2;
+    matrix[8] -= offsetX * 2 / width;
+    matrix[9] += offsetY * 2 / height;
+  }
+  return matrix;
+}
+var _Viewport = class _Viewport {
+  // eslint-disable-next-line complexity
+  constructor(opts = {}) {
+    this._frustumPlanes = {};
+    this.id = opts.id || this.constructor.displayName || "viewport";
+    this.x = opts.x || 0;
+    this.y = opts.y || 0;
+    this.width = opts.width || 1;
+    this.height = opts.height || 1;
+    this.zoom = opts.zoom || 0;
+    this.padding = opts.padding;
+    this.distanceScales = opts.distanceScales || DEFAULT_DISTANCE_SCALES;
+    this.focalDistance = opts.focalDistance || 1;
+    this.position = opts.position || ZERO_VECTOR2;
+    this.modelMatrix = opts.modelMatrix || null;
+    const { longitude, latitude } = opts;
+    this.isGeospatial = Number.isFinite(latitude) && Number.isFinite(longitude);
+    this._initProps(opts);
+    this._initMatrices(opts);
+    this.equals = this.equals.bind(this);
+    this.project = this.project.bind(this);
+    this.unproject = this.unproject.bind(this);
+    this.projectPosition = this.projectPosition.bind(this);
+    this.unprojectPosition = this.unprojectPosition.bind(this);
+    this.projectFlat = this.projectFlat.bind(this);
+    this.unprojectFlat = this.unprojectFlat.bind(this);
+  }
+  get subViewports() {
+    return null;
+  }
+  get metersPerPixel() {
+    return this.distanceScales.metersPerUnit[2] / this.scale;
+  }
+  get projectionMode() {
+    if (this.isGeospatial) {
+      return this.zoom < 12 ? PROJECTION_MODE.WEB_MERCATOR : PROJECTION_MODE.WEB_MERCATOR_AUTO_OFFSET;
+    }
+    return PROJECTION_MODE.IDENTITY;
+  }
+  // Two viewports are equal if their dimensions, common-space scale, and
+  // view and projection matrices are (approximately) equal.
+  equals(viewport) {
+    if (!(viewport instanceof _Viewport)) {
+      return false;
+    }
+    if (this === viewport) {
+      return true;
+    }
+    return viewport.width === this.width && viewport.height === this.height && viewport.scale === this.scale && viewport.projectionMode === this.projectionMode && viewport.resolution === this.resolution && (0, import_core3.equals)(viewport.distanceScales.unitsPerMeter, this.distanceScales.unitsPerMeter) && (0, import_core3.equals)(viewport.projectionMatrix, this.projectionMatrix) && (0, import_core3.equals)(viewport.viewMatrix, this.viewMatrix);
+  }
+  /**
+   * Projects xyz (possibly latitude and longitude) to pixel coordinates in window
+   * using viewport projection parameters
+   * - [longitude, latitude] to [x, y]
+   * - [longitude, latitude, Z] => [x, y, z]
+   * Note: By default, returns top-left coordinates for canvas/SVG type render
+   *
+   * @param {Array} lngLatZ - [lng, lat] or [lng, lat, Z]
+   * @param {Object} opts - options
+   * @param {Object} opts.topLeft=true - Whether projected coords are top left
+   * @return {Array} - [x, y] or [x, y, z] in top left coords
+   */
+  project(xyz, { topLeft = true } = {}) {
+    const worldPosition = this.projectPosition(xyz);
+    const coord = (0, import_web_mercator.worldToPixels)(worldPosition, this.pixelProjectionMatrix);
+    const [x, y] = coord;
+    const y2 = topLeft ? y : this.height - y;
+    return xyz.length === 2 ? [x, y2] : [x, y2, coord[2]];
+  }
+  /**
+   * Unproject pixel coordinates on screen onto world coordinates,
+   * (possibly [lon, lat]) on map.
+   * - [x, y] => [lng, lat]
+   * - [x, y, z] => [lng, lat, Z]
+   * @param {Array} xyz -
+   * @param {Object} opts - options
+   * @param {Object} opts.topLeft=true - Whether origin is top left
+   * @return {Array|null} - [lng, lat, Z] or [X, Y, Z]
+   */
+  unproject(xyz, { topLeft = true, targetZ } = {}) {
+    const [x, y, z] = xyz;
+    const y2 = topLeft ? y : this.height - y;
+    const targetZWorld = targetZ && targetZ * this.distanceScales.unitsPerMeter[2];
+    const coord = (0, import_web_mercator.pixelsToWorld)([x, y2, z], this.pixelUnprojectionMatrix, targetZWorld);
+    const [X, Y, Z] = this.unprojectPosition(coord);
+    if (Number.isFinite(z)) {
+      return [X, Y, Z];
+    }
+    return Number.isFinite(targetZ) ? [X, Y, targetZ] : [X, Y];
+  }
+  // NON_LINEAR PROJECTION HOOKS
+  // Used for web meractor projection
+  projectPosition(xyz) {
+    const [X, Y] = this.projectFlat(xyz);
+    const Z = (xyz[2] || 0) * this.distanceScales.unitsPerMeter[2];
+    return [X, Y, Z];
+  }
+  unprojectPosition(xyz) {
+    const [X, Y] = this.unprojectFlat(xyz);
+    const Z = (xyz[2] || 0) * this.distanceScales.metersPerUnit[2];
+    return [X, Y, Z];
+  }
+  /**
+   * Project [lng,lat] on sphere onto [x,y] on 512*512 Mercator Zoom 0 tile.
+   * Performs the nonlinear part of the web mercator projection.
+   * Remaining projection is done with 4x4 matrices which also handles
+   * perspective.
+   * @param {Array} lngLat - [lng, lat] coordinates
+   *   Specifies a point on the sphere to project onto the map.
+   * @return {Array} [x,y] coordinates.
+   */
+  projectFlat(xyz) {
+    if (this.isGeospatial) {
+      const result = (0, import_web_mercator.lngLatToWorld)(xyz);
+      result[1] = (0, import_core3.clamp)(result[1], -318, 830);
+      return result;
+    }
+    return xyz;
+  }
+  /**
+   * Unproject world point [x,y] on map onto {lat, lon} on sphere
+   * @param {object|Vector} xy - object with {x,y} members
+   *  representing point on projected map plane
+   * @return {GeoCoordinates} - object with {lat,lon} of point on sphere.
+   *   Has toArray method if you need a GeoJSON Array.
+   *   Per cartographic tradition, lat and lon are specified as degrees.
+   */
+  unprojectFlat(xyz) {
+    if (this.isGeospatial) {
+      return (0, import_web_mercator.worldToLngLat)(xyz);
+    }
+    return xyz;
+  }
+  /**
+   * Get bounds of the current viewport
+   * @return {Array} - [minX, minY, maxX, maxY]
+   */
+  getBounds(options = {}) {
+    const unprojectOption = { targetZ: options.z || 0 };
+    const topLeft = this.unproject([0, 0], unprojectOption);
+    const topRight = this.unproject([this.width, 0], unprojectOption);
+    const bottomLeft = this.unproject([0, this.height], unprojectOption);
+    const bottomRight = this.unproject([this.width, this.height], unprojectOption);
+    return [
+      Math.min(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]),
+      Math.min(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]),
+      Math.max(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]),
+      Math.max(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1])
+    ];
+  }
+  getDistanceScales(coordinateOrigin) {
+    if (coordinateOrigin && this.isGeospatial) {
+      return (0, import_web_mercator.getDistanceScales)({
+        longitude: coordinateOrigin[0],
+        latitude: coordinateOrigin[1],
+        highPrecision: true
+      });
+    }
+    return this.distanceScales;
+  }
+  containsPixel({
+    x,
+    y,
+    width = 1,
+    height = 1
+  }) {
+    return x < this.x + this.width && this.x < x + width && y < this.y + this.height && this.y < y + height;
+  }
+  // Extract frustum planes in common space
+  getFrustumPlanes() {
+    if (this._frustumPlanes.near) {
+      return this._frustumPlanes;
+    }
+    Object.assign(this._frustumPlanes, getFrustumPlanes(this.viewProjectionMatrix));
+    return this._frustumPlanes;
+  }
+  // EXPERIMENTAL METHODS
+  /**
+   * Needed by panning and linear transition
+   * Pan the viewport to place a given world coordinate at screen point [x, y]
+   *
+   * @param {Array} coords - world coordinates
+   * @param {Array} pixel - [x,y] coordinates on screen
+   * @param {Array} startPixel - [x,y] screen position where pan started (optional, for delta-based panning)
+   * @return {Object} props of the new viewport
+   */
+  panByPosition(coords, pixel, startPixel) {
+    return null;
+  }
+  // INTERNAL METHODS
+  /* eslint-disable complexity, max-statements */
+  _initProps(opts) {
+    const longitude = opts.longitude;
+    const latitude = opts.latitude;
+    if (this.isGeospatial) {
+      if (!Number.isFinite(opts.zoom)) {
+        this.zoom = (0, import_web_mercator.getMeterZoom)({ latitude }) + Math.log2(this.focalDistance);
+      }
+      this.distanceScales = opts.distanceScales || (0, import_web_mercator.getDistanceScales)({ latitude, longitude });
+    }
+    const scale = Math.pow(2, this.zoom);
+    this.scale = scale;
+    const { position, modelMatrix } = opts;
+    let meterOffset = ZERO_VECTOR2;
+    if (position) {
+      meterOffset = modelMatrix ? new import_core3.Matrix4(modelMatrix).transformAsVector(position, []) : position;
+    }
+    if (this.isGeospatial) {
+      const center = this.projectPosition([longitude, latitude, 0]);
+      this.center = new import_core3.Vector3(meterOffset).scale(this.distanceScales.unitsPerMeter).add(center);
+    } else {
+      this.center = this.projectPosition(meterOffset);
+    }
+  }
+  /* eslint-enable complexity, max-statements */
+  _initMatrices(opts) {
+    const {
+      // View matrix
+      viewMatrix: viewMatrix2 = IDENTITY,
+      // Projection matrix
+      projectionMatrix = null,
+      // Projection matrix parameters, used if projectionMatrix not supplied
+      orthographic = false,
+      fovyRadians,
+      fovy = 75,
+      near = 0.1,
+      // Distance of near clipping plane
+      far = 1e3,
+      // Distance of far clipping plane
+      padding = null,
+      // Center offset in pixels
+      focalDistance = 1
+    } = opts;
+    this.viewMatrixUncentered = viewMatrix2;
+    this.viewMatrix = new import_core3.Matrix4().multiplyRight(viewMatrix2).translate(new import_core3.Vector3(this.center).negate());
+    this.projectionMatrix = projectionMatrix || createProjectionMatrix({
+      width: this.width,
+      height: this.height,
+      orthographic,
+      fovyRadians: fovyRadians || fovy * DEGREES_TO_RADIANS,
+      focalDistance,
+      padding,
+      near,
+      far
+    });
+    const vpm = createMat4();
+    import_core3.mat4.multiply(vpm, vpm, this.projectionMatrix);
+    import_core3.mat4.multiply(vpm, vpm, this.viewMatrix);
+    this.viewProjectionMatrix = vpm;
+    this.viewMatrixInverse = import_core3.mat4.invert([], this.viewMatrix) || this.viewMatrix;
+    this.cameraPosition = getCameraPosition(this.viewMatrixInverse);
+    const viewportMatrix = createMat4();
+    const pixelProjectionMatrix = createMat4();
+    import_core3.mat4.scale(viewportMatrix, viewportMatrix, [this.width / 2, -this.height / 2, 1]);
+    import_core3.mat4.translate(viewportMatrix, viewportMatrix, [1, -1, 0]);
+    import_core3.mat4.multiply(pixelProjectionMatrix, viewportMatrix, this.viewProjectionMatrix);
+    this.pixelProjectionMatrix = pixelProjectionMatrix;
+    this.pixelUnprojectionMatrix = import_core3.mat4.invert(createMat4(), this.pixelProjectionMatrix);
+    if (!this.pixelUnprojectionMatrix) {
+      log_default.warn("Pixel project matrix not invertible")();
+    }
+  }
+};
+_Viewport.displayName = "Viewport";
+var Viewport = _Viewport;
+
+// ../core/src/viewports/web-mercator-viewport.ts
+var import_web_mercator2 = require("@math.gl/web-mercator");
+var import_core4 = require("@math.gl/core");
+var _WebMercatorViewport = class _WebMercatorViewport extends Viewport {
+  /* eslint-disable complexity, max-statements */
+  constructor(opts = {}) {
+    const {
+      latitude = 0,
+      longitude = 0,
+      zoom = 0,
+      pitch = 0,
+      bearing = 0,
+      nearZMultiplier = 0.1,
+      farZMultiplier = 1.01,
+      nearZ,
+      farZ,
+      orthographic = false,
+      projectionMatrix,
+      repeat = false,
+      worldOffset = 0,
+      position,
+      padding,
+      // backward compatibility
+      // TODO: remove in v9
+      legacyMeterSizes = false
+    } = opts;
+    let { width, height, altitude = 1.5 } = opts;
+    const scale = Math.pow(2, zoom);
+    width = width || 1;
+    height = height || 1;
+    let fovy;
+    let projectionParameters = null;
+    if (projectionMatrix) {
+      altitude = projectionMatrix[5] / 2;
+      fovy = (0, import_web_mercator2.altitudeToFovy)(altitude);
+    } else {
+      if (opts.fovy) {
+        fovy = opts.fovy;
+        altitude = (0, import_web_mercator2.fovyToAltitude)(fovy);
+      } else {
+        fovy = (0, import_web_mercator2.altitudeToFovy)(altitude);
+      }
+      let offset;
+      if (padding) {
+        const { top = 0, bottom = 0 } = padding;
+        offset = [0, (0, import_core4.clamp)((top + height - bottom) / 2, 0, height) - height / 2];
+      }
+      projectionParameters = (0, import_web_mercator2.getProjectionParameters)({
+        width,
+        height,
+        scale,
+        center: position && [0, 0, position[2] * (0, import_web_mercator2.unitsPerMeter)(latitude)],
+        offset,
+        pitch,
+        fovy,
+        nearZMultiplier,
+        farZMultiplier
+      });
+      if (Number.isFinite(nearZ)) {
+        projectionParameters.near = nearZ;
+      }
+      if (Number.isFinite(farZ)) {
+        projectionParameters.far = farZ;
+      }
+    }
+    let viewMatrixUncentered = (0, import_web_mercator2.getViewMatrix)({
+      height,
+      pitch,
+      bearing,
+      scale,
+      altitude
+    });
+    if (worldOffset) {
+      const viewOffset = new import_core4.Matrix4().translate([512 * worldOffset, 0, 0]);
+      viewMatrixUncentered = viewOffset.multiplyLeft(viewMatrixUncentered);
+    }
+    super({
+      ...opts,
+      // x, y,
+      width,
+      height,
+      // view matrix
+      viewMatrix: viewMatrixUncentered,
+      longitude,
+      latitude,
+      zoom,
+      // projection matrix parameters
+      ...projectionParameters,
+      fovy,
+      focalDistance: altitude
+    });
+    this.latitude = latitude;
+    this.longitude = longitude;
+    this.zoom = zoom;
+    this.pitch = pitch;
+    this.bearing = bearing;
+    this.altitude = altitude;
+    this.fovy = fovy;
+    this.orthographic = orthographic;
+    this._subViewports = repeat ? [] : null;
+    this._pseudoMeters = legacyMeterSizes;
+    Object.freeze(this);
+  }
+  /* eslint-enable complexity, max-statements */
+  get subViewports() {
+    if (this._subViewports && !this._subViewports.length) {
+      const bounds = this.getBounds();
+      const minOffset = Math.floor((bounds[0] + 180) / 360);
+      const maxOffset = Math.ceil((bounds[2] - 180) / 360);
+      for (let x = minOffset; x <= maxOffset; x++) {
+        const offsetViewport = x ? new _WebMercatorViewport({
+          ...this,
+          worldOffset: x
+        }) : this;
+        this._subViewports.push(offsetViewport);
+      }
+    }
+    return this._subViewports;
+  }
+  /** Returns whether two Web Mercator viewports use the same projection settings. */
+  equals(viewport) {
+    return viewport instanceof _WebMercatorViewport && viewport._pseudoMeters === this._pseudoMeters && super.equals(viewport);
+  }
+  projectPosition(xyz) {
+    if (this._pseudoMeters) {
+      return super.projectPosition(xyz);
+    }
+    const [X, Y] = this.projectFlat(xyz);
+    const Z = (xyz[2] || 0) * (0, import_web_mercator2.unitsPerMeter)(xyz[1]);
+    return [X, Y, Z];
+  }
+  unprojectPosition(xyz) {
+    if (this._pseudoMeters) {
+      return super.unprojectPosition(xyz);
+    }
+    const [X, Y] = this.unprojectFlat(xyz);
+    const Z = (xyz[2] || 0) / (0, import_web_mercator2.unitsPerMeter)(Y);
+    return [X, Y, Z];
+  }
+  /**
+   * Add a meter delta to a base lnglat coordinate, returning a new lnglat array
+   *
+   * Note: Uses simple linear approximation around the viewport center
+   * Error increases with size of offset (roughly 1% per 100km)
+   *
+   * @param {[Number,Number]|[Number,Number,Number]) lngLatZ - base coordinate
+   * @param {[Number,Number]|[Number,Number,Number]) xyz - array of meter deltas
+   * @return {[Number,Number]|[Number,Number,Number]) array of [lng,lat,z] deltas
+   */
+  addMetersToLngLat(lngLatZ, xyz) {
+    return (0, import_web_mercator2.addMetersToLngLat)(lngLatZ, xyz);
+  }
+  panByPosition(coords, pixel, startPixel) {
+    const fromLocation = (0, import_web_mercator2.pixelsToWorld)(pixel, this.pixelUnprojectionMatrix);
+    const toLocation = this.projectFlat(coords);
+    const translate = import_core4.vec2.add([], toLocation, import_core4.vec2.negate([], fromLocation));
+    const newCenter = import_core4.vec2.add([], this.center, translate);
+    const [longitude, latitude] = this.unprojectFlat(newCenter);
+    return { longitude, latitude };
+  }
+  /**
+   * Returns a new longitude and latitude that keeps a 3D world coordinate at a given screen pixel
+   * This version handles the z-component (altitude) properly for cameras positioned above ground
+   */
+  panByPosition3D(coords, pixel) {
+    const targetZ = coords[2] || 0;
+    const deltaLngLat = import_core4.vec2.sub([], coords, this.unproject(pixel, { targetZ }));
+    return { longitude: this.longitude + deltaLngLat[0], latitude: this.latitude + deltaLngLat[1] };
+  }
+  getBounds(options = {}) {
+    const corners = (0, import_web_mercator2.getBounds)(this, options.z || 0);
+    return [
+      Math.min(corners[0][0], corners[1][0], corners[2][0], corners[3][0]),
+      Math.min(corners[0][1], corners[1][1], corners[2][1], corners[3][1]),
+      Math.max(corners[0][0], corners[1][0], corners[2][0], corners[3][0]),
+      Math.max(corners[0][1], corners[1][1], corners[2][1], corners[3][1])
+    ];
+  }
+  /**
+   * Returns a new viewport that fit around the given rectangle.
+   * Only supports non-perspective mode.
+   */
+  fitBounds(bounds, options = {}) {
+    const { width, height } = this;
+    const { longitude, latitude, zoom } = (0, import_web_mercator2.fitBounds)({ width, height, bounds, ...options });
+    return new _WebMercatorViewport({ width, height, longitude, latitude, zoom });
+  }
+};
+_WebMercatorViewport.displayName = "WebMercatorViewport";
+var WebMercatorViewport = _WebMercatorViewport;
+
+// ../core/src/passes/pick-layers-pass.ts
+var PICKING_BLENDING = {
+  blendColorOperation: "add",
+  blendColorSrcFactor: "one",
+  blendColorDstFactor: "zero",
+  blendAlphaOperation: "add",
+  blendAlphaSrcFactor: "constant",
+  blendAlphaDstFactor: "zero"
+};
+var PickLayersPass = class extends LayersPass {
+  constructor() {
+    super(...arguments);
+    this._colorEncoderState = null;
+  }
+  render(props) {
+    if ("pickingFBO" in props) {
+      return this._drawPickingBuffer(props);
+    }
+    const stats = super._render(props);
+    return { decodePickingColor: null, stats };
+  }
+  // Private
+  // Draws list of layers and viewports into the picking buffer
+  // Note: does not sample the buffer, that has to be done by the caller
+  _drawPickingBuffer({
+    layers,
+    layerFilter,
+    views,
+    viewports,
+    onViewportActive,
+    pickingFBO,
+    deviceRect: { x, y, width, height },
+    cullRect,
+    effects,
+    pass = "picking",
+    pickZ,
+    canvasContext,
+    shaderModuleProps,
+    clearColor
+  }) {
+    this.pickZ = pickZ;
+    const colorEncoderState = this._resetColorEncoder(pickZ);
+    const scissorRect = [x, y, width, height];
+    const renderStatus = super._render({
+      target: pickingFBO,
+      layers,
+      layerFilter,
+      views,
+      viewports,
+      onViewportActive,
+      cullRect,
+      effects: effects == null ? void 0 : effects.filter((e) => e.useInPicking),
+      pass,
+      canvasContext,
+      isPicking: true,
+      shaderModuleProps,
+      clearColor: clearColor ?? [0, 0, 0, 0],
+      colorMask: 15,
+      scissorRect
+    });
+    this._colorEncoderState = null;
+    const decodePickingColor = colorEncoderState && decodeColor.bind(null, colorEncoderState);
+    return { decodePickingColor, stats: renderStatus };
+  }
+  shouldDrawLayer(layer) {
+    const { pickable, operation } = layer.props;
+    return pickable && operation.includes("draw") || operation.includes("terrain") || operation.includes("mask");
+  }
+  getShaderModuleProps(layer, effects, otherShaderModuleProps) {
+    var _a;
+    return {
+      picking: {
+        isActive: 1,
+        isAttribute: this.pickZ,
+        disabledPickingIndices: (_a = layer.internalState) == null ? void 0 : _a.disabledPickingIndices
+      },
+      lighting: { enabled: false }
+    };
+  }
+  getLayerParameters(layer, layerIndex, viewport) {
+    var _a;
+    const pickParameters = {
+      ...layer.props.parameters
+    };
+    const { pickable, operation } = layer.props;
+    if (!this._colorEncoderState) {
+      pickParameters.blend = false;
+    } else if (pickable && operation.includes("draw")) {
+      Object.assign(pickParameters, PICKING_BLENDING);
+      pickParameters.blend = true;
+      if (this.device.type === "webgpu") {
+        pickParameters.blendConstant = encodeColor(this._colorEncoderState, layer, viewport);
+      } else {
+        pickParameters.blendColor = encodeColor(this._colorEncoderState, layer, viewport);
+      }
+      if (operation.includes("terrain") && ((_a = layer.state) == null ? void 0 : _a._hasPickingCover)) {
+        pickParameters.blendAlphaSrcFactor = "one";
+      }
+    } else if (operation.includes("terrain")) {
+      pickParameters.blend = false;
+    }
+    return pickParameters;
+  }
+  _resetColorEncoder(pickZ) {
+    this._colorEncoderState = pickZ ? null : {
+      byLayer: /* @__PURE__ */ new Map(),
+      byAlpha: []
+    };
+    return this._colorEncoderState;
+  }
+};
+function encodeColor(encoded, layer, viewport) {
+  const { byLayer, byAlpha } = encoded;
+  let a;
+  let entry = byLayer.get(layer);
+  if (entry) {
+    entry.viewports.push(viewport);
+    a = entry.a;
+  } else {
+    a = byLayer.size + 1;
+    if (a <= 255) {
+      entry = { a, layer, viewports: [viewport] };
+      byLayer.set(layer, entry);
+      byAlpha[a] = entry;
+    } else {
+      log_default.warn("Too many pickable layers, only picking the first 255")();
+      a = 0;
+    }
+  }
+  return [0, 0, 0, a / 255];
+}
+function decodeColor(encoded, pickedColor) {
+  const entry = encoded.byAlpha[pickedColor[3]];
+  return entry && {
+    pickedLayer: entry.layer,
+    pickedViewports: entry.viewports,
+    pickedObjectIndex: entry.layer.decodePickingColor(pickedColor)
+  };
+}
+
+// ../core/src/utils/deep-equal.ts
+function deepEqual(a, b, depth) {
+  if (a === b) {
+    return true;
+  }
+  if (!depth || !a || !b) {
+    return false;
+  }
+  if (Array.isArray(a)) {
+    if (!Array.isArray(b) || a.length !== b.length) {
+      return false;
+    }
+    for (let i = 0; i < a.length; i++) {
+      if (!deepEqual(a[i], b[i], depth - 1)) {
+        return false;
+      }
+    }
+    return true;
+  }
+  if (Array.isArray(b)) {
+    return false;
+  }
+  if (typeof a === "object" && typeof b === "object") {
+    const aKeys = Object.keys(a);
+    const bKeys = Object.keys(b);
+    if (aKeys.length !== bKeys.length) {
+      return false;
+    }
+    for (const key of aKeys) {
+      if (!b.hasOwnProperty(key)) {
+        return false;
+      }
+      if (!deepEqual(a[key], b[key], depth - 1)) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return false;
+}
+
+// ../core/src/utils/shader.ts
+function mergeShaders(target, source2) {
+  if (!source2) {
+    return target;
+  }
+  const result = { ...target, ...source2 };
+  if ("defines" in source2) {
+    result.defines = { ...target.defines, ...source2.defines };
+  }
+  if ("modules" in source2) {
+    result.modules = (target.modules || []).concat(source2.modules);
+    if (source2.modules.some((module2) => module2.name === "project64")) {
+      const index = result.modules.findIndex((module2) => module2.name === "project32");
+      if (index >= 0) {
+        result.modules.splice(index, 1);
+      }
+    }
+  }
+  if ("inject" in source2) {
+    if (!target.inject) {
+      result.inject = source2.inject;
+    } else {
+      const mergedInjection = { ...target.inject };
+      for (const key in source2.inject) {
+        mergedInjection[key] = (mergedInjection[key] || "") + source2.inject[key];
+      }
+      result.inject = mergedInjection;
+    }
+  }
+  return result;
+}
+
+// ../core/src/viewports/globe-viewport.ts
+var import_core5 = require("@math.gl/core");
+var import_web_mercator3 = require("@math.gl/web-mercator");
+var DEGREES_TO_RADIANS2 = Math.PI / 180;
+var RADIANS_TO_DEGREES = 180 / Math.PI;
+var NORTH_UP_BEARING_THRESHOLD = 1;
+var EARTH_RADIUS = 6370972;
+var GLOBE_RADIUS = 256;
+var GLOBE_ZOOM_ANCHOR_DAMPING_START_RATIO = 0.75;
+var GLOBE_ZOOM_ANCHOR_MAX_DISTANCE_RATIO = 1.15;
+function isGlobeNorthUp(bearing) {
+  const normalizedBearing = mod(bearing + 180, 360) - 180;
+  return Math.abs(normalizedBearing) < NORTH_UP_BEARING_THRESHOLD;
+}
+function getDistanceScales2() {
+  const unitsPerMeter2 = GLOBE_RADIUS / EARTH_RADIUS;
+  const unitsPerDegree = Math.PI / 180 * GLOBE_RADIUS;
+  return {
+    unitsPerMeter: [unitsPerMeter2, unitsPerMeter2, unitsPerMeter2],
+    unitsPerMeter2: [0, 0, 0],
+    metersPerUnit: [1 / unitsPerMeter2, 1 / unitsPerMeter2, 1 / unitsPerMeter2],
+    unitsPerDegree: [unitsPerDegree, unitsPerDegree, unitsPerMeter2],
+    unitsPerDegree2: [0, 0, 0],
+    degreesPerUnit: [1 / unitsPerDegree, 1 / unitsPerDegree, 1 / unitsPerMeter2]
+  };
+}
+var GlobeViewport = class extends Viewport {
+  constructor(opts = {}) {
+    const {
+      longitude = 0,
+      bearing = 0,
+      pitch = 0,
+      zoom = 0,
+      // Matches Maplibre defaults
+      // https://github.com/maplibre/maplibre-gl-js/blob/f8ab4b48d59ab8fe7b068b102538793bbdd4c848/src/geo/projection/globe_transform.ts#L632-L633
+      nearZMultiplier = 0.5,
+      farZMultiplier = 1,
+      resolution = 10
+    } = opts;
+    let { latitude = 0, height, altitude = 1.5, fovy } = opts;
+    latitude = Math.max(Math.min(latitude, 90), -90);
+    height = height || 1;
+    if (fovy) {
+      altitude = (0, import_web_mercator3.fovyToAltitude)(fovy);
+    } else {
+      fovy = (0, import_web_mercator3.altitudeToFovy)(altitude);
+    }
+    const scaleLatitude = Math.max(Math.min(latitude, import_web_mercator3.MAX_LATITUDE), -import_web_mercator3.MAX_LATITUDE);
+    const scale = Math.pow(2, zoom - zoomAdjust(scaleLatitude));
+    const pitchRadians = pitch * DEGREES_TO_RADIANS2;
+    const nearZ = opts.nearZ ?? nearZMultiplier;
+    const farZ = opts.farZ ?? (altitude + GLOBE_RADIUS * 2 * scale / height / Math.max(Math.cos(pitchRadians), 0.1)) * farZMultiplier;
+    const viewMatrix2 = new import_core5.Matrix4().lookAt({ eye: [0, -altitude, 0], up: [0, 0, 1] }).rotateX(-pitchRadians).rotateY(-bearing * DEGREES_TO_RADIANS2).rotateX(latitude * DEGREES_TO_RADIANS2).rotateZ(-longitude * DEGREES_TO_RADIANS2).scale(scale / height);
+    super({
+      ...opts,
+      // x, y, width,
+      height,
+      // view matrix
+      viewMatrix: viewMatrix2,
+      longitude,
+      latitude,
+      zoom,
+      // projection matrix parameters
+      distanceScales: getDistanceScales2(),
+      fovy,
+      focalDistance: altitude,
+      near: nearZ,
+      far: farZ
+    });
+    this.scale = scale;
+    this.latitude = latitude;
+    this.longitude = longitude;
+    this.bearing = bearing;
+    this.pitch = pitch;
+    this.fovy = fovy;
+    this.resolution = resolution;
+  }
+  get projectionMode() {
+    return PROJECTION_MODE.GLOBE;
+  }
+  getDistanceScales() {
+    return this.distanceScales;
+  }
+  getBounds(options = {}) {
+    const unprojectOption = { targetZ: options.z || 0 };
+    const left = this.unproject([0, this.height / 2], unprojectOption);
+    const top = this.unproject([this.width / 2, 0], unprojectOption);
+    const right = this.unproject([this.width, this.height / 2], unprojectOption);
+    const bottom = this.unproject([this.width / 2, this.height], unprojectOption);
+    if (right[0] < this.longitude) right[0] += 360;
+    if (left[0] > this.longitude) left[0] -= 360;
+    return [
+      Math.min(left[0], right[0], top[0], bottom[0]),
+      Math.min(left[1], right[1], top[1], bottom[1]),
+      Math.max(left[0], right[0], top[0], bottom[0]),
+      Math.max(left[1], right[1], top[1], bottom[1])
+    ];
+  }
+  /**
+   * Builds the screen-pixel → globe-center ray and the intermediate ray/sphere
+   * math reused by `unproject` and anchored zoom. One function so the same
+   * pixelUnprojectionMatrix work isn't duplicated.
+   */
+  _getRayToGlobe(screenPosition, { topLeft = true, targetZ } = {}) {
+    const [screenX, screenY] = screenPosition;
+    const adjustedScreenY = topLeft ? screenY : this.height - screenY;
+    const { pixelUnprojectionMatrix } = this;
+    const rayStartPosition = transformVector(pixelUnprojectionMatrix, [
+      screenX,
+      adjustedScreenY,
+      -1,
+      1
+    ]);
+    const rayEndPosition = transformVector(pixelUnprojectionMatrix, [
+      screenX,
+      adjustedScreenY,
+      1,
+      1
+    ]);
+    const radius = ((targetZ || 0) / EARTH_RADIUS + 1) * GLOBE_RADIUS;
+    const rayLengthSquared = import_core5.vec3.sqrLen(import_core5.vec3.sub([], rayStartPosition, rayEndPosition));
+    const rayStartDistanceSquared = import_core5.vec3.sqrLen(rayStartPosition);
+    const rayEndDistanceSquared = import_core5.vec3.sqrLen(rayEndPosition);
+    const triangleAreaSquared = (4 * rayStartDistanceSquared * rayEndDistanceSquared - (rayLengthSquared - rayStartDistanceSquared - rayEndDistanceSquared) ** 2) / 16;
+    const distanceToCenterSquared = 4 * triangleAreaSquared / rayLengthSquared;
+    return {
+      rayStartPosition,
+      rayEndPosition,
+      radius,
+      rayLengthSquared,
+      rayStartDistanceSquared,
+      distanceToCenterSquared
+    };
+  }
+  _getRayDistanceToGlobeCenterRatio(screenPosition, options) {
+    const { distanceToCenterSquared, radius } = this._getRayToGlobe(screenPosition, options);
+    return Math.sqrt(Math.max(0, distanceToCenterSquared)) / radius;
+  }
+  /**
+   * Returns how strongly a screen position should anchor zoom on the visible globe.
+   * A value of `0` means that the controller should fall back to center zoom.
+   * @param screenPosition - Screen position to evaluate.
+   * @returns Anchor strength from `0` to `1`.
+   */
+  getZoomAnchorStrength(screenPosition) {
+    const distanceRatio = this._getRayDistanceToGlobeCenterRatio(screenPosition);
+    if (distanceRatio >= GLOBE_ZOOM_ANCHOR_MAX_DISTANCE_RATIO) {
+      return 0;
+    }
+    const edgeProgress = Math.max(
+      0,
+      Math.min(
+        1,
+        (distanceRatio - GLOBE_ZOOM_ANCHOR_DAMPING_START_RATIO) / (GLOBE_ZOOM_ANCHOR_MAX_DISTANCE_RATIO - GLOBE_ZOOM_ANCHOR_DAMPING_START_RATIO)
+      )
+    );
+    const smoothProgress = edgeProgress * edgeProgress * (3 - 2 * edgeProgress);
+    return 1 - smoothProgress;
+  }
+  unproject(xyz, { topLeft = true, targetZ } = {}) {
+    const [x, y, z] = xyz;
+    const y2 = topLeft ? y : this.height - y;
+    const { pixelUnprojectionMatrix } = this;
+    let coord;
+    if (Number.isFinite(z)) {
+      coord = transformVector(pixelUnprojectionMatrix, [x, y2, z, 1]);
+    } else {
+      const {
+        rayStartPosition,
+        rayEndPosition,
+        radius,
+        rayLengthSquared,
+        rayStartDistanceSquared,
+        distanceToCenterSquared
+      } = this._getRayToGlobe(xyz, { topLeft, targetZ });
+      const rayStartToClosestApproach = Math.sqrt(
+        rayStartDistanceSquared - distanceToCenterSquared
+      );
+      const closestApproachToIntersection = Math.sqrt(
+        Math.max(0, radius * radius - distanceToCenterSquared)
+      );
+      const intersectionRatio = (rayStartToClosestApproach - closestApproachToIntersection) / Math.sqrt(rayLengthSquared);
+      coord = import_core5.vec3.lerp([], rayStartPosition, rayEndPosition, intersectionRatio);
+    }
+    const [X, Y, Z] = this.unprojectPosition(coord);
+    if (Number.isFinite(z)) {
+      return [X, Y, Z];
+    }
+    return Number.isFinite(targetZ) ? [X, Y, targetZ] : [X, Y];
+  }
+  projectPosition(xyz) {
+    const [lng, lat, Z = 0] = xyz;
+    const lambda = lng * DEGREES_TO_RADIANS2;
+    const phi = lat * DEGREES_TO_RADIANS2;
+    const cosPhi = Math.cos(phi);
+    const D = (Z / EARTH_RADIUS + 1) * GLOBE_RADIUS;
+    return [Math.sin(lambda) * cosPhi * D, -Math.cos(lambda) * cosPhi * D, Math.sin(phi) * D];
+  }
+  unprojectPosition(xyz) {
+    const [x, y, z] = xyz;
+    const D = import_core5.vec3.len(xyz);
+    const phi = Math.asin(z / D);
+    const lambda = Math.atan2(x, -y);
+    const lng = lambda * RADIANS_TO_DEGREES;
+    const lat = phi * RADIANS_TO_DEGREES;
+    const Z = (D / GLOBE_RADIUS - 1) * EARTH_RADIUS;
+    return [lng, lat, Z];
+  }
+  projectFlat(xyz) {
+    return xyz;
+  }
+  unprojectFlat(xyz) {
+    return xyz;
+  }
+  /**
+   * Pan the globe to place geographic coordinates at a screen pixel.
+   * When `dragStartPosition` is supplied, applies the delta-based movement used by globe dragging.
+   * @param coordinates - Geographic anchor, or the starting longitude, latitude and zoom.
+   * @param screenPosition - Current screen position.
+   * @param dragStartPosition - Screen position where a drag started.
+   * @returns Updated viewport options.
+   */
+  panByPosition(coordinates, screenPosition, dragStartPosition) {
+    if (!dragStartPosition) {
+      let anchorStrength = this.getZoomAnchorStrength(screenPosition);
+      if (anchorStrength === 0) {
+        return { longitude: this.longitude, latitude: this.latitude };
+      }
+      const currentCoordinates = this.unproject(screenPosition);
+      const longitudeDelta = mod(coordinates[0] - currentCoordinates[0] + 180, 360) - 180;
+      const latitudeDelta = coordinates[1] - currentCoordinates[1];
+      const crossesPole = Math.abs(currentCoordinates[1]) > import_web_mercator3.MAX_LATITUDE || Math.abs(longitudeDelta) > 90;
+      if (isGlobeNorthUp(this.bearing) && crossesPole) {
+        return { longitude: this.longitude, latitude: this.latitude };
+      }
+      if (isGlobeNorthUp(this.bearing) && latitudeDelta !== 0) {
+        const latitudeLimit = latitudeDelta > 0 ? import_web_mercator3.MAX_LATITUDE : -import_web_mercator3.MAX_LATITUDE;
+        const latitudeConstraintStrength = (latitudeLimit - this.latitude) / latitudeDelta;
+        anchorStrength = Math.min(anchorStrength, Math.max(0, latitudeConstraintStrength));
+      }
+      const longitude2 = this.longitude + longitudeDelta * anchorStrength;
+      const latitude2 = Math.max(Math.min(this.latitude + latitudeDelta * anchorStrength, 90), -90);
+      return { longitude: longitude2, latitude: latitude2 };
+    }
+    const [startLongitude, startLatitude, startZoom] = coordinates;
+    const scale = Math.pow(2, this.zoom - zoomAdjust(this.latitude));
+    const rotationSpeed = 0.25 / scale;
+    const longitude = startLongitude + rotationSpeed * (dragStartPosition[0] - screenPosition[0]);
+    let latitude = startLatitude - rotationSpeed * (dragStartPosition[1] - screenPosition[1]);
+    latitude = Math.max(Math.min(latitude, 90), -90);
+    const nextViewState = { longitude, latitude, zoom: startZoom - zoomAdjust(startLatitude) };
+    nextViewState.zoom += zoomAdjust(nextViewState.latitude);
+    return nextViewState;
+  }
+};
+GlobeViewport.displayName = "GlobeViewport";
+function zoomAdjust(latitude, clampToPoles) {
+  if (clampToPoles) {
+    latitude = Math.max(Math.min(latitude, import_web_mercator3.MAX_LATITUDE), -import_web_mercator3.MAX_LATITUDE);
+  }
+  const scaleAdjust = Math.PI * Math.cos(latitude * Math.PI / 180);
+  return Math.log2(scaleAdjust);
+}
+function transformVector(matrix, vector) {
+  const result = import_core5.vec4.transformMat4([], vector, matrix);
+  import_core5.vec4.scale(result, result, 1 / result[3]);
+  return result;
+}
+
+// ../core/src/viewports/orthographic-viewport.ts
+var import_core6 = require("@math.gl/core");
+var import_web_mercator4 = require("@math.gl/web-mercator");
+var viewMatrix = new import_core6.Matrix4().lookAt({ eye: [0, 0, 1] });
+function getProjectionMatrix({
+  width,
+  height,
+  near,
+  far,
+  padding
+}) {
+  let left = -width / 2;
+  let right = width / 2;
+  let bottom = -height / 2;
+  let top = height / 2;
+  if (padding) {
+    const { left: l = 0, right: r = 0, top: t = 0, bottom: b = 0 } = padding;
+    const offsetX = (0, import_core6.clamp)((l + width - r) / 2, 0, width) - width / 2;
+    const offsetY = (0, import_core6.clamp)((t + height - b) / 2, 0, height) - height / 2;
+    left -= offsetX;
+    right -= offsetX;
+    bottom += offsetY;
+    top += offsetY;
+  }
+  return new import_core6.Matrix4().ortho({
+    left,
+    right,
+    bottom,
+    top,
+    near,
+    far
+  });
+}
+var OrthographicViewport = class extends Viewport {
+  constructor(props) {
+    const {
+      width,
+      height,
+      near = 0.1,
+      far = 1e3,
+      zoom = 0,
+      target = [0, 0, 0],
+      padding = null,
+      flipY = true
+    } = props;
+    const zoomX = props.zoomX ?? (Array.isArray(zoom) ? zoom[0] : zoom);
+    const zoomY = props.zoomY ?? (Array.isArray(zoom) ? zoom[1] : zoom);
+    const zoom_ = Number.isFinite(props.zoom) ? props.zoom : Math.min(zoomX, zoomY);
+    const scale = Math.pow(2, zoom_);
+    let distanceScales;
+    if (zoomX !== zoom_ || zoomY !== zoom_) {
+      const scaleX = Math.pow(2, zoomX);
+      const scaleY = Math.pow(2, zoomY);
+      distanceScales = {
+        unitsPerMeter: [scaleX / scale, scaleY / scale, 1],
+        metersPerUnit: [scale / scaleX, scale / scaleY, 1]
+      };
+    }
+    super({
+      ...props,
+      // in case viewState contains longitude/latitude values,
+      // make sure that the base Viewport class does not treat this as a geospatial viewport
+      longitude: void 0,
+      position: target,
+      viewMatrix: viewMatrix.clone().scale([scale, scale * (flipY ? -1 : 1), scale]),
+      projectionMatrix: getProjectionMatrix({
+        width: width || 1,
+        height: height || 1,
+        padding,
+        near,
+        far
+      }),
+      zoom: zoom_,
+      distanceScales
+    });
+    this.target = target;
+    this.zoomX = zoomX;
+    this.zoomY = zoomY;
+    this.flipY = flipY;
+  }
+  projectFlat([X, Y]) {
+    const { unitsPerMeter: unitsPerMeter2 } = this.distanceScales;
+    return [X * unitsPerMeter2[0], Y * unitsPerMeter2[1]];
+  }
+  unprojectFlat([x, y]) {
+    const { metersPerUnit } = this.distanceScales;
+    return [x * metersPerUnit[0], y * metersPerUnit[1]];
+  }
+  /* Needed by LinearInterpolator */
+  panByPosition(coords, pixel, startPixel) {
+    const fromLocation = (0, import_web_mercator4.pixelsToWorld)(pixel, this.pixelUnprojectionMatrix);
+    const toLocation = this.projectFlat(coords);
+    const translate = import_core6.vec2.add([], toLocation, import_core6.vec2.negate([], fromLocation));
+    const newCenter = import_core6.vec2.add([], this.center, translate);
+    return { target: this.unprojectFlat(newCenter) };
+  }
+};
+OrthographicViewport.displayName = "OrthographicViewport";
+
+// ../core/src/lib/layer-extension.ts
+var LayerExtension = class {
+  static get componentName() {
+    return Object.prototype.hasOwnProperty.call(this, "extensionName") ? this.extensionName : "";
+  }
+  constructor(opts) {
+    if (opts) {
+      this.opts = opts;
+    }
+  }
+  /** Returns true if two extensions are equivalent */
+  equals(extension) {
+    if (this === extension) {
+      return true;
+    }
+    return this.constructor === extension.constructor && deepEqual(this.opts, extension.opts, 1);
+  }
+  /** Only called if attached to a primitive layer */
+  getShaders(extension) {
+    return null;
+  }
+  /** Only called if attached to a CompositeLayer */
+  getSubLayerProps(extension) {
+    const { defaultProps: defaultProps9 } = extension.constructor;
+    const newProps = {
+      updateTriggers: {}
+    };
+    for (const key in defaultProps9) {
+      if (key in this.props) {
+        const propDef = defaultProps9[key];
+        const propValue = this.props[key];
+        newProps[key] = propValue;
+        if (propDef && propDef.type === "accessor") {
+          newProps.updateTriggers[key] = this.props.updateTriggers[key];
+          if (typeof propValue === "function") {
+            newProps[key] = this.getSubLayerAccessor(propValue);
+          }
+        }
+      }
+    }
+    return newProps;
+  }
+  /* eslint-disable @typescript-eslint/no-empty-function */
+  initializeState(context, extension) {
+  }
+  updateState(params, extension) {
+  }
+  onNeedsRedraw(extension) {
+  }
+  getNeedsPickingBuffer(extension) {
+    return false;
+  }
+  draw(params, extension) {
+  }
+  finalizeState(context, extension) {
+  }
+};
+LayerExtension.defaultProps = {};
+LayerExtension.extensionName = "LayerExtension";
 
 // dist/brushing/shader-module.js
-var import_core = require("@deck.gl/core");
 var uniformBlock = (
   /* glsl */
   `layout(std140) uniform brushingUniforms {
@@ -75,7 +2704,7 @@ var vertex = (
   }
 `
 );
-var vs = `
+var vs2 = `
 ${uniformBlock}
 ${vertex}
 `;
@@ -85,7 +2714,7 @@ var fragment = (
   in float brushing_isVisible;
 `
 );
-var fs = `
+var fs2 = `
 ${uniformBlock}
 ${fragment}
 `;
@@ -128,9 +2757,9 @@ var inject = {
 };
 var shader_module_default = {
   name: "brushing",
-  dependencies: [import_core.project],
-  vs,
-  fs,
+  dependencies: [project_default],
+  vs: vs2,
+  fs: fs2,
   inject,
   getUniforms: (opts) => {
     if (!opts || !("viewport" in opts)) {
@@ -159,7 +2788,7 @@ var defaultProps = {
   brushingEnabled: true,
   brushingRadius: 1e4
 };
-var BrushingExtension = class extends import_core2.LayerExtension {
+var BrushingExtension = class extends LayerExtension {
   getShaders() {
     return {
       modules: [shader_module_default]
@@ -214,9 +2843,6 @@ BrushingExtension.defaultProps = defaultProps;
 BrushingExtension.extensionName = "BrushingExtension";
 var brushing_extension_default = BrushingExtension;
 
-// dist/data-filter/data-filter-extension.js
-var import_core3 = require("@deck.gl/core");
-
 // dist/data-filter/shader-module.js
 var uniformBlock2 = (
   /* glsl */
@@ -400,7 +3026,7 @@ float dataFilter_reduceValue(vec4 value) {
 #endif
 `
 );
-var vs2 = `
+var vs3 = `
 ${uniformBlock2}
 ${vertex2}
 `;
@@ -410,11 +3036,11 @@ var fragment2 = (
 in float dataFilter_value;
 `
 );
-var fs2 = `
+var fs3 = `
 ${uniformBlock2}
 ${fragment2}
 `;
-function getUniforms(opts) {
+function getUniforms2(opts) {
   if (!opts || !("extensions" in opts)) {
     return {};
   }
@@ -449,7 +3075,7 @@ function getUniforms64(opts) {
   if (!opts || !("extensions" in opts)) {
     return {};
   }
-  const uniforms = getUniforms(opts);
+  const uniforms = getUniforms2(opts);
   const min64High = uniforms.min.map(Math.fround);
   uniforms.min = uniforms.min.map((x, i) => x - min64High[i]);
   uniforms.softMin = uniforms.softMin.map((x, i) => x - min64High[i]);
@@ -527,16 +3153,16 @@ function uniformTypesFromOptions(opts) {
 }
 var dataFilter = {
   name: "dataFilter",
-  vs: vs2,
-  fs: fs2,
+  vs: vs3,
+  fs: fs3,
   inject: inject2,
-  getUniforms,
+  getUniforms: getUniforms2,
   uniformTypesFromOptions
 };
 var dataFilter64 = {
   name: "dataFilter",
-  vs: vs2,
-  fs: fs2,
+  vs: vs3,
+  fs: fs3,
   inject: inject2,
   getUniforms: getUniforms64,
   uniformTypesFromOptions
@@ -681,24 +3307,24 @@ var DATA_TYPE_FROM_SIZE = {
   3: "vec3",
   4: "vec4"
 };
-var DataFilterExtension = class extends import_core3.LayerExtension {
+var DataFilterExtension = class extends LayerExtension {
   constructor(opts = {}) {
     super({ ...defaultOptions, ...opts });
   }
   getShaders(extension) {
     const { categorySize, filterSize, fp64: fp642 } = extension.opts;
-    const defines = {};
+    const defines2 = {};
     if (categorySize) {
-      defines.DATACATEGORY_TYPE = CATEGORY_TYPE_FROM_SIZE[categorySize];
-      defines.DATACATEGORY_CHANNELS = categorySize;
+      defines2.DATACATEGORY_TYPE = CATEGORY_TYPE_FROM_SIZE[categorySize];
+      defines2.DATACATEGORY_CHANNELS = categorySize;
     }
     if (filterSize) {
-      defines.DATAFILTER_TYPE = DATA_TYPE_FROM_SIZE[filterSize];
-      defines.DATAFILTER_DOUBLE = Boolean(fp642);
+      defines2.DATAFILTER_TYPE = DATA_TYPE_FROM_SIZE[filterSize];
+      defines2.DATAFILTER_DOUBLE = Boolean(fp642);
     }
     const module2 = fp642 ? dataFilter64 : dataFilter;
     module2.uniformTypes = module2.uniformTypesFromOptions(extension.opts);
-    return { modules: [module2], defines };
+    return { modules: [module2], defines: defines2 };
   }
   initializeState(context, extension) {
     const attributeManager = this.getAttributeManager();
@@ -768,7 +3394,7 @@ var DataFilterExtension = class extends import_core3.LayerExtension {
       }
     }
     if (attributeManager == null ? void 0 : attributeManager.attributes.filterCategoryValues) {
-      const categoryBitMaskNeedsUpdate = attributeManager.attributes.filterCategoryValues.needsUpdate() || !(0, import_core3._deepEqual)(props.filterCategories, oldProps.filterCategories, 2);
+      const categoryBitMaskNeedsUpdate = attributeManager.attributes.filterCategoryValues.needsUpdate() || !deepEqual(props.filterCategories, oldProps.filterCategories, 2);
       if (categoryBitMaskNeedsUpdate) {
         this.setState({ categoryBitMask: null });
       }
@@ -862,7 +3488,7 @@ var DataFilterExtension = class extends import_core3.LayerExtension {
           const channel = c * (maxCategories / 32) + Math.floor(key / 32);
           categoryBitMask[channel] += Math.pow(2, key % 32);
         } else {
-          import_core3.log.warn(`Exceeded maximum number of categories (${maxCategories})`)();
+          log_default.warn(`Exceeded maximum number of categories (${maxCategories})`)();
         }
       }
     }
@@ -884,12 +3510,8 @@ DataFilterExtension.defaultProps = defaultProps2;
 DataFilterExtension.extensionName = "DataFilterExtension";
 var data_filter_extension_default = DataFilterExtension;
 
-// dist/fp64/fp64-extension.js
-var import_core5 = require("@deck.gl/core");
-
 // dist/fp64/project64.js
-var import_shadertools = require("@luma.gl/shadertools");
-var import_core4 = require("@deck.gl/core");
+var import_shadertools3 = require("@luma.gl/shadertools");
 
 // dist/fp64/project64.glsl.js
 var project64_glsl_default = `const vec2 WORLD_SCALE_FP64 = vec2(81.4873275756836, 0.0000032873668232014097);
@@ -968,12 +3590,12 @@ position, position64xyLow, offset, commonPosition
 `;
 
 // dist/fp64/project64.js
-var { fp64ify, fp64ifyMatrix4 } = import_shadertools.fp64;
+var { fp64ify, fp64ifyMatrix4 } = import_shadertools3.fp64;
 var project64_default = {
   name: "project64",
-  dependencies: [import_core4.project, import_shadertools.fp64],
+  dependencies: [project_default, import_shadertools3.fp64],
   vs: project64_glsl_default,
-  getUniforms: getUniforms2,
+  getUniforms: getUniforms3,
   uniformTypes: {
     scale: "vec2<f32>",
     // Cannot pass as vec2[16], so instead split into 2 mat4x4
@@ -981,8 +3603,8 @@ var project64_default = {
     viewProjectionMatrix64Low: "mat4x4<f32>"
   }
 };
-var getMemoizedUniforms = (0, import_core4._memoize)(calculateUniforms);
-function getUniforms2(opts) {
+var getMemoizedUniforms = memoize(calculateUniforms);
+function getUniforms3(opts) {
   if (opts && "viewport" in opts) {
     const { viewProjectionMatrix, scale } = opts.viewport;
     return getMemoizedUniforms({ viewProjectionMatrix, scale });
@@ -1009,7 +3631,7 @@ function calculateUniforms({ viewProjectionMatrix, scale }) {
 }
 
 // dist/fp64/fp64-extension.js
-var Fp64Extension = class extends import_core5.LayerExtension {
+var Fp64Extension = class extends LayerExtension {
   getShaders() {
     const { coordinateSystem } = this.props;
     if (coordinateSystem !== "lnglat" && coordinateSystem !== "default") {
@@ -1028,8 +3650,7 @@ Fp64Extension.extensionName = "Fp64Extension";
 var fp64_extension_default = Fp64Extension;
 
 // dist/path-style/path-style-extension.js
-var import_core6 = require("@deck.gl/core");
-var import_core7 = require("@math.gl/core");
+var import_core13 = require("@math.gl/core");
 
 // dist/path-style/shaders.glsl.js
 var dashShaders = {
@@ -1037,26 +3658,68 @@ var dashShaders = {
     "vs:#decl": `
 in vec2 instanceDashArrays;
 #ifdef HIGH_PRECISION_DASH
-in float instanceDashOffsets;
+in vec2 instanceDashOffsets;
 #endif
 out vec2 vDashArray;
 out float vDashOffset;
+out float vDashPathLength;
+layout(std140) uniform pathStyleUniforms {
+float dashAlignMode;
+bool dashGapPickable;
+highp int dashUnits;
+} pathStyle;
 `,
     "vs:#main-end": `
-vDashArray = instanceDashArrays;
+float dashWidthPixels = path.billboard
+? width.x * project.focalDistance
+: width.x * project.scale;
+float strokeHalfWidthPixels = path.billboard ? width.x : width.x * project.scale;
+float dashUnitPixels = strokeHalfWidthPixels;
+if (pathStyle.dashUnits == 1) {
+dashUnitPixels = 1.0;
+} else if (pathStyle.dashUnits == 2) {
+dashUnitPixels = project_size_to_pixel(1.0);
+} else if (pathStyle.dashUnits == 3) {
+dashUnitPixels = project.scale;
+}
+vDashArray = instanceDashArrays * (dashUnitPixels / dashWidthPixels);
 #ifdef HIGH_PRECISION_DASH
-vDashOffset = instanceDashOffsets / width.x;
+vec2 dashOffsetAndLength = (instanceDashOffsets * project.scale) / dashWidthPixels;
+vDashPathLength = dashOffsetAndLength.y;
+float dashUnitLength = vDashArray.x + vDashArray.y;
+float dashPeriod = pathStyle.dashAlignMode == 0.0
+? dashUnitLength
+: vDashPathLength / max(round(vDashPathLength / max(dashUnitLength, 0.0001)), 1.0);
+vDashOffset = dashPeriod > 0.0 ? mod(dashOffsetAndLength.x, dashPeriod) : 0.0;
 #else
 vDashOffset = 0.0;
+vDashPathLength = 0.0;
 #endif
 `,
     "fs:#decl": `
 layout(std140) uniform pathStyleUniforms {
 float dashAlignMode;
 bool dashGapPickable;
+highp int dashUnits;
 } pathStyle;
 in vec2 vDashArray;
 in float vDashOffset;
+in float vDashPathLength;
+float dashPatternIntegral(float position, float solidLength, float unitLength) {
+return floor(position / unitLength) * solidLength +
+min(mod(position, unitLength), solidLength);
+}
+float dashPatternCoverage(
+float position,
+float solidLength,
+float unitLength,
+float filterWidth
+) {
+float halfFilter = 0.5 * filterWidth;
+float reducedPosition = mod(position, unitLength);
+return (dashPatternIntegral(reducedPosition + halfFilter, solidLength, unitLength) -
+dashPatternIntegral(reducedPosition - halfFilter, solidLength, unitLength)) / filterWidth;
+}
 `,
     // if given position is in the gap part of the dashed line
     // dashArray.x: solid stroke length, relative to width
@@ -1067,36 +3730,90 @@ in float vDashOffset;
     // 1 - stretch to fit, draw half dash at each end for nicer joints
     // o--    ----    ----    ----    --o--      --o--     ----     --o
     "fs:#main-start": `
+float dashCoverage = 1.0;
+bool shouldDiscardDash = false;
+bool inRoundedDashGap = false;
+float roundedDashResolvedCoverage = 1.0;
+float roundedDashSubPixelBlend = 0.0;
+float roundedDashDutyCycle = 1.0;
 float solidLength = vDashArray.x;
 float gapLength = vDashArray.y;
 float unitLength = solidLength + gapLength;
+if (unitLength > 0.0 && gapLength > 0.0) {
 float offset;
-if (unitLength > 0.0) {
 if (pathStyle.dashAlignMode == 0.0) {
 offset = vDashOffset;
 } else {
-unitLength = vPathLength / round(vPathLength / unitLength);
+#ifdef HIGH_PRECISION_DASH
+unitLength = vDashPathLength / max(round(vDashPathLength / unitLength), 1.0);
+#else
+unitLength = vPathLength / max(round(vPathLength / unitLength), 1.0);
+#endif
+solidLength = min(solidLength, unitLength);
 offset = solidLength / 2.0;
+#ifdef HIGH_PRECISION_DASH
+offset += vDashOffset;
+#endif
 }
-float unitOffset = mod(vPathPosition.y + offset, unitLength);
-if (gapLength > 0.0 && unitOffset > solidLength) {
-if (path.capType <= 0.5) {
-if (!(pathStyle.dashGapPickable && bool(picking.isActive))) {
-discard;
-}
-} else {
-float distToEnd = length(vec2(
+float alongPath = vPathPosition.y + offset;
+float unitOffset = mod(alongPath, unitLength);
+float filterWidth = max(fwidth(alongPath), 0.0001);
+if (bool(picking.isActive)) {
+bool inGap = unitOffset > solidLength;
+if (inGap && path.capType > 0.5) {
+inGap = length(vec2(
 min(unitOffset - solidLength, unitLength - unitOffset),
 vPathPosition.x
-));
-if (distToEnd > 1.0) {
-if (!(pathStyle.dashGapPickable && bool(picking.isActive))) {
-discard;
+)) > 1.0;
+}
+if (inGap && !pathStyle.dashGapPickable) {
+shouldDiscardDash = true;
+}
+} else if (path.capType <= 0.5) {
+dashCoverage = dashPatternCoverage(alongPath, solidLength, unitLength, filterWidth);
+} else {
+float distanceAlongGap = min(unitOffset - solidLength, unitLength - unitOffset);
+float distanceToEnd = length(vec2(max(distanceAlongGap, 0.0), vPathPosition.x));
+float capEdgePixels = (1.0 - distanceToEnd) / max(fwidth(distanceToEnd), 1e-6);
+if (distanceAlongGap > 0.0) {
+inRoundedDashGap = true;
+roundedDashResolvedCoverage = smoothedge(0.0, capEdgePixels);
+dashCoverage = roundedDashResolvedCoverage;
 }
+float subPixelBlend = smoothstep(unitLength, 2.0 * unitLength, filterWidth);
+roundedDashSubPixelBlend = subPixelBlend;
+float boundedSolidLength = min(solidLength, unitLength);
+float effectiveGap = max(unitLength - boundedSolidLength, 0.0);
+float capSpan = 2.0 * sqrt(max(1.0 - vPathPosition.x * vPathPosition.x, 0.0));
+float roundedDutyCycle = clamp(
+(boundedSolidLength + min(effectiveGap, capSpan)) / unitLength,
+0.0,
+1.0
+);
+roundedDashDutyCycle = roundedDutyCycle;
+dashCoverage = mix(dashCoverage, roundedDutyCycle, subPixelBlend);
 }
+dashCoverage = clamp(dashCoverage, 0.0, 1.0);
+shouldDiscardDash = shouldDiscardDash || dashCoverage <= 0.0;
 }
+`,
+    "fs:#main-end": `
+#ifdef ANTIALIASING
+if (inRoundedDashGap) {
+float pathCoverage = smoothedge(0.0, edgePixels);
+float resolvedCapMultiplier =
+min(pathCoverage, roundedDashResolvedCoverage) / max(pathCoverage, 1e-6);
+dashCoverage = mix(
+resolvedCapMultiplier,
+roundedDashDutyCycle,
+roundedDashSubPixelBlend
+);
 }
+#endif
+if (shouldDiscardDash) {
+discard;
 }
+fragColor.a *= dashCoverage;
 `
   }
 };
@@ -1297,13 +4014,32 @@ float offsetDir = sign(instanceOffsets);
 vPathPosition.x = (vPathPosition.x + offsetDir) * offsetWidth - offsetDir;
 vPathPosition.y *= offsetWidth;
 vPathLength *= offsetWidth;
+#ifdef DASH_ENABLED
+if (pathStyle.dashUnits != 0) {
+vDashArray *= offsetWidth;
+}
+vPathBounds *= offsetWidth;
+#ifdef HIGH_PRECISION_DASH
+vDashPathLength *= offsetWidth;
+float restoredDashUnitLength = vDashArray.x + vDashArray.y;
+float restoredDashPeriod = pathStyle.dashAlignMode == 0.0
+? restoredDashUnitLength
+: vDashPathLength /
+max(round(vDashPathLength / max(restoredDashUnitLength, 0.0001)), 1.0);
+vDashOffset = restoredDashPeriod > 0.0
+? mod(dashOffsetAndLength.x * offsetWidth, restoredDashPeriod)
+: 0.0;
+#else
+vDashOffset *= offsetWidth;
+#endif
+#endif
 `,
-    "fs:#main-start": `
-float isInside;
-isInside = step(-1.0, vPathPosition.x) * step(vPathPosition.x, 1.0);
-if (isInside == 0.0) {
+    "fs:#main-end": `
+#ifndef ANTIALIASING
+if (abs(vPathPosition.x) > 1.0) {
 discard;
 }
+#endif
 `
   }
 };
@@ -1313,11 +4049,56 @@ var defaultProps3 = {
   getDashArray: { type: "accessor", value: [0, 0] },
   getOffset: { type: "accessor", value: 0 },
   dashJustified: false,
-  dashGapPickable: false
+  dashGapPickable: false,
+  dashUnits: "widths"
 };
-var PathStyleExtension = class extends import_core6.LayerExtension {
-  constructor({ dash = false, offset = false, highPrecisionDash = false } = {}) {
-    super({ dash: dash || highPrecisionDash, offset, highPrecisionDash });
+var DASH_UNITS = {
+  widths: 0,
+  pixels: 1,
+  meters: 2,
+  common: 3
+};
+var PATH_STYLE_ATTRIBUTES = ["instanceDashArrays", "instanceDashOffsets", "instanceOffsets"];
+function dashMetricsProjectionPropsChanged({ props, oldProps }) {
+  return !deepEqual(props.modelMatrix, oldProps.modelMatrix, 2) || props.coordinateSystem !== oldProps.coordinateSystem || !deepEqual(props.coordinateOrigin, oldProps.coordinateOrigin, 1);
+}
+function projectRenderedPathPosition(layer, position, projectUniforms) {
+  const viewport = layer.context.viewport;
+  if (!(viewport instanceof WebMercatorViewport) || viewport.zoom < 12) {
+    return layer.projectPosition(position, { autoOffset: false });
+  }
+  const positionWorld = import_core13.vec4.transformMat4([], [position[0], position[1], position[2] || 0, 1], projectUniforms.modelMatrix);
+  const coordinateSystem = layer.props.coordinateSystem === "default" ? "lnglat" : layer.props.coordinateSystem;
+  if (coordinateSystem === "lnglat") {
+    if (Math.abs(positionWorld[1] - projectUniforms.coordinateOrigin[1]) > 0.25) {
+      let longitude = positionWorld[0];
+      if (projectUniforms.wrapLongitude) {
+        longitude = ((longitude + 180) % 360 + 360) % 360 - 180;
+      }
+      const commonPosition = viewport.projectPosition([longitude, positionWorld[1], 0]);
+      return [
+        commonPosition[0] - projectUniforms.commonOrigin[0],
+        commonPosition[1] - projectUniforms.commonOrigin[1],
+        positionWorld[2] * projectUniforms.commonUnitsPerMeter[2]
+      ];
+    }
+    import_core13.vec3.sub(positionWorld, positionWorld, projectUniforms.coordinateOrigin);
+  } else if (coordinateSystem === "cartesian") {
+    import_core13.vec3.sub(positionWorld, positionWorld, projectUniforms.coordinateOrigin);
+  }
+  const deltaLatitude = positionWorld[1];
+  const scale = import_core13.vec3.scaleAndAdd([], projectUniforms.commonUnitsPerWorldUnit, projectUniforms.commonUnitsPerWorldUnit2, deltaLatitude);
+  return import_core13.vec3.multiply([], positionWorld, scale);
+}
+var PathStyleExtension = class extends LayerExtension {
+  constructor({ dash = false, offset = false, dashMode, highPrecisionDash = false } = {}) {
+    const resolvedDashMode = dashMode ?? (highPrecisionDash ? "path" : "segment");
+    super({
+      dash: dash || highPrecisionDash || dashMode !== void 0,
+      offset,
+      dashMode: resolvedDashMode,
+      highPrecisionDash: resolvedDashMode === "path"
+    });
   }
   getLayerType(layer) {
     if ("pathTesselator" in layer.state) {
@@ -1332,6 +4113,59 @@ var PathStyleExtension = class extends import_core6.LayerExtension {
     }
     return null;
   }
+  synchronizeAttributes(layer) {
+    const attributeManager = layer.getAttributeManager();
+    const layerType = this.getLayerType(layer);
+    if (!attributeManager || !layerType) {
+      return false;
+    }
+    const attributes = attributeManager.getAttributes();
+    const desiredAttributes = /* @__PURE__ */ new Set();
+    if (this.opts.dash) {
+      desiredAttributes.add("instanceDashArrays");
+    }
+    if (layerType === "path" && this.opts.dash && this.opts.dashMode === "path") {
+      desiredAttributes.add("instanceDashOffsets");
+    }
+    if (layerType === "path" && this.opts.offset) {
+      desiredAttributes.add("instanceOffsets");
+    }
+    let topologyChanged = false;
+    for (const attributeName of PATH_STYLE_ATTRIBUTES) {
+      if (attributes[attributeName] && !desiredAttributes.has(attributeName)) {
+        attributeManager.remove([attributeName]);
+        topologyChanged = true;
+      }
+    }
+    if (desiredAttributes.has("instanceDashArrays") && !attributes.instanceDashArrays) {
+      attributeManager.addInstanced({
+        instanceDashArrays: { size: 2, accessor: "getDashArray" }
+      });
+      topologyChanged = true;
+    }
+    if (desiredAttributes.has("instanceDashOffsets") && !attributes.instanceDashOffsets) {
+      attributeManager.addInstanced({
+        instanceDashOffsets: {
+          // [distance from the start of the path, total length of the path]
+          size: 2,
+          // Recalculate from rendered geometry when getPath changes. A binary getPath buffer
+          // contains positions, not dash metrics, so keep it as an update trigger rather than
+          // binding it directly to this attribute.
+          accessor: ["getPath"],
+          // eslint-disable-next-line @typescript-eslint/unbound-method
+          update: this.calculateDashMetrics
+        }
+      });
+      topologyChanged = true;
+    }
+    if (desiredAttributes.has("instanceOffsets") && !attributes.instanceOffsets) {
+      attributeManager.addInstanced({
+        instanceOffsets: { size: 1, accessor: "getOffset" }
+      });
+      topologyChanged = true;
+    }
+    return topologyChanged;
+  }
   isEnabled(layer) {
     return this.getLayerType(layer) !== null;
   }
@@ -1355,60 +4189,58 @@ var PathStyleExtension = class extends import_core6.LayerExtension {
       return { modules: [pathStyle2] };
     }
     let result = {};
-    const defines = {};
+    const defines2 = {};
     if (extension.opts.dash) {
-      result = (0, import_core6._mergeShaders)(result, dashShaders);
-      if (extension.opts.highPrecisionDash) {
-        defines.HIGH_PRECISION_DASH = true;
+      result = mergeShaders(result, dashShaders);
+      defines2.DASH_ENABLED = true;
+      if (extension.opts.dashMode === "path") {
+        defines2.HIGH_PRECISION_DASH = true;
       }
     }
     if (extension.opts.offset) {
-      result = (0, import_core6._mergeShaders)(result, offsetShaders);
+      result = mergeShaders(result, offsetShaders);
+      defines2.PATH_STYLE_OFFSET = true;
     }
     const { inject: inject6 } = result;
     const pathStyle = {
       name: "pathStyle",
-      inject: inject6,
-      uniformTypes: {
-        dashAlignMode: "f32",
-        dashGapPickable: "i32"
-      }
+      inject: inject6
     };
+    if (extension.opts.dash) {
+      pathStyle.uniformTypes = {
+        dashAlignMode: "f32",
+        dashGapPickable: "i32",
+        dashUnits: "i32"
+      };
+    }
     return {
       modules: [pathStyle],
-      defines
+      defines: defines2
     };
   }
   initializeState(context, extension) {
-    const attributeManager = this.getAttributeManager();
-    const layerType = extension.getLayerType(this);
-    if (!attributeManager || !layerType) {
-      return;
-    }
-    if (extension.opts.dash) {
-      attributeManager.addInstanced({
-        instanceDashArrays: { size: 2, accessor: "getDashArray" },
-        ...layerType === "path" && extension.opts.highPrecisionDash ? {
-          instanceDashOffsets: {
-            size: 1,
-            accessor: "getPath",
-            transform: extension.getDashOffsets.bind(this)
-          }
-        } : {}
-      });
-    }
-    if (layerType === "path" && extension.opts.offset) {
-      attributeManager.addInstanced({
-        instanceOffsets: { size: 1, accessor: "getOffset" }
-      });
-    }
+    extension.synchronizeAttributes(this);
   }
   updateState(params, extension) {
+    var _a;
     if (!extension.isEnabled(this)) {
       return;
     }
+    if (params.changeFlags.extensionsChanged) {
+      const topologyChanged = extension.synchronizeAttributes(this);
+      const attributeManager = this.getAttributeManager();
+      if (attributeManager && topologyChanged) {
+        attributeManager.invalidateAll();
+        for (const model of this.getModels()) {
+          model.setBufferLayout(attributeManager.getBufferLayouts(model));
+        }
+      }
+    }
     if (extension.opts.dash) {
       const layerType = extension.getLayerType(this);
+      if (layerType === "path" && extension.opts.dashMode === "path" && dashMetricsProjectionPropsChanged(params)) {
+        (_a = this.getAttributeManager()) == null ? void 0 : _a.invalidate("instanceDashOffsets");
+      }
       if (layerType === "scatterplot" || layerType === "textBackground") {
         const pathStyleProps = {
           dashGapPickable: Boolean(this.props.dashGapPickable)
@@ -1417,12 +4249,96 @@ var PathStyleExtension = class extends import_core6.LayerExtension {
       } else {
         const pathStyleProps = {
           dashAlignMode: this.props.dashJustified ? 1 : 0,
-          dashGapPickable: Boolean(this.props.dashGapPickable)
+          dashGapPickable: Boolean(this.props.dashGapPickable),
+          dashUnits: DASH_UNITS[this.props.dashUnits ?? "widths"]
         };
         this.setShaderModuleProps({ pathStyle: pathStyleProps });
       }
     }
   }
+  calculateDashMetrics(attribute, { startRow, endRow }) {
+    var _a, _b, _c;
+    const pathTesselator = this.state.pathTesselator;
+    const vertexStarts = pathTesselator == null ? void 0 : pathTesselator.vertexStarts;
+    const instanceCount = pathTesselator == null ? void 0 : pathTesselator.instanceCount;
+    const packedPositions = pathTesselator == null ? void 0 : pathTesselator.get("positions");
+    if (!vertexStarts || instanceCount === void 0 || typeof (pathTesselator == null ? void 0 : pathTesselator.getPathSegmentIndices) !== "function") {
+      throw new Error("PathStyleExtension requires PathLayer tessellation data for path dashes.");
+    }
+    const binaryPath = (_b = (_a = this.props.data) == null ? void 0 : _a.attributes) == null ? void 0 : _b.getPath;
+    const binaryValue = ArrayBuffer.isView(binaryPath) ? binaryPath : binaryPath == null ? void 0 : binaryPath.value;
+    const hasReadableBinaryPath = ArrayBuffer.isView(binaryValue);
+    const usePackedPositions = packedPositions && (!binaryPath || pathTesselator.normalize || ((_c = pathTesselator.opts) == null ? void 0 : _c.isWebGPU));
+    if (binaryPath && !hasReadableBinaryPath || !usePackedPositions && !hasReadableBinaryPath) {
+      throw new Error("PathStyleExtension cannot calculate whole-path dash metrics from GPU-only getPath data; supply data.attributes.instanceDashOffsets.");
+    }
+    const output = attribute.value;
+    const metricSize = attribute.size;
+    const firstRow = Math.max(0, startRow);
+    const lastRow = Math.min(endRow, vertexStarts.length - 1);
+    let binarySize = 3;
+    let binaryStride = 3;
+    let binaryOffset = 0;
+    if (!usePackedPositions) {
+      const bytesPerElement = binaryValue.BYTES_PER_ELEMENT;
+      binarySize = (binaryPath == null ? void 0 : binaryPath.size) || (this.props.positionFormat === "XY" ? 2 : 3);
+      binaryStride = (binaryPath == null ? void 0 : binaryPath.stride) ? binaryPath.stride / bytesPerElement : binarySize;
+      binaryOffset = (binaryPath == null ? void 0 : binaryPath.offset) ? binaryPath.offset / bytesPerElement : 0;
+    }
+    const sourcePosition = new Array(3);
+    const projectUniforms = project_default.getUniforms({
+      viewport: this.context.viewport,
+      modelMatrix: this.props.modelMatrix,
+      coordinateSystem: this.props.coordinateSystem,
+      coordinateOrigin: this.props.coordinateOrigin,
+      // PathLayer normalizes/cuts wrapped paths on the CPU; its shader never wraps again.
+      autoWrapLongitude: this.wrapLongitude
+    });
+    const readPosition = (vertexIndex) => {
+      if (usePackedPositions) {
+        sourcePosition[0] = packedPositions[vertexIndex * 3];
+        sourcePosition[1] = packedPositions[vertexIndex * 3 + 1];
+        sourcePosition[2] = packedPositions[vertexIndex * 3 + 2];
+      } else {
+        const sourceIndex = binaryOffset + vertexIndex * binaryStride;
+        sourcePosition[0] = binaryValue[sourceIndex];
+        sourcePosition[1] = binaryValue[sourceIndex + 1];
+        sourcePosition[2] = binarySize === 3 ? binaryValue[sourceIndex + 2] : 0;
+      }
+      return sourcePosition;
+    };
+    attribute.startIndices = vertexStarts;
+    for (let row = firstRow; row < lastRow; row++) {
+      const rowStart = vertexStarts[row];
+      const rowEnd = Math.min(vertexStarts[row + 1] ?? instanceCount, instanceCount);
+      output.fill(0, rowStart * metricSize, rowEnd * metricSize);
+      const validSegments = pathTesselator.getPathSegmentIndices(row);
+      let phase = 0;
+      let previousSegment = -2;
+      let previousEnd = null;
+      for (const segmentIndex of validSegments) {
+        const outputIndex = segmentIndex * metricSize;
+        output[outputIndex] = phase;
+        const start = segmentIndex === previousSegment + 1 && previousEnd ? previousEnd : projectRenderedPathPosition(this, readPosition(segmentIndex), projectUniforms);
+        const end = projectRenderedPathPosition(this, readPosition(segmentIndex + 1), projectUniforms);
+        phase += import_core13.vec3.dist(start, end);
+        previousSegment = segmentIndex;
+        previousEnd = end;
+      }
+      if (metricSize > 1) {
+        for (let vertexIndex = rowStart; vertexIndex < rowEnd; vertexIndex++) {
+          output[vertexIndex * metricSize + 1] = phase;
+        }
+      }
+    }
+  }
+  /**
+   * Calculates the distance from the start of a path to each rendered segment.
+   *
+   * The final entry is zero because PathLayer reserves the final vertex as invalid padding.
+   * This scalar return shape is retained for compatibility; path-mode rendering uses an
+   * internal attribute containing both each segment offset and the total path length.
+   */
   getDashOffsets(path) {
     const result = [0];
     const positionSize = this.props.positionFormat === "XY" ? 2 : 3;
@@ -1432,9 +4348,9 @@ var PathStyleExtension = class extends import_core6.LayerExtension {
     let prevP;
     for (let i = 0; i < geometrySize - 1; i++) {
       p = isNested ? path[i] : path.slice(i * positionSize, i * positionSize + positionSize);
-      p = this.projectPosition(p);
+      p = this.projectPosition(p, { autoOffset: false });
       if (i > 0) {
-        result[i] = result[i - 1] + import_core7.vec3.dist(prevP, p);
+        result[i] = result[i - 1] + import_core13.vec3.dist(prevP, p);
       }
       prevP = p;
     }
@@ -1446,17 +4362,27 @@ PathStyleExtension.defaultProps = defaultProps3;
 PathStyleExtension.extensionName = "PathStyleExtension";
 var path_style_extension_default = PathStyleExtension;
 
-// dist/fill-style/fill-style-extension.js
-var import_core9 = require("@deck.gl/core");
-
 // dist/fill-style/shader-module.js
-var import_core8 = require("@deck.gl/core");
+var FILL_UV_SCALE = 512 / 4e7;
+function getPatternUnitScale(sizeUnits, viewport) {
+  switch (sizeUnits) {
+    case "pixels":
+      return 2 ** -Math.round(viewport.zoom);
+    case "common":
+      return 1;
+    default:
+      return FILL_UV_SCALE;
+  }
+}
 var uniformBlock3 = (
   /* glsl */
   `layout(std140) uniform fillUniforms {
   vec2 patternTextureSize;
+  float patternUnitScale;
   bool patternEnabled;
   bool patternMask;
+  bool procedural;
+  bool flipY;
   vec2 uvCoordinateOrigin;
   vec2 uvCoordinateOrigin64Low;
 } fill;
@@ -1465,16 +4391,23 @@ var uniformBlock3 = (
 var patternVs = (
   /* glsl */
   `
+uniform sampler2D fill_patternTexture;
+
 in vec4 fillPatternFrames;
 in float fillPatternScales;
 in vec2 fillPatternOffsets;
+in vec4 fillPatternBackgroundColors;
 
 out vec2 fill_uv;
 out vec4 fill_patternBounds;
 out vec4 fill_patternPlacement;
+out vec4 fill_backgroundColor;
+out float fill_patternCoordinateScale;
+flat out vec4 fill_patternParams0;
+flat out vec4 fill_patternParams1;
 `
 );
-var vs3 = `
+var vs4 = `
 ${uniformBlock3}
 ${patternVs}
 `;
@@ -1485,29 +4418,172 @@ uniform sampler2D fill_patternTexture;
 
 in vec4 fill_patternBounds;
 in vec4 fill_patternPlacement;
+in vec4 fill_backgroundColor;
 in vec2 fill_uv;
+in float fill_patternCoordinateScale;
+flat in vec4 fill_patternParams0;
+flat in vec4 fill_patternParams1;
+
+const float FILL_PATTERN_HATCH = 1.0;
+const float FILL_PATTERN_CROSS_HATCH = 2.0;
+const float FILL_PATTERN_DOTS = 3.0;
+
+float fill_getPatternCoordinate(vec2 axis, float period, float offset) {
+  float coordinateScale = max(abs(fill_patternCoordinateScale), 1.0e-20);
+  vec2 coordinateOrigin = fill.uvCoordinateOrigin;
+  vec2 coordinateOffset = fill.uvCoordinateOrigin64Low + fill_uv;
+  float yDirection = fill.flipY ? 1.0 : -1.0;
+  coordinateOrigin.y *= yDirection;
+  coordinateOffset.y *= yDirection;
+
+  // Reduce the high part before adding the local offset to retain precision in large coordinates.
+  float highPart = mod(dot(coordinateOrigin, axis) / coordinateScale, period);
+  float lowPart = dot(coordinateOffset, axis) / coordinateScale;
+  return mod(highPart + lowPart + offset * period, period);
+}
+
+vec2 fill_getPatternCoords(
+  vec2 axis0,
+  vec2 axis1,
+  vec2 period,
+  vec2 offset
+) {
+  return vec2(
+    fill_getPatternCoordinate(axis0, period.x, offset.x),
+    fill_getPatternCoordinate(axis1, period.y, offset.y)
+  );
+}
 
-const float FILL_UV_SCALE = 512.0 / 40000000.0;
+float fill_getScreenSpaceAlpha(float signedDistance) {
+  float distanceDerivative = fwidth(signedDistance);
+  if (distanceDerivative == 0.0) {
+    return signedDistance <= 0.0 ? 1.0 : 0.0;
+  }
+  // Normalize the SDF to screen pixels so the coverage ramp is independent of pattern units.
+  float distanceInPixels = signedDistance / distanceDerivative;
+  return 1.0 - smoothstep(-0.5, 0.5, distanceInPixels);
+}
+
+float fill_getLineAlpha(float position, float center, float period, float strokeWidth) {
+  float distanceToLine = abs(mod(position - center + period * 0.5, period) - period * 0.5);
+  return fill_getScreenSpaceAlpha(distanceToLine - strokeWidth * 0.5);
+}
+
+float fill_getHatchAlpha(float angle, float strokeWidth, vec2 gaps, bool alternating) {
+  vec2 lineDirection = vec2(cos(angle), sin(angle));
+  vec2 lineNormal = vec2(-lineDirection.y, lineDirection.x);
+  float period = alternating
+    ? strokeWidth * 2.0 + gaps.x + gaps.y
+    : strokeWidth + gaps.x;
+  float offset = dot(fill_patternPlacement.xy, lineNormal);
+  float position = fill_getPatternCoordinate(lineNormal, period, offset);
+  float alpha = fill_getLineAlpha(position, 0.0, period, strokeWidth);
+  if (alternating) {
+    alpha = max(
+      alpha,
+      fill_getLineAlpha(position, strokeWidth + gaps.x, period, strokeWidth)
+    );
+  }
+  return alpha;
+}
+
+float fill_getDotAlpha(float angle, float skew, float radius, float gap) {
+  vec2 axis0 = vec2(cos(angle), sin(angle));
+  float axis1Angle = angle + 1.5707963267948966 - skew;
+  vec2 axis1 = vec2(cos(axis1Angle), sin(axis1Angle));
+  float determinant = axis0.x * axis1.y - axis0.y * axis1.x;
+
+  // The reciprocal basis maps common coordinates into the skewed dot lattice.
+  vec2 reciprocal0 = vec2(axis1.y, -axis1.x) / determinant;
+  vec2 reciprocal1 = vec2(-axis0.y, axis0.x) / determinant;
+  float period = radius * 2.0 + gap;
+  vec2 latticeCoords = fill_getPatternCoords(
+    reciprocal0,
+    reciprocal1,
+    vec2(period),
+    fill_patternPlacement.xy
+  );
+  vec2 cellOffset = mod(latticeCoords + period * 0.5, period) - period * 0.5;
+  float distanceToDotSquared = 1.0e20;
+  // In a skewed lattice the closest dot is not necessarily in the independently wrapped cell.
+  // Include adjacent cells to keep the repeated distance field continuous at cell boundaries.
+  for (int x = -1; x <= 1; x++) {
+    for (int y = -1; y <= 1; y++) {
+      vec2 neighborOffset = cellOffset + vec2(float(x), float(y)) * period;
+      vec2 dotOffset = axis0 * neighborOffset.x + axis1 * neighborOffset.y;
+      distanceToDotSquared = min(distanceToDotSquared, dot(dotOffset, dotOffset));
+    }
+  }
+  float distanceToDot = sqrt(distanceToDotSquared);
+  return fill_getScreenSpaceAlpha(distanceToDot - radius);
+}
+
+float fill_getProceduralPatternAlpha() {
+  float patternType = fill_patternParams0.x;
+  float size = fill_patternParams0.y;
+  vec2 gaps = fill_patternParams0.zw;
+  vec2 angles = fill_patternParams1.xy;
+  float elementCount = fill_patternParams1.z;
+
+  if (patternType == FILL_PATTERN_HATCH) {
+    return fill_getHatchAlpha(angles.x, size, gaps, elementCount == 2.0);
+  }
+  if (patternType == FILL_PATTERN_CROSS_HATCH) {
+    return max(
+      fill_getHatchAlpha(angles.x, size, gaps, false),
+      fill_getHatchAlpha(angles.y, size, gaps, false)
+    );
+  }
+  if (patternType == FILL_PATTERN_DOTS) {
+    return fill_getDotAlpha(angles.x, angles.y, size, gaps.x);
+  }
+  return 1.0;
+}
+
+// Draw the pattern over the background fill (Porter-Duff source-over)
+vec4 fill_blendOverBackground(vec4 pattern, vec4 background) {
+  if (background.a == 0.0 || layer.opacity == 0.0) return pattern;
+  float patternAlpha = pattern.a / layer.opacity;
+  float blendedAlpha = patternAlpha + background.a * (1.0 - patternAlpha);
+  vec3 blendedRGB = mix(background.rgb, pattern.rgb, patternAlpha / blendedAlpha);
+  return vec4(blendedRGB, blendedAlpha * layer.opacity);
+}
 `
 );
-var fs3 = `
+var fs4 = `
 ${uniformBlock3}
 ${patternFs}
 `;
 var inject3 = {
   "vs:DECKGL_FILTER_GL_POSITION": (
-    /* glsl */
-    `
-    fill_uv = geometry.position.xy;
-  `
-  ),
-  "vs:DECKGL_FILTER_COLOR": (
     /* glsl */
     `
     if (fill.patternEnabled) {
-      fill_patternBounds = fillPatternFrames / vec4(fill.patternTextureSize, fill.patternTextureSize);
       fill_patternPlacement.xy = fillPatternOffsets;
-      fill_patternPlacement.zw = fillPatternScales * fillPatternFrames.zw;
+      fill_backgroundColor = fillPatternBackgroundColors;
+      if (fill.procedural) {
+        fill_uv = geometry.position.xy;
+        fill_patternCoordinateScale = fill.patternUnitScale * fillPatternScales;
+        int texelIndex = int(fillPatternFrames.x) * 4;
+        fill_patternParams0 = vec4(
+          texelFetch(fill_patternTexture, ivec2(texelIndex, 0), 0).rg,
+          texelFetch(fill_patternTexture, ivec2(texelIndex + 1, 0), 0).rg
+        );
+        fill_patternParams1 = vec4(
+          texelFetch(fill_patternTexture, ivec2(texelIndex + 2, 0), 0).rg,
+          texelFetch(fill_patternTexture, ivec2(texelIndex + 3, 0), 0).rg
+        );
+      } else {
+        fill_patternBounds = fillPatternFrames / vec4(fill.patternTextureSize, fill.patternTextureSize);
+        vec2 patternFrameCommon = fill.patternUnitScale * fillPatternScales * fillPatternFrames.zw;
+        // Reduce the coordinate origin to within one tile before adding the vertex position. The
+        // origin is large in common space, and fp32 cannot carry the sum at full precision.
+        vec2 origin = mod(fill.uvCoordinateOrigin, patternFrameCommon) + fill.uvCoordinateOrigin64Low;
+        fill_uv = (origin + geometry.position.xy) / patternFrameCommon;
+        // Pattern atlases use top-left coordinates, so reverse common-space Y in bottom-left views.
+        fill_uv.y *= fill.flipY ? 1.0 : -1.0;
+        fill_uv += fillPatternOffsets;
+      }
     }
   `
   ),
@@ -1515,22 +4591,31 @@ var inject3 = {
     /* glsl */
     `
     if (fill.patternEnabled) {
-      vec2 scale = FILL_UV_SCALE * fill_patternPlacement.zw;
-      vec2 patternUV = mod(mod(fill.uvCoordinateOrigin, scale) + fill.uvCoordinateOrigin64Low + fill_uv, scale) / scale;
-      patternUV = mod(fill_patternPlacement.xy + patternUV, 1.0);
+      if (fill.procedural) {
+        color.a *= fill_getProceduralPatternAlpha();
+      } else {
+        vec2 patternUV = fract(fill_uv);
+        vec2 texCoords = fill_patternBounds.xy + fill_patternBounds.zw * patternUV;
 
-      vec2 texCoords = fill_patternBounds.xy + fill_patternBounds.zw * patternUV;
+        // Tiling is emulated by wrapping the coordinate, so texCoords jumps from the end of the
+        // frame back to its start once per tile, leading to the wrong mip level being selected,
+        // which leads to artifacts at pattern edges. fill_uv is continuous across the primitive,
+        // meaning that the correct mip level is always selected
+        vec4 grad = fill_patternBounds.zwzw * vec4(dFdx(fill_uv), dFdy(fill_uv));
+        vec4 patternColor = textureGrad(fill_patternTexture, texCoords, grad.xy, grad.zw);
 
-      vec4 patternColor = texture(fill_patternTexture, texCoords);
-      color.a *= patternColor.a;
-      if (!fill.patternMask) {
-        color.rgb = patternColor.rgb;
+        color.a *= patternColor.a;
+        if (!fill.patternMask) {
+          color.rgb = patternColor.rgb;
+        }
       }
+      color = fill_blendOverBackground(color, fill_backgroundColor);
     }
   `
   )
 };
 function getPatternUniforms(opts) {
+  var _a;
   if (!opts) {
     return {};
   }
@@ -1541,54 +4626,200 @@ function getPatternUniforms(opts) {
     uniforms.patternTextureSize = [fillPatternTexture.width, fillPatternTexture.height];
   }
   if ("project" in opts) {
-    const { fillPatternMask = true, fillPatternEnabled = true } = opts;
-    const projectUniforms = import_core8.project.getUniforms(opts.project);
+    const { fillPatternMask = true, fillPatternEnabled = true, fillPatternSizeUnits = "meters", fillPatternCommonFrame = null, procedural = false } = opts;
+    const projectUniforms = project_default.getUniforms(opts.project);
     const { commonOrigin: coordinateOriginCommon } = projectUniforms;
-    const coordinateOriginCommon64Low = [
-      (0, import_core8.fp64LowPart)(coordinateOriginCommon[0]),
-      (0, import_core8.fp64LowPart)(coordinateOriginCommon[1])
-    ];
-    uniforms.uvCoordinateOrigin = coordinateOriginCommon.slice(0, 2);
-    uniforms.uvCoordinateOrigin64Low = coordinateOriginCommon64Low;
+    const unitScale = getPatternUnitScale(fillPatternSizeUnits, opts.project.viewport);
+    const origin = [coordinateOriginCommon[0], coordinateOriginCommon[1]];
+    if (fillPatternCommonFrame) {
+      origin[0] %= unitScale * fillPatternCommonFrame[0];
+      origin[1] %= unitScale * fillPatternCommonFrame[1];
+    }
+    uniforms.uvCoordinateOrigin = origin;
+    uniforms.uvCoordinateOrigin64Low = [fp64LowPart(origin[0]), fp64LowPart(origin[1])];
+    uniforms.patternUnitScale = unitScale;
     uniforms.patternMask = fillPatternMask;
     uniforms.patternEnabled = fillPatternEnabled;
+    uniforms.procedural = procedural;
+    uniforms.flipY = ((_a = opts.project.viewport) == null ? void 0 : _a.flipY) ?? false;
   }
   return uniforms;
 }
 var patternShaders = {
   name: "fill",
-  vs: vs3,
-  fs: fs3,
+  vs: vs4,
+  fs: fs4,
   inject: inject3,
-  dependencies: [import_core8.project],
+  dependencies: [project_default],
   getUniforms: getPatternUniforms,
   uniformTypes: {
     patternTextureSize: "vec2<f32>",
+    patternUnitScale: "f32",
     patternEnabled: "i32",
     patternMask: "i32",
+    procedural: "i32",
+    flipY: "i32",
     uvCoordinateOrigin: "vec2<f32>",
     uvCoordinateOrigin64Low: "vec2<f32>"
   }
 };
 
+// dist/fill-style/procedural-pattern.js
+var PROCEDURAL_PATTERN_TEXTURE_FORMAT = "rg32float";
+var PROCEDURAL_PATTERN_COMPONENTS_PER_TEXEL = 2;
+var PROCEDURAL_PATTERN_TEXELS_PER_PATTERN = 4;
+var PROCEDURAL_PATTERN_TYPES = {
+  none: 0,
+  hatch: 1,
+  crossHatch: 2,
+  dots: 3
+};
+var PROCEDURAL_PATTERN_OFFSETS = {
+  type: 0,
+  size: 1,
+  gap0: 2,
+  gap1: 3,
+  angle0: 4,
+  angle1: 5,
+  /** Number of alternating gaps, hatch directions, or dot-grid axes, depending on type. */
+  elementCount: 6
+};
+var COMPONENTS_PER_PATTERN = PROCEDURAL_PATTERN_COMPONENTS_PER_TEXEL * PROCEDURAL_PATTERN_TEXELS_PER_PATTERN;
+var DEGREES_TO_RADIANS3 = Math.PI / 180;
+var DEFAULT_SIZE = 1;
+var DEFAULT_GAP = 1;
+var DEFAULT_HATCH_ANGLE = 0;
+var DEFAULT_CROSS_HATCH_ANGLES = [45, 135];
+var DEFAULT_DOT_ANGLE = 0;
+var DEFAULT_DOT_SKEW = 0;
+function packProceduralPatterns(mapping) {
+  const entries = Object.entries(mapping);
+  const data = new Float32Array((entries.length + 1) * COMPONENTS_PER_PATTERN);
+  const patternIndices = /* @__PURE__ */ new Map();
+  entries.forEach(([id, config], entryIndex) => {
+    const patternIndex = entryIndex + 1;
+    const offset = patternIndex * COMPONENTS_PER_PATTERN;
+    patternIndices.set(id, patternIndex);
+    switch (config.type) {
+      case "hatch": {
+        const gap = config.gap === void 0 ? DEFAULT_GAP : config.gap;
+        const strokeWidth = config.strokeWidth === void 0 ? DEFAULT_SIZE : config.strokeWidth;
+        const angle = config.angle === void 0 ? DEFAULT_HATCH_ANGLE : config.angle;
+        if (Array.isArray(gap) && gap.length !== 2) {
+          throw new Error(`${id}.gap must be a number or a two-element array`);
+        }
+        const gaps = Array.isArray(gap) ? gap : [gap, gap];
+        validatePositive(strokeWidth, `${id}.strokeWidth`);
+        validateNonNegative(gaps[0], `${id}.gap[0]`);
+        validateNonNegative(gaps[1], `${id}.gap[1]`);
+        validateAngle(angle, `${id}.angle`);
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.type] = PROCEDURAL_PATTERN_TYPES.hatch;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.size] = strokeWidth;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap0] = gaps[0];
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap1] = gaps[1];
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.angle0] = angle * DEGREES_TO_RADIANS3;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.elementCount] = Array.isArray(gap) ? 2 : 1;
+        break;
+      }
+      case "cross-hatch": {
+        const angles = config.angles === void 0 ? DEFAULT_CROSS_HATCH_ANGLES : config.angles;
+        const strokeWidth = config.strokeWidth === void 0 ? DEFAULT_SIZE : config.strokeWidth;
+        const gap = config.gap === void 0 ? DEFAULT_GAP : config.gap;
+        if (!Array.isArray(angles) || angles.length !== 2) {
+          throw new Error(`${id}.angles must be a two-element array`);
+        }
+        validatePositive(strokeWidth, `${id}.strokeWidth`);
+        validateNonNegative(gap, `${id}.gap`);
+        validateAngle(angles[0], `${id}.angles[0]`);
+        validateAngle(angles[1], `${id}.angles[1]`);
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.type] = PROCEDURAL_PATTERN_TYPES.crossHatch;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.size] = strokeWidth;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap0] = gap;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap1] = gap;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.angle0] = angles[0] * DEGREES_TO_RADIANS3;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.angle1] = angles[1] * DEGREES_TO_RADIANS3;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.elementCount] = 2;
+        break;
+      }
+      case "dots": {
+        const radius = config.radius === void 0 ? DEFAULT_SIZE : config.radius;
+        const gap = config.gap === void 0 ? DEFAULT_GAP : config.gap;
+        const angle = config.angle === void 0 ? DEFAULT_DOT_ANGLE : config.angle;
+        const skew = config.skew === void 0 ? DEFAULT_DOT_SKEW : config.skew;
+        validatePositive(radius, `${id}.radius`);
+        validateNonNegative(gap, `${id}.gap`);
+        validateAngle(angle, `${id}.angle`);
+        validateSkew(skew, `${id}.skew`);
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.type] = PROCEDURAL_PATTERN_TYPES.dots;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.size] = radius;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap0] = gap;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.gap1] = gap;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.angle0] = angle * DEGREES_TO_RADIANS3;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.angle1] = skew * DEGREES_TO_RADIANS3;
+        data[offset + PROCEDURAL_PATTERN_OFFSETS.elementCount] = 2;
+        break;
+      }
+      default:
+        throw new Error(`${id}.type is not a supported procedural pattern type`);
+    }
+  });
+  return {
+    data,
+    width: data.length / PROCEDURAL_PATTERN_COMPONENTS_PER_TEXEL,
+    height: 1,
+    patternIndices
+  };
+}
+function validatePositive(value, name) {
+  if (!Number.isFinite(value) || value <= 0) {
+    throw new Error(`${name} must be a finite number greater than 0`);
+  }
+}
+function validateNonNegative(value, name) {
+  if (!Number.isFinite(value) || value < 0) {
+    throw new Error(`${name} must be a finite number greater than or equal to 0`);
+  }
+}
+function validateAngle(value, name) {
+  if (!Number.isFinite(value)) {
+    throw new Error(`${name} must be a finite number`);
+  }
+}
+function validateSkew(value, name) {
+  if (!Number.isFinite(value) || value <= -90 || value >= 90) {
+    throw new Error(`${name} must be a finite number greater than -90 and less than 90`);
+  }
+}
+
 // dist/fill-style/fill-style-extension.js
+function leastCommonMultiple(a, b) {
+  if (!Number.isInteger(b) || b <= 0)
+    return 0;
+  if (a === 0)
+    return b;
+  let [x, y] = [a, b];
+  while (y > 0)
+    [x, y] = [y, x % y];
+  return a / x * b;
+}
 var defaultProps4 = {
   fillPatternEnabled: true,
   fillPatternAtlas: {
     type: "image",
     value: null,
-    async: true,
-    parameters: { lodMaxClamp: 0 }
+    async: true
   },
   fillPatternMapping: { type: "object", value: {}, async: true },
   fillPatternMask: true,
+  fillPatternSizeUnits: "meters",
   getFillPattern: { type: "accessor", value: (d) => d.pattern },
   getFillPatternScale: { type: "accessor", value: 1 },
-  getFillPatternOffset: { type: "accessor", value: [0, 0] }
+  getFillPatternOffset: { type: "accessor", value: [0, 0] },
+  getFillPatternBackgroundColor: { type: "accessor", value: [0, 0, 0, 0] }
 };
-var FillStyleExtension = class extends import_core9.LayerExtension {
-  constructor({ pattern = false } = {}) {
-    super({ pattern });
+var FillStyleExtension = class extends LayerExtension {
+  constructor({ pattern = false, proceduralPattern = false } = {}) {
+    super({ pattern: pattern || proceduralPattern, proceduralPattern });
   }
   isEnabled(layer) {
     return layer.getAttributeManager() !== null && !("pathTesselator" in layer.state);
@@ -1612,7 +4843,7 @@ var FillStyleExtension = class extends import_core9.LayerExtension {
           size: 4,
           stepMode: "dynamic",
           accessor: "getFillPattern",
-          transform: extension.getPatternFrame.bind(this)
+          transform: extension.opts.proceduralPattern ? extension.getProceduralPatternIndex.bind(this) : extension.getPatternFrame.bind(this)
         },
         fillPatternScales: {
           size: 1,
@@ -1624,6 +4855,13 @@ var FillStyleExtension = class extends import_core9.LayerExtension {
           size: 2,
           stepMode: "dynamic",
           accessor: "getFillPatternOffset"
+        },
+        fillPatternBackgroundColors: {
+          size: 4,
+          type: "unorm8",
+          stepMode: "dynamic",
+          accessor: "getFillPatternBackgroundColor",
+          defaultValue: [0, 0, 0, 255]
         }
       });
     }
@@ -1632,7 +4870,8 @@ var FillStyleExtension = class extends import_core9.LayerExtension {
         data: new Uint8Array(4),
         width: 1,
         height: 1
-      })
+      }),
+      ...extension.opts.proceduralPattern && extension.createProceduralPatternTexture.call(this, {})
     });
   }
   updateState({ props, oldProps }, extension) {
@@ -1640,30 +4879,81 @@ var FillStyleExtension = class extends import_core9.LayerExtension {
       return;
     }
     if (props.fillPatternMapping && props.fillPatternMapping !== oldProps.fillPatternMapping) {
+      if (extension.opts.proceduralPattern && typeof props.fillPatternMapping !== "string") {
+        const oldTexture = this.state.proceduralPatternTexture;
+        this.setState(extension.createProceduralPatternTexture.call(this, props.fillPatternMapping));
+        oldTexture == null ? void 0 : oldTexture.delete();
+      }
       this.getAttributeManager().invalidate("getFillPattern");
     }
+    if (props.fillPatternMapping !== oldProps.fillPatternMapping || props.getFillPatternScale !== oldProps.getFillPatternScale) {
+      this.setState({ commonFrame: extension.getCommonFrame(props) });
+    }
   }
   draw(params, extension) {
     if (!extension.isEnabled(this)) {
       return;
     }
-    const { fillPatternAtlas, fillPatternEnabled, fillPatternMask } = this.props;
+    const { fillPatternAtlas, fillPatternEnabled, fillPatternMask, fillPatternSizeUnits } = this.props;
     const fillProps = {
       project: params.shaderModuleProps.project,
       fillPatternEnabled,
       fillPatternMask,
-      fillPatternTexture: fillPatternAtlas || this.state.emptyTexture
+      fillPatternSizeUnits,
+      procedural: extension.opts.proceduralPattern,
+      fillPatternTexture: extension.opts.proceduralPattern ? this.state.proceduralPatternTexture || this.state.emptyTexture : fillPatternAtlas || this.state.emptyTexture,
+      fillPatternCommonFrame: this.state.commonFrame
     };
     this.setShaderModuleProps({ fill: fillProps });
   }
   finalizeState() {
     const emptyTexture = this.state.emptyTexture;
     emptyTexture == null ? void 0 : emptyTexture.delete();
+    const proceduralPatternTexture = this.state.proceduralPatternTexture;
+    proceduralPatternTexture == null ? void 0 : proceduralPatternTexture.delete();
   }
   getPatternFrame(name) {
     const { fillPatternMapping } = this.getCurrentLayer().props;
     const def = fillPatternMapping && fillPatternMapping[name];
-    return def ? [def.x, def.y, def.width, def.height] : [0, 0, 0, 0];
+    return def && "x" in def ? [def.x, def.y, def.width, def.height] : [0, 0, 0, 0];
+  }
+  /**
+   * Returns common frame into which all patterns fit as integer multiples
+   */
+  getCommonFrame(props) {
+    const { fillPatternMapping, getFillPatternScale: scale } = props;
+    if (typeof scale !== "number" || !(scale > 0) || typeof fillPatternMapping !== "object") {
+      return null;
+    }
+    let width = 0;
+    let height = 0;
+    for (const name in fillPatternMapping) {
+      const frame = fillPatternMapping[name];
+      if (!("width" in frame))
+        return null;
+      width = leastCommonMultiple(width, frame.width);
+      height = leastCommonMultiple(height, frame.height);
+      if (!width || !height)
+        return null;
+    }
+    return width ? [scale * width, scale * height] : null;
+  }
+  getProceduralPatternIndex(name) {
+    const patternIndices = this.state.proceduralPatternIndices;
+    return [(patternIndices == null ? void 0 : patternIndices.get(name)) ?? 0, 0, 0, 0];
+  }
+  createProceduralPatternTexture(mapping) {
+    const packedPatterns = packProceduralPatterns(mapping);
+    return {
+      proceduralPatternIndices: packedPatterns.patternIndices,
+      proceduralPatternTexture: this.context.device.createTexture({
+        data: packedPatterns.data,
+        width: packedPatterns.width,
+        height: packedPatterns.height,
+        format: PROCEDURAL_PATTERN_TEXTURE_FORMAT,
+        sampler: { minFilter: "nearest", magFilter: "nearest" }
+      })
+    };
   }
 };
 FillStyleExtension.defaultProps = defaultProps4;
@@ -1671,7 +4961,6 @@ FillStyleExtension.extensionName = "FillStyleExtension";
 var fill_style_extension_default = FillStyleExtension;
 
 // dist/clip/clip-extension.js
-var import_core10 = require("@deck.gl/core");
 var defaultProps5 = {
   clipBounds: [0, 0, 1, 1],
   clipByInstance: void 0
@@ -1754,13 +5043,16 @@ in vec2 clip_commonPosition;
 `
   )
 };
-var ClipExtension = class extends import_core10.LayerExtension {
+var ClipExtension = class extends LayerExtension {
   getShaders() {
     let clipByInstance = "instancePositions" in this.getAttributeManager().attributes;
     if (this.props.clipByInstance !== void 0) {
       clipByInstance = Boolean(this.props.clipByInstance);
     }
     this.state.clipByInstance = clipByInstance;
+    if (this.context.device.type === "webgpu") {
+      return {};
+    }
     return clipByInstance ? {
       modules: [shaderModuleVs],
       inject: injectionVs
@@ -1785,6 +5077,10 @@ var ClipExtension = class extends import_core10.LayerExtension {
         Math.max(corner0[1], corner1[1])
       ];
     }
+    if (this.context.device.type === "webgpu") {
+      clipProps.enabled = true;
+      clipProps.mode = this.state.clipByInstance ? "instance" : "geometry";
+    }
     this.setShaderModuleProps({ clip: clipProps });
   }
 };
@@ -1792,12 +5088,8 @@ ClipExtension.defaultProps = defaultProps5;
 ClipExtension.extensionName = "ClipExtension";
 var clip_extension_default = ClipExtension;
 
-// dist/collision-filter/collision-filter-extension.js
-var import_core15 = require("@deck.gl/core");
-
 // dist/collision-filter/shader-module.js
-var import_core11 = require("@deck.gl/core");
-var vs4 = (
+var vs5 = (
   /* glsl */
   `
 in float collisionPriorities;
@@ -1895,8 +5187,8 @@ var getCollisionUniforms = (opts) => {
 };
 var shader_module_default2 = {
   name: "collision",
-  dependencies: [import_core11.project],
-  vs: vs4,
+  dependencies: [project_default],
+  vs: vs5,
   inject: inject4,
   getUniforms: getCollisionUniforms,
   uniformTypes: {
@@ -1906,12 +5198,10 @@ var shader_module_default2 = {
 };
 
 // dist/collision-filter/collision-filter-effect.js
-var import_core13 = require("@math.gl/core");
-var import_core14 = require("@deck.gl/core");
+var import_core19 = require("@math.gl/core");
 
 // dist/collision-filter/collision-filter-pass.js
-var import_core12 = require("@deck.gl/core");
-var CollisionFilterPass = class extends import_core12._LayersPass {
+var CollisionFilterPass = class extends LayersPass {
   renderCollisionMap(target, options) {
     const padding = 1;
     const clearColor = [0, 0, 0, 0];
@@ -2002,8 +5292,8 @@ var CollisionFilterEffect = class {
     }
     const needsRender = viewportChanged || // If render info is new
     renderInfo === oldRenderInfo || // If sublayers have changed
-    !(0, import_core14._deepEqual)(oldRenderInfo.layers, renderInfo.layers, 1) || // If a sublayer's bounds have been updated
-    renderInfo.layerBounds.some((b, i) => !(0, import_core13.equals)(b, oldRenderInfo.layerBounds[i])) || // If a sublayer's isLoaded state has been updated
+    !deepEqual(oldRenderInfo.layers, renderInfo.layers, 1) || // If a sublayer's bounds have been updated
+    renderInfo.layerBounds.some((b, i) => !(0, import_core19.equals)(b, oldRenderInfo.layerBounds[i])) || // If a sublayer's isLoaded state has been updated
     renderInfo.allLayersLoaded !== oldRenderInfo.allLayersLoaded || // Some prop is in transition
     renderInfo.layers.some((layer) => layer.props.transitions);
     this.channels[collisionGroup] = renderInfo;
@@ -2135,7 +5425,7 @@ var defaultProps6 = {
   collisionGroup: { type: "string", value: "default" },
   collisionTestProps: {}
 };
-var CollisionFilterExtension = class extends import_core15.LayerExtension {
+var CollisionFilterExtension = class extends LayerExtension {
   getShaders() {
     return { modules: [shader_module_default2] };
   }
@@ -2169,11 +5459,7 @@ CollisionFilterExtension.defaultProps = defaultProps6;
 CollisionFilterExtension.extensionName = "CollisionFilterExtension";
 var collision_filter_extension_default = CollisionFilterExtension;
 
-// dist/mask/mask-extension.js
-var import_core21 = require("@deck.gl/core");
-
 // dist/mask/shader-module.js
-var import_core16 = require("@deck.gl/core");
 var uniformBlock4 = (
   /* glsl */
   `layout(std140) uniform maskUniforms {
@@ -2193,7 +5479,7 @@ vec2 mask_getCoords(vec4 position) {
 }
 `
 );
-var vs5 = `
+var vs6 = `
 ${uniformBlock4}
 ${vertex3}
 `;
@@ -2226,7 +5512,7 @@ bool mask_isInBounds(vec2 texCoords) {
 }
 `
 );
-var fs4 = `
+var fs5 = `
 ${uniformBlock4}
 ${fragment3}
 `;
@@ -2280,9 +5566,9 @@ var getMaskUniforms = (opts) => {
 };
 var shader_module_default3 = {
   name: "mask",
-  dependencies: [import_core16.project],
-  vs: vs5,
-  fs: fs4,
+  dependencies: [project_default],
+  vs: vs6,
+  fs: fs5,
   inject: inject5,
   getUniforms: getMaskUniforms,
   uniformTypes: {
@@ -2295,11 +5581,9 @@ var shader_module_default3 = {
 };
 
 // dist/mask/mask-effect.js
-var import_core19 = require("@deck.gl/core");
-var import_core20 = require("@math.gl/core");
+var import_core26 = require("@math.gl/core");
 
 // dist/mask/mask-pass.js
-var import_core17 = require("@deck.gl/core");
 var MASK_BLENDING = {
   blendColorOperation: "subtract",
   blendColorSrcFactor: "zero",
@@ -2308,7 +5592,7 @@ var MASK_BLENDING = {
   blendAlphaSrcFactor: "zero",
   blendAlphaDstFactor: "one"
 };
-var MaskPass = class extends import_core17._LayersPass {
+var MaskPass = class extends LayersPass {
   constructor(device, props) {
     super(device, props);
     const { mapSize = 2048 } = props;
@@ -2353,8 +5637,7 @@ var MaskPass = class extends import_core17._LayersPass {
 };
 
 // dist/utils/projection-utils.js
-var import_core18 = require("@deck.gl/core");
-var MERCATOR_REFERENCE_VIEWPORT = new import_core18.WebMercatorViewport({
+var MERCATOR_REFERENCE_VIEWPORT = new WebMercatorViewport({
   width: 1,
   height: 1,
   longitude: 0,
@@ -2416,7 +5699,7 @@ function makeViewport(opts) {
       zoom += Math.log2(r);
     }
   }
-  return isGeospatial ? new import_core18.WebMercatorViewport({
+  return isGeospatial ? new WebMercatorViewport({
     id: viewport.id,
     x: border,
     y: border,
@@ -2426,7 +5709,7 @@ function makeViewport(opts) {
     latitude: centerWorld[1],
     zoom,
     orthographic: true
-  }) : new import_core18.OrthographicViewport({
+  }) : new OrthographicViewport({
     id: viewport.id,
     x: border,
     y: border,
@@ -2519,7 +5802,7 @@ var MaskEffect = class {
     const viewport = viewports[0];
     const viewportChanged = !this.lastViewport || !this.lastViewport.equals(viewport);
     if (viewport.resolution !== void 0) {
-      import_core19.log.warn("MaskExtension is not supported in GlobeView")();
+      log_default.warn("MaskExtension is not supported in GlobeView")();
       return { didRender };
     }
     for (const maskId in channelMap) {
@@ -2562,7 +5845,7 @@ var MaskEffect = class {
       this.lastViewport = viewport;
       const layerBounds = joinLayerBounds(channelInfo.layers, viewport);
       channelInfo.bounds = layerBounds && getRenderBounds(layerBounds, viewport);
-      if (maskChanged || !(0, import_core20.equals)(channelInfo.bounds, oldChannelInfo.bounds)) {
+      if (maskChanged || !(0, import_core26.equals)(channelInfo.bounds, oldChannelInfo.bounds)) {
         const { maskPass, maskMap } = this;
         const maskViewport = layerBounds && makeViewport({
           bounds: channelInfo.bounds,
@@ -2613,7 +5896,7 @@ var MaskEffect = class {
       let channelInfo = channelMap[id];
       if (!channelInfo) {
         if (++channelCount > 4) {
-          import_core19.log.warn("Too many mask layers. The max supported is 4")();
+          log_default.warn("Too many mask layers. The max supported is 4")();
           continue;
         }
         channelInfo = {
@@ -2674,7 +5957,7 @@ var defaultProps7 = {
   maskByInstance: void 0,
   maskInverted: false
 };
-var MaskExtension = class extends import_core21.LayerExtension {
+var MaskExtension = class extends LayerExtension {
   initializeState() {
     var _a;
     (_a = this.context.deck) == null ? void 0 : _a._addDefaultEffect(new MaskEffect());
@@ -2702,8 +5985,8 @@ var MaskExtension = class extends import_core21.LayerExtension {
       maskProps.enabled = true;
       maskProps.channel = index;
       maskProps.inverted = maskInverted;
-      if (fromCoordinateSystem === import_core21.COORDINATE_SYSTEM.DEFAULT) {
-        fromCoordinateSystem = viewport.isGeospatial ? import_core21.COORDINATE_SYSTEM.LNGLAT : import_core21.COORDINATE_SYSTEM.CARTESIAN;
+      if (fromCoordinateSystem === COORDINATE_SYSTEM.DEFAULT) {
+        fromCoordinateSystem = viewport.isGeospatial ? COORDINATE_SYSTEM.LNGLAT : COORDINATE_SYSTEM.CARTESIAN;
       }
       const opts = { modelMatrix: null, fromCoordinateOrigin, fromCoordinateSystem };
       const bl = this.projectPosition([bounds[0], bounds[1], 0], opts);
@@ -2711,7 +5994,7 @@ var MaskExtension = class extends import_core21.LayerExtension {
       maskProps.bounds = [bl[0], bl[1], tr[0], tr[1]];
     } else {
       if (maskId) {
-        import_core21.log.warn(`Could not find a mask layer with id: ${maskId}`)();
+        log_default.warn(`Could not find a mask layer with id: ${maskId}`)();
       }
       maskProps.enabled = false;
     }
@@ -2722,14 +6005,7 @@ MaskExtension.defaultProps = defaultProps7;
 MaskExtension.extensionName = "MaskExtension";
 var mask_extension_default = MaskExtension;
 
-// dist/terrain/terrain-extension.js
-var import_core28 = require("@deck.gl/core");
-
-// dist/terrain/terrain-effect.js
-var import_core27 = require("@deck.gl/core");
-
 // dist/terrain/shader-module.js
-var import_core22 = require("@deck.gl/core");
 var TERRAIN_MODE = {
   NONE: 0,
   /** A terrain layer rendering encoded ground elevation into the height map */
@@ -2758,7 +6034,7 @@ uniform sampler2D terrain_map;
 );
 var terrainModule = {
   name: "terrain",
-  dependencies: [import_core22.project],
+  dependencies: [project_default],
   vs: `${uniformBlock5}
 out vec3 commonPos;
 // In globe mode, absolute Mercator position for terrain FBO UV lookups
@@ -2856,7 +6132,7 @@ if ((terrain.mode == TERRAIN_MODE_USE_COVER) || (terrain.mode == TERRAIN_MODE_US
     }
     if ("terrainSkipRender" in opts || "drawToTerrainHeightMap" in opts) {
       const { drawToTerrainHeightMap, heightMap, heightMapBounds, dummyHeightMap, terrainCover, useTerrainHeightMap, terrainSkipRender } = opts;
-      const projectUniforms = import_core22.project.getUniforms(opts.project);
+      const projectUniforms = project_default.getUniforms(opts.project);
       const { commonOrigin } = projectUniforms;
       let mode = terrainSkipRender ? TERRAIN_MODE.SKIP : TERRAIN_MODE.NONE;
       let sampler = dummyHeightMap;
@@ -2906,11 +6182,7 @@ if ((terrain.mode == TERRAIN_MODE_USE_COVER) || (terrain.mode == TERRAIN_MODE_US
   }
 };
 
-// dist/terrain/terrain-cover.js
-var import_core23 = require("@deck.gl/core");
-
 // dist/terrain/utils.js
-var import_constants = require("@luma.gl/webgl/constants");
 function createRenderTarget(device, opts) {
   return device.createFramebuffer({
     id: opts.id,
@@ -3024,7 +6296,7 @@ var TerrainCover = class {
     } else {
       const oldZoom = (_a = this.renderViewport) == null ? void 0 : _a.zoom;
       shouldRedraw = shouldRedraw || newZoom !== oldZoom;
-      const newBounds = viewport instanceof import_core23._GlobeViewport ? this.targetBoundsCommon : getRenderBounds(this.targetBoundsCommon, viewport);
+      const newBounds = viewport instanceof GlobeViewport ? this.targetBoundsCommon : getRenderBounds(this.targetBoundsCommon, viewport);
       const oldBounds = this.bounds;
       shouldRedraw = shouldRedraw || !oldBounds || newBounds.some((x, i) => x !== oldBounds[i]);
       this.bounds = newBounds;
@@ -3101,7 +6373,6 @@ function intersect(b1, b2) {
 }
 
 // dist/terrain/terrain-pass.js
-var import_core24 = require("@deck.gl/core");
 var TERRAIN_BLENDING = {
   blendColorOperation: "max",
   blendColorSrcFactor: "one",
@@ -3110,7 +6381,7 @@ var TERRAIN_BLENDING = {
   blendAlphaSrcFactor: "one",
   blendAlphaDstFactor: "one"
 };
-var TerrainPass = class extends import_core24._LayersPass {
+var TerrainPass = class extends LayersPass {
   getRenderableLayers(viewport, opts) {
     const { layers } = opts;
     const result = [];
@@ -3175,8 +6446,7 @@ var TerrainPass = class extends import_core24._LayersPass {
 };
 
 // dist/terrain/terrain-picking-pass.js
-var import_core25 = require("@deck.gl/core");
-var TerrainPickingPass = class extends import_core25._PickLayersPass {
+var TerrainPickingPass = class extends PickLayersPass {
   constructor() {
     super(...arguments);
     this.drawParameters = {};
@@ -3247,7 +6517,6 @@ var TerrainPickingPass = class extends import_core25._PickLayersPass {
 };
 
 // dist/terrain/height-map-builder.js
-var import_core26 = require("@deck.gl/core");
 var MAP_MAX_SIZE = 2048;
 var HeightMapBuilder = class {
   static isSupported(device) {
@@ -3294,7 +6563,7 @@ var HeightMapBuilder = class {
     if (!this.layersBoundsCommon) {
       this.renderViewport = null;
     } else if (layersChanged || viewportChanged) {
-      const bounds = viewport instanceof import_core26._GlobeViewport ? this.layersBoundsCommon : getRenderBounds(this.layersBoundsCommon, viewport);
+      const bounds = viewport instanceof GlobeViewport ? this.layersBoundsCommon : getRenderBounds(this.layersBoundsCommon, viewport);
       if (bounds[2] <= bounds[0] || bounds[3] <= bounds[1]) {
         this.renderViewport = null;
         return false;
@@ -3352,7 +6621,7 @@ var TerrainEffect = class {
     if (HeightMapBuilder.isSupported(device)) {
       this.heightMap = new HeightMapBuilder(device);
     } else {
-      import_core27.log.warn("Terrain offset mode is not supported by this browser")();
+      log_default.warn("Terrain offset mode is not supported by this browser")();
     }
     deck._addDefaultShaderModule(terrainModule);
   }
@@ -3520,7 +6789,7 @@ var TerrainEffect = class {
 var defaultProps8 = {
   terrainDrawMode: void 0
 };
-var TerrainExtension = class extends import_core28.LayerExtension {
+var TerrainExtension = class extends LayerExtension {
   getShaders() {
     return {
       modules: [terrainModule]