function _templateObject11() {
  var data = _taggedTemplateLiteral(["\n        width: fit-content;\n        text-align: ", ";\n      "]);

  _templateObject11 = function _templateObject11() {
    return data;
  };

  return data;
}

function _templateObject10() {
  var data = _taggedTemplateLiteral(["\n            font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica,\n              sans-serif;\n            font-size: 14px;\n            white-space: nowrap;\n            margin: 0 5px;\n          "]);

  _templateObject10 = function _templateObject10() {
    return data;
  };

  return data;
}

function _templateObject9() {
  var data = _taggedTemplateLiteral(["\n            background-color: ", ";\n            border: 1px solid gray;\n            border-bottom: ", ";\n            width: 15px;\n            height: 20px;\n          "]);

  _templateObject9 = function _templateObject9() {
    return data;
  };

  return data;
}

function _templateObject8() {
  var data = _taggedTemplateLiteral(["\n          display: flex;\n          align-items: center;\n        "]);

  _templateObject8 = function _templateObject8() {
    return data;
  };

  return data;
}

function _templateObject7() {
  var data = _taggedTemplateLiteral(["\n              font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica,\n                sans-serif;\n              font-size: 14px;\n              white-space: nowrap;\n              margin-left: 5px;\n            "]);

  _templateObject7 = function _templateObject7() {
    return data;
  };

  return data;
}

function _templateObject6() {
  var data = _taggedTemplateLiteral(["\n            background-color: ", ";\n            border: 1px solid gray;\n            border-right: ", ";\n            width: 20px;\n            height: 20px;\n          "]);

  _templateObject6 = function _templateObject6() {
    return data;
  };

  return data;
}

function _templateObject5() {
  var data = _taggedTemplateLiteral(["\n              font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica,\n                sans-serif;\n              font-size: 14px;\n              white-space: nowrap;\n              margin-right: 5px;\n            "]);

  _templateObject5 = function _templateObject5() {
    return data;
  };

  return data;
}

function _templateObject4() {
  var data = _taggedTemplateLiteral(["\n          display: flex;\n          align-items: center;\n        "]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

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 _templateObject3() {
  var data = _taggedTemplateLiteral(["\n    font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica, sans-serif;\n    font-size: 14px;\n    font-weight: bold;\n    margin-bottom: 5px;\n  "]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n    display: flex;\n  "]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    display: block;\n  "]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

import PropTypes from "prop-types";
import { jsx, css } from "@emotion/core";

var MapLegend = function MapLegend(props) {
  var colorScale = props.colorScale,
      formatValues = props.formatValues,
      label = props.label,
      vertical = props.vertical;
  var verticalContainer = css(_templateObject());
  var horizontalContainer = css(_templateObject2());
  var labelContainer = css(_templateObject3());

  var formatColor = function formatColor(colorArray) {
    var rgba = colorArray.length === 3 ? [].concat(_toConsumableArray(colorArray), [1]) : colorArray;
    return rgba.reduce(function (acc, cur, i) {
      return i < 3 ? "".concat(acc + cur, ",") : "".concat(acc, "1)");
    }, "rgba(");
  };

  var colors = colorScale.range().map(function (color) {
    return formatColor(color);
  });
  var bins = colorScale.domain().map(function (arr) {
    return formatValues(arr);
  });

  if (vertical) {
    colors = colors.reverse();
    bins = bins.reverse();
  }

  var getBinLabel = function getBinLabel(i) {
    if (bins[i] === null) return "No data available";
    return bins[i];
  };

  var getRangeLabel = function getRangeLabel(i) {
    if (i === 0) return bins[0];
    if (i === colors.length - 1) return bins[1];
    return null;
  };

  var rangeOnly = bins.length === 2;

  var horizontalRangeBin = function horizontalRangeBin(color, i) {
    var partialBorder = i < colors.length - 1;
    return jsx("div", {
      key: color,
      css: css(_templateObject4())
    }, i === 0 && jsx("span", {
      css: css(_templateObject5())
    }, getBinLabel(0)), jsx("div", {
      css: css(_templateObject6(), color, partialBorder ? "none" : "1px solid gray")
    }), i === colors.length - 1 && jsx("span", {
      css: css(_templateObject7())
    }, getBinLabel(1)));
  };

  var colorBin = function colorBin(color, i) {
    if (rangeOnly && !vertical) return horizontalRangeBin(color, i);
    var partialBorder = vertical && i < colors.length - 1;
    return jsx("div", {
      key: color,
      css: css(_templateObject8())
    }, jsx("div", {
      css: css(_templateObject9(), color, partialBorder ? "none" : "1px solid gray")
    }), jsx("span", {
      css: css(_templateObject10())
    }, rangeOnly ? getRangeLabel(i) : getBinLabel(i)));
  };

  return jsx("div", {
    css: css(_templateObject11(), vertical ? "left" : "center")
  }, jsx("div", {
    css: labelContainer
  }, label), jsx("div", {
    css: vertical ? verticalContainer : horizontalContainer
  }, colors.map(function (color, i) {
    return colorBin(color, i);
  })));
};

MapLegend.propTypes = {
  colorScale: PropTypes.func.isRequired,
  formatValues: PropTypes.func,
  label: PropTypes.string,
  vertical: PropTypes.bool
};
MapLegend.defaultProps = {
  formatValues: function formatValues(value) {
    return value;
  },
  label: "",
  vertical: true
};
export default MapLegend;