@data-ui/xy-chart/esm/chart/Voronoi.js

A package of charts with standard x- and y- axes. https://williaster.github.io/data-ui

function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }

/* eslint react/no-array-index-key: 0, react/no-unused-prop-types: 0 */
import React from 'react';
import PropTypes from 'prop-types';
import { Group } from '@vx/group';
import { VoronoiPolygon, voronoi as voronoiLayout } from '@vx/voronoi';
var propTypes = {
  data: PropTypes.arrayOf(PropTypes.object).isRequired,
  onClick: PropTypes.func,
  onMouseMove: PropTypes.func,
  onMouseLeave: PropTypes.func,
  onMouseDown: PropTypes.func,
  showVoronoi: PropTypes.bool,
  width: PropTypes.number.isRequired,
  height: PropTypes.number.isRequired,
  x: PropTypes.func.isRequired,
  y: PropTypes.func.isRequired
};
var defaultProps = {
  onClick: null,
  onMouseMove: null,
  onMouseLeave: null,
  onMouseDown: null,
  showVoronoi: false
};

var Voronoi =
/*#__PURE__*/
function (_React$PureComponent) {
  _inheritsLoose(Voronoi, _React$PureComponent);

  Voronoi.getVoronoi = function getVoronoi(props) {
    var x = props.x,
        y = props.y,
        data = props.data,
        width = props.width,
        height = props.height;
    return voronoiLayout({
      x: x,
      y: y,
      width: width,
      height: height
    })(data);
  };

  function Voronoi(props) {
    var _this;

    _this = _React$PureComponent.call(this, props) || this;
    _this.state = {
      voronoi: Voronoi.getVoronoi(props)
    };
    return _this;
  }

  var _proto = Voronoi.prototype;

  _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    var _this2 = this;

    if (['data', 'x', 'y', 'width', 'height'].some(function (prop) {
      return _this2.props[prop] !== nextProps[prop];
    } // eslint-disable-line react/destructuring-assignment
    )) {
      this.setState({
        voronoi: Voronoi.getVoronoi(nextProps)
      });
    }
  };

  _proto.render = function render() {
    var _this$props = this.props,
        onMouseLeave = _this$props.onMouseLeave,
        onMouseMove = _this$props.onMouseMove,
        onClick = _this$props.onClick,
        showVoronoi = _this$props.showVoronoi,
        onMouseDown = _this$props.onMouseDown;
    var voronoi = this.state.voronoi;
    return React.createElement(Group, null, voronoi.polygons().map(function (polygon, i) {
      return React.createElement(VoronoiPolygon, {
        key: "voronoi-" + polygon.length + "-" + i,
        polygon: polygon,
        fill: "transparent",
        stroke: showVoronoi ? '#ddd' : 'transparent',
        strokeWidth: 1,
        onClick: onClick && function () {
          return function (event) {
            onClick({
              event: event,
              datum: polygon.data
            });
          };
        },
        onMouseMove: onMouseMove && function () {
          return function (event) {
            onMouseMove({
              event: event,
              datum: polygon.data
            });
          };
        },
        onMouseLeave: onMouseLeave && function () {
          return onMouseLeave;
        },
        onMouseDown: onMouseDown && function () {
          return onMouseDown;
        }
      });
    }));
  };

  return Voronoi;
}(React.PureComponent);

Voronoi.propTypes = propTypes;
Voronoi.defaultProps = defaultProps;
Voronoi.displayName = 'Voronoi';
export default Voronoi;