/*!
 * Copyright © 2018 Splunk Inc.
 * SPLUNK CONFIDENTIAL – Use or disclosure of this material in whole or
 * in part without a valid written license from Splunk Inc. is PROHIBITED.
 */
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ 	// The module cache
/******/ 	var installedModules = {};
/******/
/******/ 	// The require function
/******/ 	function __webpack_require__(moduleId) {
/******/
/******/ 		// Check if module is in cache
/******/ 		if(installedModules[moduleId]) {
/******/ 			return installedModules[moduleId].exports;
/******/ 		}
/******/ 		// Create a new module (and put it into the cache)
/******/ 		var module = installedModules[moduleId] = {
/******/ 			i: moduleId,
/******/ 			l: false,
/******/ 			exports: {}
/******/ 		};
/******/
/******/ 		// Execute the module function
/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ 		// Flag the module as loaded
/******/ 		module.l = true;
/******/
/******/ 		// Return the exports of the module
/******/ 		return module.exports;
/******/ 	}
/******/
/******/
/******/ 	// expose the modules object (__webpack_modules__)
/******/ 	__webpack_require__.m = modules;
/******/
/******/ 	// expose the module cache
/******/ 	__webpack_require__.c = installedModules;
/******/
/******/ 	// define getter function for harmony exports
/******/ 	__webpack_require__.d = function(exports, name, getter) {
/******/ 		if(!__webpack_require__.o(exports, name)) {
/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ 		}
/******/ 	};
/******/
/******/ 	// define __esModule on exports
/******/ 	__webpack_require__.r = function(exports) {
/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ 		}
/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
/******/ 	};
/******/
/******/ 	// create a fake namespace object
/******/ 	// mode & 1: value is a module id, require it
/******/ 	// mode & 2: merge all properties of value into the ns
/******/ 	// mode & 4: return value when already ns object
/******/ 	// mode & 8|1: behave like require
/******/ 	__webpack_require__.t = function(value, mode) {
/******/ 		if(mode & 1) value = __webpack_require__(value);
/******/ 		if(mode & 8) return value;
/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ 		var ns = Object.create(null);
/******/ 		__webpack_require__.r(ns);
/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ 		return ns;
/******/ 	};
/******/
/******/ 	// getDefaultExport function for compatibility with non-harmony modules
/******/ 	__webpack_require__.n = function(module) {
/******/ 		var getter = module && module.__esModule ?
/******/ 			function getDefault() { return module['default']; } :
/******/ 			function getModuleExports() { return module; };
/******/ 		__webpack_require__.d(getter, 'a', getter);
/******/ 		return getter;
/******/ 	};
/******/
/******/ 	// Object.prototype.hasOwnProperty.call
/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ 	// __webpack_public_path__
/******/ 	__webpack_require__.p = "";
/******/
/******/
/******/ 	// Load entry module and return exports
/******/ 	return __webpack_require__(__webpack_require__.s = 36);
/******/ })
/************************************************************************/
/******/ ({

/***/ 1:
/***/ (function(module, exports) {

module.exports = require("react");

/***/ }),

/***/ 16:
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/createClass");

/***/ }),

/***/ 17:
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/classCallCheck");

/***/ }),

/***/ 21:
/***/ (function(module, exports) {

module.exports = require("lodash");

/***/ }),

/***/ 23:
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/inherits");

/***/ }),

/***/ 24:
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/possibleConstructorReturn");

/***/ }),

/***/ 25:
/***/ (function(module, exports) {

module.exports = require("@babel/runtime/helpers/getPrototypeOf");

/***/ }),

/***/ 36:
/***/ (function(module, exports, __webpack_require__) {

"use strict";


var _classCallCheck = __webpack_require__(17);

var _createClass = __webpack_require__(16);

var _inherits = __webpack_require__(23);

var _possibleConstructorReturn = __webpack_require__(24);

var _getPrototypeOf = __webpack_require__(25);

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DATA_ATTRIBUTE = void 0;
/* eslint-disable no-param-reassign */

var React = __webpack_require__(1);

var lodash_1 = __webpack_require__(21);

var styled_components_1 = __webpack_require__(7);

exports.DATA_ATTRIBUTE = 'data-value';
var StyledSvgChoropleth = styled_components_1.default.div.withConfig({
  displayName: "SvgChoropleth__StyledSvgChoropleth",
  componentId: "sc-17ucmlb-0"
})(["display:flex;flex-direction:column;position:relative;background-color:", ";"], function (props) {
  return props.backgroundColor;
});

var SvgChoropleth = /*#__PURE__*/function (_React$Component) {
  _inherits(SvgChoropleth, _React$Component);

  var _super = _createSuper(SvgChoropleth);

  function SvgChoropleth(props) {
    var _this;

    _classCallCheck(this, SvgChoropleth);

    _this = _super.call(this, props);
    _this.containerRef = React.createRef();
    _this.highlightedCountry = null;

    _this.getLocalCoords = function (clientX, clientY) {
      var rect = _this.containerRef.current.getBoundingClientRect();

      var physX = rect.left;
      var physY = rect.top;
      return {
        x: clientX - physX,
        y: clientY - physY
      };
    };

    _this.handleMapClick = function (event) {
      var clientX = event.clientX,
          clientY = event.clientY;

      var pos = _this.getLocalCoords(clientX, clientY);

      var _this$props = _this.props,
          featureCollection = _this$props.featureCollection,
          onClick = _this$props.onClick;
      var clickedCoords = featureCollection.transformation.transformBack(pos);
      var feature = event.target;
      var wholeFeature = feature.id ? feature : feature.parentNode;

      if (onClick) {
        onClick(clickedCoords, wholeFeature.id);
      }
    };

    _this.handleFeatureEnter = function (ev) {
      var feature = ev.target;

      if (!feature.id && !feature.ownerSVGElement) {
        return;
      }

      var wholeFeature = feature.id ? feature : feature.parentNode; // remove the highlighted country IF we are entering a different country

      if (_this.highlightedCountry && wholeFeature.id !== _this.highlightedCountry.id) {
        _this.unHighlightCountry();
      }

      _this.highlightCountry(wholeFeature);

      if (_this.props.onFeatureHover) {
        _this.props.onFeatureHover({
          featureId: wholeFeature.id,
          label: wholeFeature.getAttribute('label_en'),
          value: wholeFeature.getAttribute(exports.DATA_ATTRIBUTE)
        });
      }
    };

    _this.handleFeatureLeave = function (ev) {
      var feature = ev.target;

      if (!feature.id && !feature.ownerSVGElement) {
        return;
      } // 'wholeFeature' means the SVG <g> (group) of multipolygon features


      var wholeFeature = feature.id ? feature : feature.parentNode; // handling feature leaving should always only deal with the highlighted feature

      if (wholeFeature !== _this.highlightedCountry) {
        return;
      }

      _this.unHighlightCountry(); // wholeFeature.style.stroke = this.lastFeatureStroke;


      if (_this.props.onFeatureHover) {
        _this.props.onFeatureHover({
          featureId: null,
          value: null,
          label: null
        });
      }
    };

    _this.registerSvg = function (el) {
      if (!el) return;
      _this.svgDom = el;
      var _this$props2 = _this.props,
          _this$props2$selector = _this$props2.selector,
          selector = _this$props2$selector === void 0 ? '.feature' : _this$props2$selector,
          strokeColor = _this$props2.strokeColor,
          fillColor = _this$props2.fillColor;
      _this.svgDom.onmouseover = _this.handleFeatureEnter;
      _this.svgDom.onmouseout = _this.handleFeatureLeave;

      _this.svgDom.querySelectorAll(selector).forEach(function (node) {
        node.style.stroke = strokeColor;
        node.style.fill = fillColor;
      });

      _this.updateSvg(_this.props);
    };

    var featureCollection = props.featureCollection;
    _this.state = {
      svgNode: featureCollection.getSvgNode(_this.registerSvg)
    };
    return _this;
  }

  _createClass(SvgChoropleth, [{
    key: "shouldComponentUpdate",
    value: function shouldComponentUpdate(nextProps, nextState) {
      var shouldUpdate = !lodash_1.isEqual(nextState.svgNode, this.state.svgNode) || !lodash_1.isEqual(nextProps, this.props);
      return shouldUpdate;
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      if (this.props !== prevProps) {
        if (prevProps.featureCollection !== this.props.featureCollection) {
          // eslint-disable-next-line react/no-did-update-set-state
          this.setState({
            svgNode: this.props.featureCollection.getSvgNode(this.registerSvg)
          });
        } else {
          this.updateSvg(this.props);
        }
      }
    } // allows a provided alias like 'US-CA' to get mapped to 'California' which is the element id for the SVG shape

  }, {
    key: "getFeatureId",
    value: function getFeatureId(alias) {
      return this.props.featureCollection.resolveAlias(alias);
    }
    /**
     * this method renders a copy of the polygon on top of all the others, with a highlighted boundary.
     * Technically we don't render in on top of ALL the others. There are three totally landlocked countries,
     * the first of which in our geojson file is Lesotho. These are also the last three countries in the geojson
     * file. So when we insert the highlight shape into the dom, we inert it *before* these three countries.
     * So the highlight for South Africa will not cover up Lesotho.
     * @param {SVGElement} el
     */

  }, {
    key: "highlightCountry",
    value: function highlightCountry(el) {
      if (this.highlightedCountry) {
        return; // do not add more than one hovered element at a time
      }

      var firstLandlockedCountry = this.svgDom.querySelector("#Lesotho");
      var parent = el.parentNode;
      var clone = el.cloneNode(true);
      var strokeColor = this.props.strokeHighlightColor || '#000';
      clone.style.stroke = strokeColor;
      this.highlightedCountry = clone;
      parent.insertBefore(clone, firstLandlockedCountry);
    }
  }, {
    key: "unHighlightCountry",
    value: function unHighlightCountry() {
      if (this.highlightedCountry) {
        this.svgDom.removeChild(this.highlightedCountry);
      }

      this.highlightedCountry = null;
    }
  }, {
    key: "updateSvg",
    value: function updateSvg(props) {
      var _this2 = this;

      if (!this.svgDom) {
        return;
      }

      var _props$selector = props.selector,
          selector = _props$selector === void 0 ? '.feature' : _props$selector,
          fillColor = props.fillColor,
          data = props.data;

      if (!data) {
        return;
      }

      var dataHashMap = {};
      data.featureIDs.forEach(function (alias, index) {
        var featureId = _this2.getFeatureId(alias);

        dataHashMap[featureId] = {
          fill: data.fill[index],
          value: data.values[index]
        };
      });
      this.svgDom.querySelectorAll(selector).forEach(function (node) {
        var nodeData = dataHashMap[node.id];
        node.style.fill = lodash_1.get(nodeData, 'fill') || fillColor;
        var value = lodash_1.get(nodeData, 'value');

        if (value) {
          node.setAttribute(exports.DATA_ATTRIBUTE, value);
        } else {
          node.removeAttribute(exports.DATA_ATTRIBUTE);
        }
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props$backgroun = this.props.backgroundColor,
          backgroundColor = _this$props$backgroun === void 0 ? 'transparent' : _this$props$backgroun; // note: for some reason, onclick event can't be triggered on dashboard. So change it to onMouseDown

      return React.createElement(StyledSvgChoropleth, {
        "data-test": "styled-svg-choropleth",
        backgroundColor: backgroundColor,
        onMouseDown: this.handleMapClick,
        ref: this.containerRef
      }, this.state.svgNode);
    }
  }]);

  return SvgChoropleth;
}(React.Component);

exports.default = SvgChoropleth;

/***/ }),

/***/ 7:
/***/ (function(module, exports) {

module.exports = require("styled-components");

/***/ })

/******/ });
//# sourceMappingURL=SvgChoropleth.js.map