'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = SimpleLineChart;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _shape = require('@vx/shape');

var _shape2 = _interopRequireDefault(_shape);

var _point = require('@vx/point');

var _point2 = _interopRequireDefault(_point);

var _axis = require('@vx/axis');

var _axis2 = _interopRequireDefault(_axis);

var _scale = require('@vx/scale');

var _scale2 = _interopRequireDefault(_scale);

var _group = require('@vx/group');

var _group2 = _interopRequireDefault(_group);

var _grid = require('@vx/grid');

var _grid2 = _interopRequireDefault(_grid);

var _d3Array = require('d3-array');

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

function SimpleLineChart(_ref) {
  var width = _ref.width,
      height = _ref.height,
      margin = _ref.margin,
      dataset = _ref.dataset;

  if (!Array.isArray(dataset)) dataset = [dataset];

  var allData = dataset.reduce(function (rec, d) {
    return rec.concat(d.data);
  }, []);

  // bounds
  var xMax = width - margin.left - margin.right;
  var yMax = height - margin.top - margin.bottom;

  // accessors
  var x = function x(d) {
    return d.date;
  };
  var y = function y(d) {
    return d.value;
  };

  // scales
  var xScale = _scale2.default.scaleTime({
    range: [0, xMax],
    domain: (0, _d3Array.extent)(allData, x)
  });
  var yScale = _scale2.default.scaleLinear({
    range: [yMax, 0],
    domain: [0, (0, _d3Array.max)(allData, y)],
    nice: true
  });

  return _react2.default.createElement(
    'svg',
    { width: width, height: height },
    _react2.default.createElement(_axis2.default.AxisLeft, {
      top: margin.top,
      left: margin.left,
      scale: yScale,
      hideZero: true
    }),
    _react2.default.createElement(
      _group2.default,
      {
        top: margin.top,
        left: margin.left
      },
      _react2.default.createElement(_grid2.default.Grid, {
        xScale: xScale,
        yScale: yScale,
        width: xMax,
        height: yMax
      }),
      dataset.map(function (series, i) {
        return _react2.default.createElement(_shape2.default.LinePath, {
          key: 'chart-line-' + i,
          data: series.data,
          xScale: xScale,
          yScale: yScale,
          x: x,
          y: y,
          stroke: series.chart.stroke,
          points: series.chart.points
        });
      })
    ),
    _react2.default.createElement(_axis2.default.AxisBottom, {
      top: height - margin.bottom,
      left: margin.left,
      scale: xScale
    })
  );
}