@deck.gl/extensions 8.7.0-alpha.3 → 8.7.0-beta.1

package/dist/dist.dev.js

@@ -91,7 +91,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = "./bundle.js");
+/******/ 	return __webpack_require__(__webpack_require__.s = "./bundle.ts");
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -6295,7 +6295,7 @@ class MathArray extends _extendableBuiltin(Array) {
       string += (i > 0 ? ', ' : '') + Object(_lib_common__WEBPACK_IMPORTED_MODULE_0__["formatValue"])(this[i], opts);
     }
 
-    return `${opts.printTypes ? this.constructor.name : ''}[${string}]`;
+    return "".concat(opts.printTypes ? this.constructor.name : '', "[").concat(string, "]");
   }
 
   equals(array) {
@@ -6459,7 +6459,7 @@ class MathArray extends _extendableBuiltin(Array) {
 
   check() {
     if (_lib_common__WEBPACK_IMPORTED_MODULE_0__["config"].debug && !this.validate()) {
-      throw new Error(`math.gl: ${this.constructor.name} some fields set to invalid numbers'`);
+      throw new Error("math.gl: ".concat(this.constructor.name, " some fields set to invalid numbers'"));
     }
 
     return this;
@@ -6517,14 +6517,14 @@ class Matrix extends _math_array__WEBPACK_IMPORTED_MODULE_0__["default"] {
 
       for (let row = 0; row < this.RANK; ++row) {
         for (let col = 0; col < this.RANK; ++col) {
-          string += ` ${this[col * this.RANK + row]}`;
+          string += " ".concat(this[col * this.RANK + row]);
         }
       }
     } else {
       string += 'column-major:';
 
       for (let i = 0; i < this.ELEMENTS; ++i) {
-        string += ` ${this[i]}`;
+        string += " ".concat(this[i]);
       }
     }
 
@@ -7019,7 +7019,7 @@ class Euler extends _base_math_array__WEBPACK_IMPORTED_MODULE_0__["default"] {
   getQuaternion() {
     const q = new _quaternion__WEBPACK_IMPORTED_MODULE_3__["default"]();
 
-    switch (this[4]) {
+    switch (this[3]) {
       case Euler.XYZ:
         return q.rotateX(this[0]).rotateY(this[1]).rotateZ(this[2]);
 
@@ -8412,8 +8412,7 @@ class SphericalCoordinates {
     printTypes = false
   }) {
     const f = _lib_common__WEBPACK_IMPORTED_MODULE_0__["formatValue"];
-    return `${printTypes ? 'Spherical' : ''}\
-[rho:${f(this.radius)},theta:${f(this.theta)},phi:${f(this.phi)}]`;
+    return "".concat(printTypes ? 'Spherical' : '', "[rho:").concat(f(this.radius), ",theta:").concat(f(this.theta), ",phi:").concat(f(this.phi), "]");
   }
 
   equals(other) {
@@ -9060,7 +9059,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return assert; });
 function assert(condition, message) {
   if (!condition) {
-    throw new Error(`math.gl assertion ${message}`);
+    throw new Error("math.gl assertion ".concat(message));
   }
 }
 //# sourceMappingURL=assert.js.map
@@ -9125,7 +9124,7 @@ function formatValue(value, {
   precision = config.precision || 4
 } = {}) {
   value = round(value);
-  return `${parseFloat(value.toPrecision(precision))}`;
+  return "".concat(parseFloat(value.toPrecision(precision)));
 }
 function isArray(value) {
   return Array.isArray(value) || ArrayBuffer.isView(value) && !(value instanceof DataView);
@@ -9416,14 +9415,14 @@ function validateVector(v, length) {
 }
 function checkNumber(value) {
   if (!Number.isFinite(value)) {
-    throw new Error(`Invalid number ${value}`);
+    throw new Error("Invalid number ".concat(value));
   }
 
   return value;
 }
 function checkVector(v, length, callerName = '') {
   if (_common__WEBPACK_IMPORTED_MODULE_0__["config"].debug && !validateVector(v, length)) {
-    throw new Error(`math.gl: ${callerName} some fields set to invalid numbers'`);
+    throw new Error("math.gl: ".concat(callerName, " some fields set to invalid numbers'"));
   }
 
   return v;
@@ -9432,7 +9431,7 @@ const map = {};
 function deprecated(method, version) {
   if (!map[method]) {
     map[method] = true;
-    console.warn(`${method} has been removed in version ${version}, see upgrade guide for more information`);
+    console.warn("".concat(method, " has been removed in version ").concat(version, ", see upgrade guide for more information"));
   }
 }
 //# sourceMappingURL=validators.js.map
@@ -15216,27 +15215,23 @@ var forEach = function () {
 
 /***/ }),
 
-/***/ "./bundle.js":
+/***/ "./bundle.ts":
 /*!*******************!*\
-  !*** ./bundle.js ***!
+  !*** ./bundle.ts ***!
   \*******************/
 /*! no static exports found */
 /***/ (function(module, exports, __webpack_require__) {
 
-const Extensions = __webpack_require__(/*! ./src */ "./src/index.js");
+const Extensions = __webpack_require__(/*! ./src */ "./src/index.ts");
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {}; // Check if peer dependencies are included
 
-// Check if peer dependencies are included
 if (!deck.Layer) {
   throw new Error('@deck.gl/core is not found');
 }
 
 module.exports = Object.assign(deck, Extensions);
 
-
 /***/ }),
 
 /***/ "./src/brushing/brushing.js":
@@ -15273,16 +15268,15 @@ __webpack_require__.r(__webpack_exports__);
 // THE SOFTWARE.
 
 
-
-
 const defaultProps = {
-  getBrushingTarget: {type: 'accessor', value: [0, 0]},
-
+  getBrushingTarget: {
+    type: 'accessor',
+    value: [0, 0]
+  },
   brushingTarget: 'source',
   brushingEnabled: true,
   brushingRadius: 10000
 };
-
 class BrushingExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
   getShaders(extension) {
     return {
@@ -15292,6 +15286,7 @@ class BrushingExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Laye
 
   initializeState(context, extension) {
     const attributeManager = this.getAttributeManager();
+
     if (attributeManager) {
       attributeManager.add({
         brushingTargets: {
@@ -15310,13 +15305,14 @@ class BrushingExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Laye
           }
         }
       });
-    }
-
-    // Trigger redraw when mouse moves
+    } // Trigger redraw when mouse moves
     // TODO - expose this in a better way
+
+
     extension.onMouseMove = () => {
       this.getCurrentLayer().setNeedsRedraw();
     };
+
     if (this.context.deck) {
       this.context.deck.eventManager.on({
         pointermove: extension.onMouseMove,
@@ -15340,12 +15336,11 @@ class BrushingExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Laye
     attribute.value = new Float32Array(2);
     return;
   }
-}
 
+}
 BrushingExtension.extensionName = 'BrushingExtension';
 BrushingExtension.defaultProps = defaultProps;
 
-
 /***/ }),
 
 /***/ "./src/brushing/shader-module.js":
@@ -15379,7 +15374,6 @@ __webpack_require__.r(__webpack_exports__);
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-
 const vs = `
   uniform bool brushing_enabled;
   uniform int brushing_target;
@@ -15413,19 +15407,16 @@ const vs = `
     brushing_isVisible = float(visible);
   }
 `;
-
 const fs = `
   uniform bool brushing_enabled;
   varying float brushing_isVisible;
 `;
-
 const TARGET = {
   source: 0,
   target: 1,
   custom: 2,
   source_target: 3
 };
-
 const inject = {
   'vs:DECKGL_FILTER_GL_POSITION': `
     vec2 brushingTarget;
@@ -15452,14 +15443,12 @@ const inject = {
     }
     brushing_setVisible(visible);
   `,
-
   'fs:DECKGL_FILTER_COLOR': `
     if (brushing_enabled && brushing_isVisible < 0.5) {
       discard;
     }
   `
 };
-
 /* harmony default export */ __webpack_exports__["default"] = ({
   name: 'brushing',
   dependencies: [_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["project"]],
@@ -15470,6 +15459,7 @@ const inject = {
     if (!opts || !opts.viewport) {
       return {};
     }
+
     const {
       brushingEnabled = true,
       brushingRadius = 10000,
@@ -15478,19 +15468,14 @@ const inject = {
       viewport
     } = opts;
     return {
-      brushing_enabled: Boolean(
-        brushingEnabled && mousePosition && viewport.containsPixel(mousePosition)
-      ),
+      brushing_enabled: Boolean(brushingEnabled && mousePosition && viewport.containsPixel(mousePosition)),
       brushing_radius: brushingRadius,
       brushing_target: TARGET[brushingTarget] || 0,
-      brushing_mousePos: mousePosition
-        ? viewport.unproject([mousePosition.x - viewport.x, mousePosition.y - viewport.y])
-        : [0, 0]
+      brushing_mousePos: mousePosition ? viewport.unproject([mousePosition.x - viewport.x, mousePosition.y - viewport.y]) : [0, 0]
     };
   }
 });
 
-
 /***/ }),
 
 /***/ "./src/clip/clip.js":
@@ -15525,12 +15510,9 @@ __webpack_require__.r(__webpack_exports__);
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-
-
 const defaultProps = {
   clipBounds: [0, 0, 1, 1]
 };
-
 const shaderFunction = `
 uniform vec4 clip_bounds;
 
@@ -15538,16 +15520,15 @@ bool clip_isInBounds(vec2 position) {
   return position.x >= clip_bounds[0] && position.y >= clip_bounds[1] && position.x < clip_bounds[2] && position.y < clip_bounds[3];
 }
 `;
-
 /*
  * The vertex-shader version clips geometries by their anchor position
  * e.g. ScatterplotLayer - show if the center of a circle is within bounds
  */
+
 const shaderModuleVs = {
   name: 'clip-vs',
   vs: shaderFunction
 };
-
 const injectionVs = {
   'vs:#decl': `
 varying float clip_isVisible;
@@ -15562,16 +15543,15 @@ varying float clip_isVisible;
   if (clip_isVisible < 0.5) discard;
 `
 };
-
 /*
  * The fragment-shader version clips pixels at the bounds
  * e.g. PolygonLayer - show the part of the polygon that intersect with the bounds
  */
+
 const shaderModuleFs = {
   name: 'clip-fs',
   fs: shaderFunction
 };
-
 const injectionFs = {
   'vs:#decl': `
 varying vec2 clip_commonPosition;
@@ -15586,53 +15566,47 @@ varying vec2 clip_commonPosition;
   if (!clip_isInBounds(clip_commonPosition)) discard;
 `
 };
-
 class ClipExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
   getShaders() {
     // If `clipByInstance: true`, the entire object is shown/hidden based on its anchor position (done by vertex shader)
     // Otherwise, the object is trimmed by the clip bounds (done by fragment shader)
-
     // Default behavior: consider a layer instanced if it has attribute `instancePositions`
-    let clipByInstance = 'instancePositions' in this.getAttributeManager().attributes;
-    // Users can override by setting the `clipByInstance` prop
+    let clipByInstance = ('instancePositions' in this.getAttributeManager().attributes); // Users can override by setting the `clipByInstance` prop
+
     if ('clipByInstance' in this.props) {
       clipByInstance = this.props.clipByInstance;
     }
-    this.state.clipByInstance = clipByInstance;
 
-    return clipByInstance
-      ? {
-          modules: [shaderModuleVs],
-          inject: injectionVs
-        }
-      : {
-          modules: [shaderModuleFs],
-          inject: injectionFs
-        };
+    this.state.clipByInstance = clipByInstance;
+    return clipByInstance ? {
+      modules: [shaderModuleVs],
+      inject: injectionVs
+    } : {
+      modules: [shaderModuleFs],
+      inject: injectionFs
+    };
   }
 
-  draw({uniforms}) {
-    const {clipBounds = defaultProps.clipBounds} = this.props;
+  draw({
+    uniforms
+  }) {
+    const {
+      clipBounds = defaultProps.clipBounds
+    } = this.props;
+
     if (this.state.clipByInstance) {
       uniforms.clip_bounds = clipBounds;
     } else {
       const corner0 = this.projectPosition([clipBounds[0], clipBounds[1], 0]);
       const corner1 = this.projectPosition([clipBounds[2], clipBounds[3], 0]);
-
-      uniforms.clip_bounds = [
-        Math.min(corner0[0], corner1[0]),
-        Math.min(corner0[1], corner1[1]),
-        Math.max(corner0[0], corner1[0]),
-        Math.max(corner0[1], corner1[1])
-      ];
+      uniforms.clip_bounds = [Math.min(corner0[0], corner1[0]), Math.min(corner0[1], corner1[1]), Math.max(corner0[0], corner1[0]), Math.max(corner0[1], corner1[1])];
     }
   }
-}
 
+}
 ClipExtension.extensionName = 'ClipExtension';
 ClipExtension.defaultProps = defaultProps;
 
-
 /***/ }),
 
 /***/ "./src/data-filter/aggregator.js":
@@ -15653,7 +15627,6 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _luma_gl_constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @luma.gl/constants */ "../../node_modules/@luma.gl/constants/dist/esm/index.js");
 
 
-
 const AGGREGATE_VS = `\
 #define SHADER_NAME data-filter-vertex-shader
 
@@ -15686,7 +15659,6 @@ void main() {
   gl_PointSize = 1.0;
 }
 `;
-
 const AGGREGATE_FS = `\
 #define SHADER_NAME data-filter-fragment-shader
 precision highp float;
@@ -15700,19 +15672,12 @@ void main() {
   gl_FragColor = vColor;
 }
 `;
-
 function supportsFloatTarget(gl) {
   // https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/WebGL_best_practices#Support_for_float_textures_doesnt_mean_you_can_render_into_them!
-  return (
-    gl.getExtension('EXT_float_blend') &&
-    // WebGL 2
-    (gl.getExtension('EXT_color_buffer_float') ||
-      // WebGL 1
-      gl.getExtension('WEBGL_color_buffer_float'))
-  );
-}
+  return gl.getExtension('EXT_float_blend') && (gl.getExtension('EXT_color_buffer_float') || // WebGL 1
+  gl.getExtension('WEBGL_color_buffer_float'));
+} // A 1x1 framebuffer object that encodes the total count of filtered items
 
-// A 1x1 framebuffer object that encodes the total count of filtered items
 function getFramebuffer(gl, useFloatTarget) {
   if (useFloatTarget) {
     return new _luma_gl_core__WEBPACK_IMPORTED_MODULE_0__["Framebuffer"](gl, {
@@ -15727,16 +15692,17 @@ function getFramebuffer(gl, useFloatTarget) {
       }
     });
   }
+
   return new _luma_gl_core__WEBPACK_IMPORTED_MODULE_0__["Framebuffer"](gl, {
     width: 256,
     height: 64,
     depth: false
   });
-}
+} // Increments the counter based on dataFilter_value
 
-// Increments the counter based on dataFilter_value
 function getModel(gl, shaderOptions, useFloatTarget) {
   shaderOptions.defines.NON_INSTANCED_MODEL = 1;
+
   if (useFloatTarget) {
     shaderOptions.defines.FLOAT_TARGET = 1;
   }
@@ -15751,7 +15717,6 @@ function getModel(gl, shaderOptions, useFloatTarget) {
     ...shaderOptions
   });
 }
-
 const parameters = {
   blend: true,
   blendFunc: [_luma_gl_constants__WEBPACK_IMPORTED_MODULE_1__["default"].ONE, _luma_gl_constants__WEBPACK_IMPORTED_MODULE_1__["default"].ONE, _luma_gl_constants__WEBPACK_IMPORTED_MODULE_1__["default"].ONE, _luma_gl_constants__WEBPACK_IMPORTED_MODULE_1__["default"].ONE],
@@ -15759,7 +15724,6 @@ const parameters = {
   depthTest: false
 };
 
-
 /***/ }),
 
 /***/ "./src/data-filter/data-filter.js":
@@ -15803,38 +15767,50 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-
-
 const defaultProps = {
-  getFilterValue: {type: 'accessor', value: 0},
-  onFilteredItemsChange: {type: 'function', value: null, compare: false},
-
+  getFilterValue: {
+    type: 'accessor',
+    value: 0
+  },
+  onFilteredItemsChange: {
+    type: 'function',
+    value: null,
+    compare: false
+  },
   filterEnabled: true,
   filterRange: [-1, 1],
   filterSoftRange: null,
   filterTransformSize: true,
   filterTransformColor: true
 };
-
 const DATA_TYPE_FROM_SIZE = {
   1: 'float',
   2: 'vec2',
   3: 'vec3',
   4: 'vec4'
 };
-
 class DataFilterExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
-  constructor({filterSize = 1, fp64 = false, countItems = false} = {}) {
+  constructor({
+    filterSize = 1,
+    fp64 = false,
+    countItems = false
+  } = {}) {
     if (!DATA_TYPE_FROM_SIZE[filterSize]) {
       throw new Error('filterSize out of range');
     }
 
-    super({filterSize, fp64, countItems});
+    super({
+      filterSize,
+      fp64,
+      countItems
+    });
   }
 
   getShaders(extension) {
-    const {filterSize, fp64} = extension.opts;
-
+    const {
+      filterSize,
+      fp64
+    } = extension.opts;
     return {
       modules: [fp64 ? _shader_module__WEBPACK_IMPORTED_MODULE_1__["shaderModule64"] : _shader_module__WEBPACK_IMPORTED_MODULE_1__["shaderModule"]],
       defines: {
@@ -15846,6 +15822,7 @@ class DataFilterExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["La
 
   initializeState(context, extension) {
     const attributeManager = this.getAttributeManager();
+
     if (attributeManager) {
       attributeManager.add({
         filterValues: {
@@ -15864,19 +15841,24 @@ class DataFilterExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["La
       });
     }
 
-    const {gl} = this.context;
+    const {
+      gl
+    } = this.context;
+
     if (attributeManager && extension.opts.countItems) {
-      const useFloatTarget = _aggregator__WEBPACK_IMPORTED_MODULE_2__["supportsFloatTarget"](gl);
-      // This attribute is needed for variable-width data, e.g. Path, SolidPolygon, Text
+      const useFloatTarget = _aggregator__WEBPACK_IMPORTED_MODULE_2__["supportsFloatTarget"](gl); // This attribute is needed for variable-width data, e.g. Path, SolidPolygon, Text
       // The vertex shader checks if a vertex has the same "index" as the previous vertex
       // so that we only write one count cross multiple vertices of the same object
+
       attributeManager.add({
         filterIndices: {
           size: useFloatTarget ? 1 : 2,
           vertexOffset: 1,
           type: _luma_gl_constants__WEBPACK_IMPORTED_MODULE_4__["default"].UNSIGNED_BYTE,
           normalized: true,
-          accessor: (object, {index}) => {
+          accessor: (object, {
+            index
+          }) => {
             const i = object && object.__source ? object.__source.index : index;
             return useFloatTarget ? (i + 1) % 255 : [(i + 1) % 255, Math.floor(i / 255) % 255];
           },
@@ -15890,77 +15872,96 @@ class DataFilterExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["La
           }
         }
       });
-
       const filterFBO = _aggregator__WEBPACK_IMPORTED_MODULE_2__["getFramebuffer"](gl, useFloatTarget);
       const filterModel = _aggregator__WEBPACK_IMPORTED_MODULE_2__["getModel"](gl, extension.getShaders(extension), useFloatTarget);
-      this.setState({filterFBO, filterModel});
+      this.setState({
+        filterFBO,
+        filterModel
+      });
     }
   }
 
-  updateState({props, oldProps}) {
+  updateState({
+    props,
+    oldProps
+  }) {
     if (this.state.filterModel) {
       const attributeManager = this.getAttributeManager();
-      const filterNeedsUpdate =
-        attributeManager.attributes.filterValues.needsUpdate() ||
-        props.filterEnabled !== oldProps.filterEnabled ||
-        props.filterRange !== oldProps.filterRange ||
-        props.filterSoftRange !== oldProps.filterSoftRange;
+      const filterNeedsUpdate = attributeManager.attributes.filterValues.needsUpdate() || props.filterEnabled !== oldProps.filterEnabled || props.filterRange !== oldProps.filterRange || props.filterSoftRange !== oldProps.filterSoftRange;
+
       if (filterNeedsUpdate) {
-        this.setState({filterNeedsUpdate});
+        this.setState({
+          filterNeedsUpdate
+        });
       }
     }
   }
 
   draw(params, extension) {
-    const {filterFBO, filterModel, filterNeedsUpdate} = this.state;
-    const {onFilteredItemsChange} = this.props;
+    const {
+      filterFBO,
+      filterModel,
+      filterNeedsUpdate
+    } = this.state;
+    const {
+      onFilteredItemsChange
+    } = this.props;
+
     if (filterNeedsUpdate && onFilteredItemsChange && filterModel) {
       const {
-        attributes: {filterValues, filterIndices}
+        attributes: {
+          filterValues,
+          filterIndices
+        }
       } = this.getAttributeManager();
       filterModel.setVertexCount(this.getNumInstances());
-
-      const {gl} = this.context;
-      Object(_luma_gl_core__WEBPACK_IMPORTED_MODULE_3__["clear"])(gl, {framebuffer: filterFBO, color: [0, 0, 0, 0]});
-
-      filterModel
-        .updateModuleSettings(params.moduleParameters)
-        .setAttributes({
-          ...filterValues.getShaderAttributes(),
-          ...(filterIndices && filterIndices.getShaderAttributes())
-        })
-        .draw({
-          framebuffer: filterFBO,
-          parameters: {
-            ..._aggregator__WEBPACK_IMPORTED_MODULE_2__["parameters"],
-            viewport: [0, 0, filterFBO.width, filterFBO.height]
-          }
-        });
+      const {
+        gl
+      } = this.context;
+      Object(_luma_gl_core__WEBPACK_IMPORTED_MODULE_3__["clear"])(gl, {
+        framebuffer: filterFBO,
+        color: [0, 0, 0, 0]
+      });
+      filterModel.updateModuleSettings(params.moduleParameters).setAttributes({ ...filterValues.getShaderAttributes(),
+        ...(filterIndices && filterIndices.getShaderAttributes())
+      }).draw({
+        framebuffer: filterFBO,
+        parameters: { ..._aggregator__WEBPACK_IMPORTED_MODULE_2__["parameters"],
+          viewport: [0, 0, filterFBO.width, filterFBO.height]
+        }
+      });
       const color = Object(_luma_gl_core__WEBPACK_IMPORTED_MODULE_3__["readPixelsToArray"])(filterFBO);
       let count = 0;
+
       for (let i = 0; i < color.length; i++) {
         count += color[i];
       }
-      onFilteredItemsChange({id: this.id, count});
 
+      onFilteredItemsChange({
+        id: this.id,
+        count
+      });
       this.state.filterNeedsUpdate = false;
     }
   }
 
   finalizeState() {
-    const {filterFBO, filterModel} = this.state;
+    const {
+      filterFBO,
+      filterModel
+    } = this.state;
+
     if (filterFBO) {
       filterFBO.color.delete();
       filterFBO.delete();
       filterModel.delete();
     }
   }
-}
 
+}
 DataFilterExtension.extensionName = 'DataFilterExtension';
 DataFilterExtension.defaultProps = defaultProps;
 
-
 /***/ }),
 
 /***/ "./src/data-filter/shader-module.js":
@@ -16033,7 +16034,6 @@ void dataFilter_setValue(DATAFILTER_TYPE valueFromMin, DATAFILTER_TYPE valueFrom
   }
 }
 `;
-
 const fs = `
 uniform bool filter_transformColor;
 varying float dataFilter_value;
@@ -16043,6 +16043,7 @@ const getUniforms = opts => {
   if (!opts || !opts.extensions) {
     return {};
   }
+
   const {
     filterRange = [-1, 1],
     filterEnabled = true,
@@ -16050,25 +16051,21 @@ const getUniforms = opts => {
     filterTransformColor = true
   } = opts;
   const filterSoftRange = opts.filterSoftRange || filterRange;
-
-  const uniforms = Number.isFinite(filterRange[0])
-    ? {
-        filter_min: filterRange[0],
-        filter_softMin: filterSoftRange[0],
-        filter_softMax: filterSoftRange[1],
-        filter_max: filterRange[1]
-      }
-    : {
-        filter_min: filterRange.map(r => r[0]),
-        filter_softMin: filterSoftRange.map(r => r[0]),
-        filter_softMax: filterSoftRange.map(r => r[1]),
-        filter_max: filterRange.map(r => r[1])
-      };
+  const uniforms = Number.isFinite(filterRange[0]) ? {
+    filter_min: filterRange[0],
+    filter_softMin: filterSoftRange[0],
+    filter_softMax: filterSoftRange[1],
+    filter_max: filterRange[1]
+  } : {
+    filter_min: filterRange.map(r => r[0]),
+    filter_softMin: filterSoftRange.map(r => r[0]),
+    filter_softMax: filterSoftRange.map(r => r[1]),
+    filter_max: filterRange.map(r => r[1])
+  };
   uniforms.filter_enabled = filterEnabled;
   uniforms.filter_useSoftMargin = Boolean(opts.filterSoftRange);
   uniforms.filter_transformSize = filterEnabled && filterTransformSize;
   uniforms.filter_transformColor = filterEnabled && filterTransformColor;
-
   return uniforms;
 };
 
@@ -16076,13 +16073,14 @@ const getUniforms64 = opts => {
   if (!opts || !opts.extensions) {
     return {};
   }
+
   const uniforms = getUniforms(opts);
+
   if (Number.isFinite(uniforms.filter_min)) {
     const min64High = Math.fround(uniforms.filter_min);
     uniforms.filter_min -= min64High;
     uniforms.filter_softMin -= min64High;
     uniforms.filter_min64High = min64High;
-
     const max64High = Math.fround(uniforms.filter_max);
     uniforms.filter_max -= max64High;
     uniforms.filter_softMax -= max64High;
@@ -16092,12 +16090,12 @@ const getUniforms64 = opts => {
     uniforms.filter_min = uniforms.filter_min.map((x, i) => x - min64High[i]);
     uniforms.filter_softMin = uniforms.filter_softMin.map((x, i) => x - min64High[i]);
     uniforms.filter_min64High = min64High;
-
     const max64High = uniforms.filter_max.map(Math.fround);
     uniforms.filter_max = uniforms.filter_max.map((x, i) => x - max64High[i]);
     uniforms.filter_softMax = uniforms.filter_softMax.map((x, i) => x - max64High[i]);
     uniforms.filter_max64High = max64High;
   }
+
   return uniforms;
 };
 
@@ -16112,13 +16110,11 @@ const inject = {
       dataFilter_setValue(DATAFILTER_ATTRIB, DATAFILTER_ATTRIB);
     #endif
   `,
-
   'vs:DECKGL_FILTER_SIZE': `
     if (filter_transformSize) {
       size = size * dataFilter_value;
     }
   `,
-
   'fs:DECKGL_FILTER_COLOR': `
     if (dataFilter_value == 0.0) discard;
     if (filter_transformColor) {
@@ -16126,7 +16122,6 @@ const inject = {
     }
   `
 };
-
 const shaderModule = {
   name: 'data-filter',
   vs,
@@ -16134,7 +16129,6 @@ const shaderModule = {
   inject,
   getUniforms
 };
-
 const shaderModule64 = {
   name: 'data-filter-fp64',
   vs,
@@ -16143,7 +16137,6 @@ const shaderModule64 = {
   getUniforms: getUniforms64
 };
 
-
 /***/ }),
 
 /***/ "./src/fill-style/fill-style.js":
@@ -16166,18 +16159,24 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-
-
 const defaultProps = {
   fillPatternEnabled: true,
   fillPatternAtlas: null,
   fillPatternMapping: null,
   fillPatternMask: true,
-  getFillPattern: {type: 'accessor', value: d => d.pattern},
-  getFillPatternScale: {type: 'accessor', value: 1},
-  getFillPatternOffset: {type: 'accessor', value: [0, 0]}
+  getFillPattern: {
+    type: 'accessor',
+    value: d => d.pattern
+  },
+  getFillPatternScale: {
+    type: 'accessor',
+    value: 1
+  },
+  getFillPatternOffset: {
+    type: 'accessor',
+    value: [0, 0]
+  }
 };
-
 const DEFAULT_TEXTURE_PARAMETERS = {
   [_luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].TEXTURE_MIN_FILTER]: _luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].LINEAR,
   // GL.LINEAR is the default value but explicitly set it here
@@ -16186,10 +16185,13 @@ const DEFAULT_TEXTURE_PARAMETERS = {
   [_luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].TEXTURE_WRAP_S]: _luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].CLAMP_TO_EDGE,
   [_luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].TEXTURE_WRAP_T]: _luma_gl_constants__WEBPACK_IMPORTED_MODULE_2__["default"].CLAMP_TO_EDGE
 };
-
 class FillStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
-  constructor({pattern = false} = {}) {
-    super({pattern});
+  constructor({
+    pattern = false
+  } = {}) {
+    super({
+      pattern
+    });
   }
 
   isEnabled(layer) {
@@ -16255,6 +16257,7 @@ class FillStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
         }
       });
     }
+
     this.setState({
       emptyTexture: new _luma_gl_core__WEBPACK_IMPORTED_MODULE_1__["Texture2D"](this.context.gl, {
         data: new Uint8Array(4),
@@ -16264,7 +16267,10 @@ class FillStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
     });
   }
 
-  updateState({props, oldProps}, extension) {
+  updateState({
+    props,
+    oldProps
+  }, extension) {
     if (!extension.isEnabled(this)) {
       return;
     }
@@ -16272,6 +16278,7 @@ class FillStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
     if (props.fillPatternAtlas && props.fillPatternAtlas !== oldProps.fillPatternAtlas) {
       extension.loadPatternAtlas.call(this, props);
     }
+
     if (props.fillPatternMapping && props.fillPatternMapping !== oldProps.fillPatternMapping) {
       extension.loadPatternMapping.call(this, props);
     }
@@ -16282,60 +16289,84 @@ class FillStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
       return;
     }
 
-    const {patternTexture} = this.state;
+    const {
+      patternTexture
+    } = this.state;
     this.setModuleParameters({
       fillPatternTexture: patternTexture || this.state.emptyTexture
     });
   }
 
   finalizeState() {
-    const {patternTexture, emptyTexture} = this.state;
+    const {
+      patternTexture,
+      emptyTexture
+    } = this.state;
     patternTexture?.delete();
     emptyTexture?.delete();
   }
 
-  async loadPatternAtlas({fillPatternAtlas, fetch}) {
+  async loadPatternAtlas({
+    fillPatternAtlas,
+    fetch
+  }) {
     this.state.patternTexture?.delete();
-    this.setState({patternTexture: null});
+    this.setState({
+      patternTexture: null
+    });
     let image = fillPatternAtlas;
+
     if (typeof image === 'string') {
-      image = await fetch(image, {propName: 'fillPatternAtlas', layer: this});
+      image = await fetch(image, {
+        propName: 'fillPatternAtlas',
+        layer: this
+      });
     }
-    const patternTexture =
-      image instanceof _luma_gl_core__WEBPACK_IMPORTED_MODULE_1__["Texture2D"]
-        ? image
-        : new _luma_gl_core__WEBPACK_IMPORTED_MODULE_1__["Texture2D"](this.context.gl, {
-            data: image,
-            parameters: DEFAULT_TEXTURE_PARAMETERS
-          });
-    this.setState({patternTexture});
-  }
-
-  async loadPatternMapping({fillPatternMapping, fetch}) {
-    this.setState({patternMapping: null});
+
+    const patternTexture = image instanceof _luma_gl_core__WEBPACK_IMPORTED_MODULE_1__["Texture2D"] ? image : new _luma_gl_core__WEBPACK_IMPORTED_MODULE_1__["Texture2D"](this.context.gl, {
+      data: image,
+      parameters: DEFAULT_TEXTURE_PARAMETERS
+    });
+    this.setState({
+      patternTexture
+    });
+  }
+
+  async loadPatternMapping({
+    fillPatternMapping,
+    fetch
+  }) {
+    this.setState({
+      patternMapping: null
+    });
     let patternMapping = fillPatternMapping;
+
     if (typeof patternMapping === 'string') {
       patternMapping = await fetch(patternMapping, {
         propName: 'fillPatternMapping',
         layer: this
       });
     }
-    this.setState({patternMapping});
+
+    this.setState({
+      patternMapping
+    });
     this.getAttributeManager().invalidate('getFillPattern');
     this.setNeedsUpdate();
   }
 
   getPatternFrame(name) {
-    const {patternMapping} = this.state;
+    const {
+      patternMapping
+    } = this.state;
     const def = patternMapping && patternMapping[name];
     return def ? [def.x, def.y, def.width, def.height] : [0, 0, 0, 0];
   }
-}
 
+}
 FillStyleExtension.extensionName = 'FillStyleExtension';
 FillStyleExtension.defaultProps = defaultProps;
 
-
 /***/ }),
 
 /***/ "./src/fill-style/shaders.glsl.js":
@@ -16351,10 +16382,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @deck.gl/core */ "@deck.gl/core");
 /* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__);
 
-
 /*
  * fill pattern shader module
  */
+
 const patternVs = `
 #ifdef NON_INSTANCED_MODEL
   #define FILL_PATTERN_FRAME_ATTRIB fillPatternFrames
@@ -16377,7 +16408,6 @@ varying vec2 fill_uv;
 varying vec4 fill_patternBounds;
 varying vec3 fill_patternPlacement;
 `;
-
 const patternFs = `
 uniform bool fill_patternEnabled;
 uniform bool fill_patternMask;
@@ -16390,12 +16420,10 @@ varying vec2 fill_uv;
 
 const float FILL_UV_SCALE = 512.0 / 40000000.0;
 `;
-
 const inject = {
   'vs:DECKGL_FILTER_GL_POSITION': `
     fill_uv = geometry.position.xy;
   `,
-
   'vs:DECKGL_FILTER_COLOR': `
     if (fill_patternEnabled) {
       fill_patternBounds = FILL_PATTERN_FRAME_ATTRIB / vec4(fill_patternTextureSize, fill_patternTextureSize);
@@ -16403,7 +16431,6 @@ const inject = {
       fill_patternPlacement.z = FILL_PATTERN_SCALE_ATTRIB * FILL_PATTERN_FRAME_ATTRIB.w;
     }
   `,
-
   'fs:DECKGL_FILTER_COLOR': `
     if (fill_patternEnabled) {
       float scale = FILL_UV_SCALE * fill_patternPlacement.z;
@@ -16423,27 +16450,33 @@ const inject = {
 
 function getPatternUniforms(opts = {}, uniforms) {
   if ('fillPatternTexture' in opts) {
-    const {fillPatternTexture} = opts;
+    const {
+      fillPatternTexture
+    } = opts;
     return {
       fill_patternTexture: fillPatternTexture,
       fill_patternTextureSize: [fillPatternTexture.width, fillPatternTexture.height]
     };
   }
-  if (opts.viewport) {
-    const {viewport, fillPatternMask = true, fillPatternEnabled = true} = opts;
-    const {project_uCoordinateOrigin, project_uCoordinateSystem} = uniforms;
-
-    const coordinateOriginCommon =
-      project_uCoordinateSystem === _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].CARTESIAN
-        ? project_uCoordinateOrigin
-        : viewport.projectPosition(project_uCoordinateOrigin);
 
+  if (opts.viewport) {
+    const {
+      viewport,
+      fillPatternMask = true,
+      fillPatternEnabled = true
+    } = opts;
+    const {
+      project_uCoordinateOrigin,
+      project_uCoordinateSystem
+    } = uniforms;
+    const coordinateOriginCommon = project_uCoordinateSystem === _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].CARTESIAN ? project_uCoordinateOrigin : viewport.projectPosition(project_uCoordinateOrigin);
     return {
       fill_uvCoordinateOrigin: coordinateOriginCommon.slice(0, 2),
       fill_patternMask: fillPatternMask,
       fill_patternEnabled: fillPatternEnabled
     };
   }
+
   return {};
 }
 
@@ -16456,7 +16489,6 @@ const patternShaders = {
   getUniforms: getPatternUniforms
 };
 
-
 /***/ }),
 
 /***/ "./src/fp64/fp64.js":
@@ -16493,15 +16525,13 @@ __webpack_require__.r(__webpack_exports__);
 // THE SOFTWARE.
 
 
-
-
 class Fp64Extension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
   getShaders(opts) {
-    const {coordinateSystem} = this.props;
-    if (
-      coordinateSystem !== _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].LNGLAT &&
-      coordinateSystem !== _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].DEFAULT
-    ) {
+    const {
+      coordinateSystem
+    } = this.props;
+
+    if (coordinateSystem !== _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].LNGLAT && coordinateSystem !== _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["COORDINATE_SYSTEM"].DEFAULT) {
       throw new Error('fp64: coordinateSystem must be LNGLAT');
     }
 
@@ -16509,11 +16539,10 @@ class Fp64Extension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExt
       modules: [_project64__WEBPACK_IMPORTED_MODULE_1__["default"]]
     };
   }
-}
 
+}
 Fp64Extension.extensionName = 'Fp64Extension';
 
-
 /***/ }),
 
 /***/ "./src/fp64/project64.glsl.js":
@@ -16544,7 +16573,6 @@ __webpack_require__.r(__webpack_exports__);
 // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
-
 /* harmony default export */ __webpack_exports__["default"] = (`\
 
 const vec2 WORLD_SCALE_FP64 = vec2(81.4873275756836, 0.0000032873668232014097);
@@ -16627,7 +16655,6 @@ vec4 project_position_to_clipspace(
 }
 `);
 
-
 /***/ }),
 
 /***/ "./src/fp64/project64.js":
@@ -16663,10 +16690,10 @@ __webpack_require__.r(__webpack_exports__);
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-
-const {fp64ify, fp64ifyMatrix4} = _luma_gl_shadertools__WEBPACK_IMPORTED_MODULE_0__["fp64"];
-
-
+const {
+  fp64ify,
+  fp64ifyMatrix4
+} = _luma_gl_shadertools__WEBPACK_IMPORTED_MODULE_0__["fp64"];
 
 
 /* harmony default export */ __webpack_exports__["default"] = ({
@@ -16674,9 +16701,7 @@ const {fp64ify, fp64ifyMatrix4} = _luma_gl_shadertools__WEBPACK_IMPORTED_MODULE_
   dependencies: [_deck_gl_core__WEBPACK_IMPORTED_MODULE_1__["project"], _luma_gl_shadertools__WEBPACK_IMPORTED_MODULE_0__["fp64"]],
   vs: _project64_glsl__WEBPACK_IMPORTED_MODULE_2__["default"],
   getUniforms
-});
-
-// TODO - this module should calculate the 64 bit uniforms
+}); // TODO - this module should calculate the 64 bit uniforms
 // It is currently done by project to minimize duplicated work
 
 const DEFAULT_MODULE_OPTIONS = {};
@@ -16684,17 +16709,26 @@ const getMemoizedUniforms = Object(_deck_gl_core__WEBPACK_IMPORTED_MODULE_1__["_
 
 function getUniforms(opts = DEFAULT_MODULE_OPTIONS) {
   if (opts.viewport) {
-    const {viewProjectionMatrix, scale} = opts.viewport;
-    // We only need to update fp64 uniforms if fp32 projection is being updated
-    return getMemoizedUniforms({viewProjectionMatrix, scale});
+    const {
+      viewProjectionMatrix,
+      scale
+    } = opts.viewport; // We only need to update fp64 uniforms if fp32 projection is being updated
+
+    return getMemoizedUniforms({
+      viewProjectionMatrix,
+      scale
+    });
   }
+
   return {};
 }
 
-function calculateUniforms({viewProjectionMatrix, scale}) {
+function calculateUniforms({
+  viewProjectionMatrix,
+  scale
+}) {
   const glViewProjectionMatrixFP64 = fp64ifyMatrix4(viewProjectionMatrix);
   const scaleFP64 = fp64ify(scale);
-
   return {
     project_uViewProjectionMatrixFP64: glViewProjectionMatrixFP64,
     project64_uViewProjectionMatrix: glViewProjectionMatrixFP64,
@@ -16702,14 +16736,13 @@ function calculateUniforms({viewProjectionMatrix, scale}) {
   };
 }
 
-
 /***/ }),
 
-/***/ "./src/index.js":
+/***/ "./src/index.ts":
 /*!**********************!*\
-  !*** ./src/index.js ***!
+  !*** ./src/index.ts ***!
   \**********************/
-/*! exports provided: BrushingExtension, DataFilterExtension, Fp64Extension, PathStyleExtension, FillStyleExtension, ClipExtension, project64 */
+/*! exports provided: BrushingExtension, DataFilterExtension, Fp64Extension, PathStyleExtension, FillStyleExtension, ClipExtension, MaskExtension, project64 */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -16732,8 +16765,11 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _clip_clip__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./clip/clip */ "./src/clip/clip.js");
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ClipExtension", function() { return _clip_clip__WEBPACK_IMPORTED_MODULE_5__["default"]; });
 
-/* harmony import */ var _fp64_project64__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./fp64/project64 */ "./src/fp64/project64.js");
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "project64", function() { return _fp64_project64__WEBPACK_IMPORTED_MODULE_6__["default"]; });
+/* harmony import */ var _mask_mask__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./mask/mask */ "./src/mask/mask.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "MaskExtension", function() { return _mask_mask__WEBPACK_IMPORTED_MODULE_6__["default"]; });
+
+/* harmony import */ var _fp64_project64__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./fp64/project64 */ "./src/fp64/project64.js");
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "project64", function() { return _fp64_project64__WEBPACK_IMPORTED_MODULE_7__["default"]; });
 
 
 
@@ -16741,10 +16777,145 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+ // Shader module
 
-// Shader module
 
 
+/***/ }),
+
+/***/ "./src/mask/mask.js":
+/*!**************************!*\
+  !*** ./src/mask/mask.js ***!
+  \**************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return MaskExtension; });
+/* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @deck.gl/core */ "@deck.gl/core");
+/* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _shader_module__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./shader-module */ "./src/mask/shader-module.js");
+
+
+const defaultProps = {
+  maskEnabled: true
+};
+class MaskExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
+  getShaders() {
+    // Infer by geometry if 'maskByInstance' prop isn't explictly set
+    let maskByInstance = ('instancePositions' in this.getAttributeManager().attributes); // Users can override by setting the `maskByInstance` prop
+
+    if ('maskByInstance' in this.props) {
+      maskByInstance = this.props.maskByInstance;
+    }
+
+    this.state.maskByInstance = maskByInstance;
+    return {
+      modules: [_shader_module__WEBPACK_IMPORTED_MODULE_1__["default"]]
+    };
+  }
+
+  draw({
+    uniforms,
+    moduleParameters
+  }) {
+    uniforms.mask_maskByInstance = this.state.maskByInstance;
+    const {
+      maskBounds
+    } = moduleParameters;
+
+    if (maskBounds) {
+      const bl = this.projectPosition([maskBounds[0], maskBounds[1], 0]);
+      const tr = this.projectPosition([maskBounds[2], maskBounds[3], 0]);
+      uniforms.mask_bounds = [bl[0], bl[1], tr[0], tr[1]];
+    }
+  }
+
+}
+MaskExtension.extensionName = 'MaskExtension';
+MaskExtension.defaultProps = defaultProps;
+
+/***/ }),
+
+/***/ "./src/mask/shader-module.js":
+/*!***********************************!*\
+  !*** ./src/mask/shader-module.js ***!
+  \***********************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @deck.gl/core */ "@deck.gl/core");
+/* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__);
+
+const vs = `
+uniform vec4 mask_bounds;
+uniform bool mask_maskByInstance;
+vec2 mask_getCoords(vec4 position) {
+  return (position.xy - mask_bounds.xy) / (mask_bounds.zw - mask_bounds.xy);
+}
+`;
+const fs = `
+uniform sampler2D mask_texture;
+uniform bool mask_enabled;
+bool mask_isInBounds(vec2 texCoords) {
+  if (!mask_enabled) {
+    return true;
+  }
+  vec4 maskColor = texture2D(mask_texture, texCoords);
+  return maskColor.a > 0.5;
+}
+`;
+const inject = {
+  'vs:#decl': `
+varying vec2 mask_texCoords;
+`,
+  'vs:#main-end': `
+   vec4 mask_common_position;
+   if (mask_maskByInstance) {
+     mask_common_position = project_position(vec4(geometry.worldPosition, 1.0));
+   } else {
+     mask_common_position = geometry.position;
+   }
+   mask_texCoords = mask_getCoords(mask_common_position);
+`,
+  'fs:#decl': `
+varying vec2 mask_texCoords;
+`,
+  'fs:#main-start': `
+  if (mask_enabled) {
+    bool mask = mask_isInBounds(mask_texCoords);
+
+    // Debug: show extent of render target
+    // gl_FragColor = vec4(mask_texCoords, 0.0, 1.0);
+    gl_FragColor = texture2D(mask_texture, mask_texCoords);
+
+    if (!mask) discard;
+  }
+`
+};
+
+const getMaskUniforms = (opts = {}, context = {}) => {
+  const uniforms = {};
+
+  if (opts.maskMap) {
+    uniforms.mask_enabled = opts.maskEnabled !== false;
+    uniforms.mask_texture = opts.maskMap;
+  }
+
+  return uniforms;
+};
+
+/* harmony default export */ __webpack_exports__["default"] = ({
+  name: 'mask',
+  dependencies: [_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["project"]],
+  vs,
+  fs,
+  inject,
+  getUniforms: getMaskUniforms
+});
 
 /***/ }),
 
@@ -16784,18 +16955,29 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-
-
 const defaultProps = {
-  getDashArray: {type: 'accessor', value: [0, 0]},
-  getOffset: {type: 'accessor', value: 0},
+  getDashArray: {
+    type: 'accessor',
+    value: [0, 0]
+  },
+  getOffset: {
+    type: 'accessor',
+    value: 0
+  },
   dashJustified: false,
   dashGapPickable: false
 };
-
 class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["LayerExtension"] {
-  constructor({dash = false, offset = false, highPrecisionDash = false} = {}) {
-    super({dash: dash || highPrecisionDash, offset, highPrecisionDash});
+  constructor({
+    dash = false,
+    offset = false,
+    highPrecisionDash = false
+  } = {}) {
+    super({
+      dash: dash || highPrecisionDash,
+      offset,
+      highPrecisionDash
+    });
   }
 
   isEnabled(layer) {
@@ -16805,13 +16987,15 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
   getShaders(extension) {
     if (!extension.isEnabled(this)) {
       return null;
-    }
+    } // Merge shader injection
+
 
-    // Merge shader injection
     let result = {};
+
     if (extension.opts.dash) {
       result = Object(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["_mergeShaders"])(result, _shaders_glsl__WEBPACK_IMPORTED_MODULE_1__["dashShaders"]);
     }
+
     if (extension.opts.offset) {
       result = Object(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["_mergeShaders"])(result, _shaders_glsl__WEBPACK_IMPORTED_MODULE_1__["offsetShaders"]);
     }
@@ -16821,6 +17005,7 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
 
   initializeState(context, extension) {
     const attributeManager = this.getAttributeManager();
+
     if (!attributeManager || !extension.isEnabled(this)) {
       // This extension only works with the PathLayer
       return;
@@ -16830,9 +17015,13 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
 
     if (extension.opts.dash) {
       attributeManager.addInstanced({
-        instanceDashArrays: {size: 2, accessor: 'getDashArray'}
+        instanceDashArrays: {
+          size: 2,
+          accessor: 'getDashArray'
+        }
       });
     }
+
     if (extension.opts.highPrecisionDash) {
       attributeManager.addInstanced({
         instanceDashOffsets: {
@@ -16842,9 +17031,13 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
         }
       });
     }
+
     if (extension.opts.offset) {
       attributeManager.addInstanced({
-        instanceOffsets: {size: 1, accessor: 'getOffset'}
+        instanceOffsets: {
+          size: 1,
+          accessor: 'getOffset'
+        }
       });
     }
   }
@@ -16869,9 +17062,9 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
     const positionSize = this.props.positionFormat === 'XY' ? 2 : 3;
     const isNested = Array.isArray(path[0]);
     const geometrySize = isNested ? path.length : path.length / positionSize;
-
     let p;
     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);
@@ -16882,14 +17075,14 @@ class PathStyleExtension extends _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Lay
 
       prevP = p;
     }
+
     return result;
   }
-}
 
+}
 PathStyleExtension.extensionName = 'PathStyleExtension';
 PathStyleExtension.defaultProps = defaultProps;
 
-
 /***/ }),
 
 /***/ "./src/path-style/shaders.glsl.js":
@@ -16911,12 +17104,10 @@ attribute float instanceDashOffsets;
 varying vec2 vDashArray;
 varying float vDashOffset;
 `,
-
     'vs:#main-end': `
 vDashArray = instanceDashArrays;
 vDashOffset = instanceDashOffsets / width.x;
 `,
-
     'fs:#decl': `
 uniform float dashAlignMode;
 uniform float capType;
@@ -16928,7 +17119,6 @@ float round(float x) {
   return floor(x + 0.5);
 }
 `,
-
     // if given position is in the gap part of the dashed line
     // dashArray.x: solid stroke length, relative to width
     // dashArray.y: gap length, relative to width
@@ -16976,7 +17166,6 @@ float round(float x) {
 `
   }
 };
-
 const offsetShaders = {
   inject: {
     'vs:#decl': `
@@ -17001,7 +17190,6 @@ attribute float instanceOffsets;
   }
 };
 
-
 /***/ }),
 
 /***/ "@deck.gl/core":