@performant-software/geospatial 1.1.3-beta.1 → 1.1.3-beta.2

package/build/index.js

@@ -1,2 +1,2 @@
-(()=>{"use strict";var e={n:r=>{var t=r&&r.__esModule?()=>r.default:()=>r;return e.d(t,{a:t}),t},d:(r,t)=>{for(var n in t)e.o(t,n)&&!e.o(r,n)&&Object.defineProperty(r,n,{enumerable:!0,get:t[n]})},o:(e,r)=>Object.prototype.hasOwnProperty.call(e,r),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},r={};e.r(r),e.d(r,{DrawControl:()=>l,MapDraw:()=>g});const t=require("@mapbox/mapbox-gl-draw");var n=e.n(t);const o=require("react");var a=e.n(o);const u=require("react-map-gl");var i=e.n(u);const l=(0,o.forwardRef)((function(e,r){var t=(0,u.useControl)((function(){return new(n())(e)}),(function(r){var t=r.map;t.on("draw.create",e.onCreate),t.on("draw.update",e.onUpdate),t.on("draw.delete",e.onDelete)}),(function(r){var t=r.map;t.off("draw.create",e.onCreate),t.off("draw.update",e.onUpdate),t.off("draw.delete",e.onDelete)}),{position:e.position});return(0,o.useImperativeHandle)(r,(function(){return t}),[t]),null})),c=require("@turf/turf"),f=require("maplibre-gl");var d=e.n(f);const s=require("underscore");var p=e.n(s);function y(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function b(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function m(e,r){return function(e){if(Array.isArray(e))return e}(e)||function(e,r){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var n,o,a=[],u=!0,i=!1;try{for(t=t.call(e);!(u=(n=t.next()).done)&&(a.push(n.value),!r||a.length!==r);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==t.return||t.return()}finally{if(i)throw o}}return a}}(e,r)||function(e,r){if(e){if("string"==typeof e)return v(e,r);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?v(e,r):void 0}}(e,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function v(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}const g=function(e){var r=m((0,o.useState)(!1),2),t=r[0],n=r[1],u=(0,o.useRef)(),f=(0,o.useRef)(),s=(0,o.useCallback)((function(){e.onChange(u.current.getAll())}),[e.onChange]),v=(0,o.useMemo)((function(){return function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?y(Object(t),!0).forEach((function(r){b(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):y(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}({height:500,width:"100%"},e.style||{})}),[e.style]);return(0,o.useEffect)((function(){if(t&&e.data){var r=(0,c.bbox)(e.data);if(p().every(r,p().isFinite)){var n=m(r,4),o=[[n[0],n[1]],[n[2],n[3]]];f.current.fitBounds(o,{padding:40,duration:1e3})}"GeometryCollection"===e.data.type?p().each(e.data.geometries,(function(e){u.current.add((0,c.feature)(e))})):u.current.add(e.data)}}),[t,e.data]),a().createElement(i(),{attributionControl:!1,onLoad:function(){return n(!0)},mapLib:d(),ref:f,style:v,mapStyle:e.mapStyle},a().createElement(l,{ref:u,controls:{line_string:!0,point:!0,polygon:!0,trash:!0},displayControlsDefault:!1,onCreate:s,onUpdate:s,onDelete:s}),e.children)};module.exports=r})();
+(()=>{"use strict";var e={n:t=>{var r=t&&t.__esModule?()=>t.default:()=>t;return e.d(r,{a:r}),r},d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{DrawControl:()=>l,MapDraw:()=>O});const r=require("@mapbox/mapbox-gl-draw");var n=e.n(r);const o=require("react");var a=e.n(o);const u=require("react-map-gl");var i=e.n(u);const l=(0,o.forwardRef)((function(e,t){var r=(0,u.useControl)((function(){return new(n())(e)}),(function(t){var r=t.map;r.on("draw.create",e.onCreate),r.on("draw.update",e.onUpdate),r.on("draw.delete",e.onDelete)}),(function(t){var r=t.map;r.off("draw.create",e.onCreate),r.off("draw.update",e.onUpdate),r.off("draw.delete",e.onDelete)}),{position:e.position});return(0,o.useImperativeHandle)(t,(function(){return r}),[r]),null})),c=require("@turf/turf"),f=require("maplibre-gl");var s=e.n(f);const p=require("underscore");var d=e.n(p);function y(){return y=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},y.apply(this,arguments)}function b(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function g(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a=[],u=!0,i=!1;try{for(r=r.call(e);!(u=(n=r.next()).done)&&(a.push(n.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==r.return||r.return()}finally{if(i)throw o}}return a}}(e,t)||function(e,t){if(e){if("string"==typeof e)return v(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?v(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function v(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}const O=function(e){var t=g((0,o.useState)(!1),2),r=t[0],n=t[1],f=(0,o.useRef)(),p=(0,o.useRef)(),v=(0,o.useMemo)((function(){return d().where(e.layers,{type:"geojson"})}),[e.layers]),O=(0,o.useCallback)((function(){e.onChange(f.current.getAll())}),[e.onChange]),h=(0,o.useMemo)((function(){return function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?b(Object(r),!0).forEach((function(t){m(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):b(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({height:500,width:"100%"},e.style||{})}),[e.style]);return(0,o.useEffect)((function(){if(r&&e.data){var t=(0,c.bbox)(e.data);if(d().every(t,d().isFinite)){var n=g(t,4),o=[[n[0],n[1]],[n[2],n[3]]];p.current.fitBounds(o,{padding:40,duration:1e3})}"GeometryCollection"===e.data.type?d().each(e.data.geometries,(function(e){f.current.add((0,c.feature)(e))})):f.current.add(e.data)}}),[r,e.data]),a().createElement(i(),{attributionControl:!1,onLoad:function(){return n(!0)},mapLib:s(),ref:p,style:h,mapStyle:e.mapStyle},a().createElement(l,{ref:f,controls:{line_string:!0,point:!0,polygon:!0,trash:!0},displayControlsDefault:!1,onCreate:O,onUpdate:O,onDelete:O}),d().map(v,(function(e){return a().createElement(u.Source,{type:"geojson",data:e.data},a().createElement(u.Layer,y({},d().omit(e,"data","type"),{type:e.type})))})),e.children)};module.exports=t})();
 //# sourceMappingURL=index.js.map

package/build/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","mappings":"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","sources":["webpack://@performant-software/geospatial/webpack/bootstrap","webpack://@performant-software/geospatial/webpack/runtime/compat get default export","webpack://@performant-software/geospatial/webpack/runtime/define property getters","webpack://@performant-software/geospatial/webpack/runtime/hasOwnProperty shorthand","webpack://@performant-software/geospatial/webpack/runtime/make namespace object","webpack://@performant-software/geospatial/external commonjs \"@mapbox/mapbox-gl-draw\"","webpack://@performant-software/geospatial/external commonjs2 \"react\"","webpack://@performant-software/geospatial/external commonjs \"react-map-gl\"","webpack://@performant-software/geospatial/./src/components/DrawControl.js","webpack://@performant-software/geospatial/external commonjs \"@turf/turf\"","webpack://@performant-software/geospatial/external commonjs \"maplibre-gl\"","webpack://@performant-software/geospatial/external commonjs \"underscore\"","webpack://@performant-software/geospatial/./src/components/MapDraw.js"],"sourcesContent":["// The require scope\nvar __webpack_require__ = {};\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@mapbox/mapbox-gl-draw\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"react\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"react-map-gl\");","// @flow\n\nimport MapboxDraw from '@mapbox/mapbox-gl-draw';\nimport { forwardRef, useImperativeHandle } from 'react';\nimport { useControl, type ControlPosition, type MapRef } from 'react-map-gl';\n\ntype Props = {\n  position?: ControlPosition;\n  onCreate?: (evt: { features: Array<any> }) => void;\n  onUpdate?: (evt: { features: Array<any>, action: string }) => void;\n  onDelete?: (evt: { features: Array<any> }) => void;\n};\n\nconst DrawControl = forwardRef((props: Props, ref) => {\n  /**\n   * Creates the drawer ref using MapboxDraw.\n   */\n  const drawRef = useControl(\n    () => new MapboxDraw(props),\n    ({ map }: { map: MapRef }) => {\n      map.on('draw.create', props.onCreate);\n      map.on('draw.update', props.onUpdate);\n      map.on('draw.delete', props.onDelete);\n    },\n    ({ map }: { map: MapRef }) => {\n      map.off('draw.create', props.onCreate);\n      map.off('draw.update', props.onUpdate);\n      map.off('draw.delete', props.onDelete);\n    },\n    {\n      position: props.position\n    }\n  );\n\n  /**\n   * Exposes the ref for the MapboxDraw object.\n   */\n  useImperativeHandle(ref, () => drawRef, [drawRef]);\n\n  return null;\n});\n\nexport default DrawControl;\n","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@turf/turf\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"maplibre-gl\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"underscore\");","// @flow\n\nimport MapboxDraw from '@mapbox/mapbox-gl-draw';\nimport {\n  bbox,\n  feature,\n  type FeatureCollection,\n  type GeometryCollection\n} from '@turf/turf';\nimport maplibregl from 'maplibre-gl';\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type Node\n} from 'react';\nimport Map, { MapRef } from 'react-map-gl';\nimport _ from 'underscore';\nimport DrawControl from './DrawControl';\nimport './MapDraw.css';\n\ntype Props = {\n  /**\n   * Additional child nodes to render.\n   */\n  children?: Node,\n\n  /**\n   * GeoJSON structured data to be displayed on the map.\n   */\n  data: GeometryCollection | FeatureCollection,\n\n  /**\n   * URL of the map style to render. This URL should contain any necessary API keys.\n   */\n  mapStyle: string,\n\n  /**\n   * Callback fired when the map geometries are changed.\n   *\n   * @param features\n   */\n  onChange: (features: Array<any>) => void,\n\n  /**\n   * Map style object.\n   */\n  style?: any\n};\n\nconst GeometryTypes = {\n  geometryCollection: 'GeometryCollection',\n  point: 'Point'\n};\n\n/**\n * This component renders a map with controls for drawing one or more geometries. Geometries can be a point (lat/long),\n * a line, or a polygon.\n */\nconst MapDraw = (props: Props) => {\n  const [loaded, setLoaded] = useState(false);\n\n  const drawRef = useRef<MapboxDraw>();\n  const mapRef = useRef<MapRef>();\n\n  /**\n   * Calls the onChange prop with all of the geometries in the current drawer.\n   *\n   * @type {(function(): void)|*}\n   */\n  const onChange = useCallback(() => {\n    props.onChange(drawRef.current.getAll());\n  }, [props.onChange]);\n\n  /**\n   * Sets the map style.\n   *\n   * @type {{width: string, height: number}}\n   */\n  const style = useMemo(() => ({ height: 500, width: '100%', ...(props.style || {}) }), [props.style]);\n\n  /**\n   * Updates the map bounding box and drawer when the geometry is changed.\n   */\n  useEffect(() => {\n    if (loaded && props.data) {\n      // Sets the bounding box for the current geometry.\n      const boundingBox = bbox(props.data);\n\n      if (_.every(boundingBox, _.isFinite)) {\n        const [minLng, minLat, maxLng, maxLat] = boundingBox;\n        const bounds = [[minLng, minLat], [maxLng, maxLat]];\n\n        mapRef.current.fitBounds(bounds, { padding: 40, duration: 1000 });\n      }\n\n      // Handle special cases for geometry collection (not supported by mabox-gl-draw) and point\n      if (props.data.type === GeometryTypes.geometryCollection) {\n        _.each(props.data.geometries, (geometry) => {\n          drawRef.current.add(feature(geometry));\n        });\n      } else {\n        drawRef.current.add(props.data);\n      }\n    }\n  }, [loaded, props.data]);\n\n  return (\n    <Map\n      attributionControl={false}\n      onLoad={() => setLoaded(true)}\n      mapLib={maplibregl}\n      ref={mapRef}\n      style={style}\n      mapStyle={props.mapStyle}\n    >\n      <DrawControl\n        ref={drawRef}\n        controls={{\n          line_string: true,\n          point: true,\n          polygon: true,\n          trash: true\n        }}\n        displayControlsDefault={false}\n        onCreate={onChange}\n        onUpdate={onChange}\n        onDelete={onChange}\n      />\n      { props.children }\n    </Map>\n  );\n};\n\nexport default MapDraw;\n"],"names":["__webpack_require__","module","getter","__esModule","d","a","exports","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","require","forwardRef","props","ref","drawRef","useControl","MapboxDraw","map","on","onCreate","onUpdate","onDelete","off","position","useImperativeHandle","useState","loaded","setLoaded","useRef","mapRef","onChange","useCallback","current","getAll","style","useMemo","height","width","useEffect","data","boundingBox","bbox","_","bounds","fitBounds","padding","duration","type","geometries","geometry","add","feature","attributionControl","onLoad","mapLib","maplibregl","mapStyle","controls","line_string","point","polygon","trash","displayControlsDefault","children"],"sourceRoot":""}
+{"version":3,"file":"index.js","mappings":"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","sources":["webpack://@performant-software/geospatial/webpack/bootstrap","webpack://@performant-software/geospatial/webpack/runtime/compat get default export","webpack://@performant-software/geospatial/webpack/runtime/define property getters","webpack://@performant-software/geospatial/webpack/runtime/hasOwnProperty shorthand","webpack://@performant-software/geospatial/webpack/runtime/make namespace object","webpack://@performant-software/geospatial/external commonjs \"@mapbox/mapbox-gl-draw\"","webpack://@performant-software/geospatial/external commonjs2 \"react\"","webpack://@performant-software/geospatial/external commonjs \"react-map-gl\"","webpack://@performant-software/geospatial/./src/components/DrawControl.js","webpack://@performant-software/geospatial/external commonjs \"@turf/turf\"","webpack://@performant-software/geospatial/external commonjs \"maplibre-gl\"","webpack://@performant-software/geospatial/external commonjs \"underscore\"","webpack://@performant-software/geospatial/./src/components/MapDraw.js"],"sourcesContent":["// The require scope\nvar __webpack_require__ = {};\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@mapbox/mapbox-gl-draw\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"react\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"react-map-gl\");","// @flow\n\nimport MapboxDraw from '@mapbox/mapbox-gl-draw';\nimport { forwardRef, useImperativeHandle } from 'react';\nimport { useControl, type ControlPosition, type MapRef } from 'react-map-gl';\n\ntype Props = {\n  position?: ControlPosition;\n  onCreate?: (evt: { features: Array<any> }) => void;\n  onUpdate?: (evt: { features: Array<any>, action: string }) => void;\n  onDelete?: (evt: { features: Array<any> }) => void;\n};\n\nconst DrawControl = forwardRef((props: Props, ref) => {\n  /**\n   * Creates the drawer ref using MapboxDraw.\n   */\n  const drawRef = useControl(\n    () => new MapboxDraw(props),\n    ({ map }: { map: MapRef }) => {\n      map.on('draw.create', props.onCreate);\n      map.on('draw.update', props.onUpdate);\n      map.on('draw.delete', props.onDelete);\n    },\n    ({ map }: { map: MapRef }) => {\n      map.off('draw.create', props.onCreate);\n      map.off('draw.update', props.onUpdate);\n      map.off('draw.delete', props.onDelete);\n    },\n    {\n      position: props.position\n    }\n  );\n\n  /**\n   * Exposes the ref for the MapboxDraw object.\n   */\n  useImperativeHandle(ref, () => drawRef, [drawRef]);\n\n  return null;\n});\n\nexport default DrawControl;\n","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@turf/turf\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"maplibre-gl\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"underscore\");","// @flow\n\nimport MapboxDraw from '@mapbox/mapbox-gl-draw';\nimport {\n  bbox,\n  feature,\n  type FeatureCollection,\n  type GeometryCollection\n} from '@turf/turf';\nimport maplibregl from 'maplibre-gl';\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type Node\n} from 'react';\nimport Map, { Layer, MapRef, Source } from 'react-map-gl';\nimport _ from 'underscore';\nimport DrawControl from './DrawControl';\nimport './MapDraw.css';\n\ntype LayerType = {\n  id?: string | number,\n  type: string,\n  data: any\n};\n\ntype Props = {\n  /**\n   * Additional child nodes to render.\n   */\n  children?: Node,\n\n  /**\n   * GeoJSON structured data to be displayed on the map.\n   */\n  data: GeometryCollection | FeatureCollection,\n\n  layers: Array<LayerType>,\n\n  /**\n   * URL of the map style to render. This URL should contain any necessary API keys.\n   */\n  mapStyle: string,\n\n  /**\n   * Callback fired when the map geometries are changed.\n   *\n   * @param features\n   */\n  onChange: (features: Array<any>) => void,\n\n  /**\n   * Map style object.\n   */\n  style?: any\n};\n\nconst GeometryTypes = {\n  geometryCollection: 'GeometryCollection',\n  point: 'Point'\n};\n\nconst LayerTypes = {\n  geojson: 'geojson'\n};\n\n/**\n * This component renders a map with controls for drawing one or more geometries. Geometries can be a point (lat/long),\n * a line, or a polygon.\n */\nconst MapDraw = (props: Props) => {\n  const [loaded, setLoaded] = useState(false);\n\n  const drawRef = useRef<MapboxDraw>();\n  const mapRef = useRef<MapRef>();\n\n  const geojsonLayers = useMemo(() => _.where(props.layers, { type: LayerTypes.geojson }), [props.layers]);\n\n  /**\n   * Calls the onChange prop with all of the geometries in the current drawer.\n   *\n   * @type {(function(): void)|*}\n   */\n  const onChange = useCallback(() => {\n    props.onChange(drawRef.current.getAll());\n  }, [props.onChange]);\n\n  /**\n   * Sets the map style.\n   *\n   * @type {{width: string, height: number}}\n   */\n  const style = useMemo(() => ({ height: 500, width: '100%', ...(props.style || {}) }), [props.style]);\n\n  /**\n   * Updates the map bounding box and drawer when the geometry is changed.\n   */\n  useEffect(() => {\n    if (loaded && props.data) {\n      // Sets the bounding box for the current geometry.\n      const boundingBox = bbox(props.data);\n\n      if (_.every(boundingBox, _.isFinite)) {\n        const [minLng, minLat, maxLng, maxLat] = boundingBox;\n        const bounds = [[minLng, minLat], [maxLng, maxLat]];\n\n        mapRef.current.fitBounds(bounds, { padding: 40, duration: 1000 });\n      }\n\n      // Handle special cases for geometry collection (not supported by mabox-gl-draw) and point\n      if (props.data.type === GeometryTypes.geometryCollection) {\n        _.each(props.data.geometries, (geometry) => {\n          drawRef.current.add(feature(geometry));\n        });\n      } else {\n        drawRef.current.add(props.data);\n      }\n    }\n  }, [loaded, props.data]);\n\n  return (\n    <Map\n      attributionControl={false}\n      onLoad={() => setLoaded(true)}\n      mapLib={maplibregl}\n      ref={mapRef}\n      style={style}\n      mapStyle={props.mapStyle}\n    >\n      <DrawControl\n        ref={drawRef}\n        controls={{\n          line_string: true,\n          point: true,\n          polygon: true,\n          trash: true\n        }}\n        displayControlsDefault={false}\n        onCreate={onChange}\n        onUpdate={onChange}\n        onDelete={onChange}\n      />\n      { _.map(geojsonLayers, (layer) => (\n        <Source\n          type='geojson'\n          data={layer.data}\n        >\n          <Layer\n            {..._.omit(layer, 'data', 'type')}\n            type={layer.type}\n          />\n        </Source>\n      ))}\n      { props.children }\n    </Map>\n  );\n};\n\nexport default MapDraw;\n"],"names":["__webpack_require__","module","getter","__esModule","d","a","exports","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","require","forwardRef","props","ref","drawRef","useControl","MapboxDraw","map","on","onCreate","onUpdate","onDelete","off","position","useImperativeHandle","useState","loaded","setLoaded","useRef","mapRef","geojsonLayers","useMemo","_","layers","type","onChange","useCallback","current","getAll","style","height","width","useEffect","data","boundingBox","bbox","bounds","fitBounds","padding","duration","geometries","geometry","add","feature","attributionControl","onLoad","mapLib","maplibregl","mapStyle","controls","line_string","point","polygon","trash","displayControlsDefault","layer","Source","Layer","children"],"sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@performant-software/geospatial",
-  "version": "1.1.3-beta.1",
+  "version": "1.1.3-beta.2",
   "description": "TODO: ADD",
   "license": "MIT",
   "main": "./build/index.js",

package/src/components/MapDraw.js

@@ -16,11 +16,17 @@ import React, {
   useState,
   type Node
 } from 'react';
-import Map, { MapRef } from 'react-map-gl';
+import Map, { Layer, MapRef, Source } from 'react-map-gl';
 import _ from 'underscore';
 import DrawControl from './DrawControl';
 import './MapDraw.css';
 
+type LayerType = {
+  id?: string | number,
+  type: string,
+  data: any
+};
+
 type Props = {
   /**
    * Additional child nodes to render.
@@ -32,6 +38,8 @@ type Props = {
    */
   data: GeometryCollection | FeatureCollection,
 
+  layers: Array<LayerType>,
+
   /**
    * URL of the map style to render. This URL should contain any necessary API keys.
    */
@@ -55,6 +63,10 @@ const GeometryTypes = {
   point: 'Point'
 };
 
+const LayerTypes = {
+  geojson: 'geojson'
+};
+
 /**
  * This component renders a map with controls for drawing one or more geometries. Geometries can be a point (lat/long),
  * a line, or a polygon.
@@ -65,6 +77,8 @@ const MapDraw = (props: Props) => {
   const drawRef = useRef<MapboxDraw>();
   const mapRef = useRef<MapRef>();
 
+  const geojsonLayers = useMemo(() => _.where(props.layers, { type: LayerTypes.geojson }), [props.layers]);
+
   /**
    * Calls the onChange prop with all of the geometries in the current drawer.
    *
@@ -129,6 +143,17 @@ const MapDraw = (props: Props) => {
         onUpdate={onChange}
         onDelete={onChange}
       />
+      { _.map(geojsonLayers, (layer) => (
+        <Source
+          type='geojson'
+          data={layer.data}
+        >
+          <Layer
+            {..._.omit(layer, 'data', 'type')}
+            type={layer.type}
+          />
+        </Source>
+      ))}
       { props.children }
     </Map>
   );

package/types/components/MapDraw.js.flow

@@ -16,11 +16,17 @@ import React, {
   useState,
   type Node
 } from 'react';
-import Map, { MapRef } from 'react-map-gl';
+import Map, { Layer, MapRef, Source } from 'react-map-gl';
 import _ from 'underscore';
 import DrawControl from './DrawControl';
 import './MapDraw.css';
 
+type LayerType = {
+  id?: string | number,
+  type: string,
+  data: any
+};
+
 type Props = {
   /**
    * Additional child nodes to render.
@@ -32,6 +38,8 @@ type Props = {
    */
   data: GeometryCollection | FeatureCollection,
 
+  layers: Array<LayerType>,
+
   /**
    * URL of the map style to render. This URL should contain any necessary API keys.
    */
@@ -55,6 +63,10 @@ const GeometryTypes = {
   point: 'Point'
 };
 
+const LayerTypes = {
+  geojson: 'geojson'
+};
+
 /**
  * This component renders a map with controls for drawing one or more geometries. Geometries can be a point (lat/long),
  * a line, or a polygon.
@@ -65,6 +77,8 @@ const MapDraw = (props: Props) => {
   const drawRef = useRef<MapboxDraw>();
   const mapRef = useRef<MapRef>();
 
+  const geojsonLayers = useMemo(() => _.where(props.layers, { type: LayerTypes.geojson }), [props.layers]);
+
   /**
    * Calls the onChange prop with all of the geometries in the current drawer.
    *
@@ -129,6 +143,17 @@ const MapDraw = (props: Props) => {
         onUpdate={onChange}
         onDelete={onChange}
       />
+      { _.map(geojsonLayers, (layer) => (
+        <Source
+          type='geojson'
+          data={layer.data}
+        >
+          <Layer
+            {..._.omit(layer, 'data', 'type')}
+            type={layer.type}
+          />
+        </Source>
+      ))}
       { props.children }
     </Map>
   );