@hackoregon/component-library/dist/MapOverlay/MapOverlay.js

Official repo for Hack Oregon React component library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = require("prop-types");

var _deck = _interopRequireWildcard(require("deck.gl"));

var _centerOfMass = _interopRequireDefault(require("@turf/center-of-mass"));

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }

function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }

function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }

function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var MapOverlay = function MapOverlay(props) {
  var id = props.id,
      viewport = props.viewport,
      children = props.children,
      data = props.data,
      pickable = props.pickable,
      opacity = props.opacity,
      filled = props.filled,
      getFillColor = props.getFillColor,
      stroked = props.stroked,
      getLineColor = props.getLineColor,
      getLineWidth = props.getLineWidth,
      extruded = props.extruded,
      getElevation = props.getElevation,
      circleFieldName = props.circleFieldName,
      getRadius = props.getRadius,
      radiusScale = props.radiusScale,
      autoHighlight = props.autoHighlight,
      highlightColor = props.highlightColor,
      onLayerClick = props.onLayerClick,
      onHover = props.onHover,
      tooltipInfo = props.tooltipInfo,
      x = props.x,
      y = props.y;

  var tooltip = _react["default"].Children.map(children, function (child) {
    return _react["default"].cloneElement(child, {
      tooltipInfo: tooltipInfo,
      x: x,
      y: y
    });
  });

  var tooltipRender = tooltipInfo && x && y ? tooltip : null;
  var centroidData = circleFieldName ? data.map(function (d) {
    return (0, _centerOfMass["default"])(d.geometry, {
      properties: _objectSpread({}, d.properties)
    });
  }) : [];
  var radius = circleFieldName ? function (f) {
    return Math.sqrt(+f.properties[circleFieldName]);
  } : getRadius || 10;
  return _react["default"].createElement("div", null, _react["default"].createElement(_deck["default"], _extends({}, viewport, {
    className: "DeckGL",
    getCursor: function getCursor() {
      return "crosshair";
    }
  }), _react["default"].createElement(_deck.GeoJsonLayer, {
    id: id,
    className: "GeoJSONMap",
    pickable: pickable,
    data: [].concat(_toConsumableArray(data), _toConsumableArray(centroidData)),
    opacity: opacity,
    filled: filled,
    getFillColor: getFillColor,
    stroked: stroked,
    getLineColor: getLineColor,
    getLineWidth: getLineWidth,
    lineWidthMinPixels: 1,
    extruded: extruded,
    getElevation: getElevation,
    circleFieldName: circleFieldName,
    getRadius: radius,
    pointRadiusScale: radiusScale,
    pointRadiusMinPixels: 1,
    autoHighlight: autoHighlight,
    highlightColor: highlightColor,
    onClick: onLayerClick,
    onHover: onHover,
    updateTriggers: {
      getFillColor: getFillColor,
      getLineColor: getLineColor,
      getLineWidth: getLineWidth,
      getRadius: getRadius
    }
  })), tooltipRender);
};

MapOverlay.propTypes = {
  viewport: (0, _propTypes.shape)({}),
  children: _propTypes.node,
  id: _propTypes.string,
  data: (0, _propTypes.arrayOf)((0, _propTypes.shape)({})).isRequired,
  pickable: _propTypes.bool,
  opacity: _propTypes.number,
  filled: _propTypes.bool,
  getFillColor: (0, _propTypes.oneOfType)([(0, _propTypes.arrayOf)(_propTypes.number), _propTypes.func]),
  stroked: _propTypes.bool,
  getLineColor: (0, _propTypes.oneOfType)([(0, _propTypes.arrayOf)(_propTypes.number), _propTypes.func]),
  getLineWidth: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.func]),
  extruded: _propTypes.bool,
  getElevation: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.func]),
  circleFieldName: _propTypes.string,
  getRadius: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.func]),
  radiusScale: _propTypes.number,
  autoHighlight: _propTypes.bool,
  highlightColor: (0, _propTypes.arrayOf)(_propTypes.number),
  onLayerClick: _propTypes.func,
  onHover: _propTypes.func,
  tooltipInfo: (0, _propTypes.shape)({}),
  x: _propTypes.number,
  y: _propTypes.number
};
MapOverlay.defaultProps = {
  pickable: true,
  opacity: 0.8,
  filled: true,
  getFillColor: [0, 0, 0],
  stroked: true,
  getLineColor: [112, 122, 122, 100],
  getLineWidth: 10,
  extruded: false,
  autoHighlight: false
};
var _default = MapOverlay;
exports["default"] = _default;