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; } }

import PropTypes from "prop-types";
import { format } from "d3";
import { startCase } from "lodash";
import { jsx, css } from "@emotion/core";
import shortid from "shortid";
import civicFormat from "../utils/civicFormat";
import { createColorScale, updateQuantileScale, updateEqualScale } from "../MultiLayerMap/createLayers";
var legendContainer = css("\n  margin: 0.5rem 5% 1rem 5%;\n  display: flex;\n  flex-wrap: nowrap;\n  height: 25px;\n  width: 90%;\n");
var colorBox = css("\n  display: flex;\n  position: relative;\n  flex-basis: 100%;\n  border-left: 2px solid gainsboro;\n  justify-content: end;\n  align-items: end;\n");
var tickNums = css("\n  position: absolute;\n  bottom: -20px;\n  right: 0;\n  font-size: 14px;\n");
var tickNumsThreshold = css("\n  position: absolute;\n  bottom: -20px;\n  right: -7px;\n  font-size: 14px;\n");
var tickNumsOrdinal = css("\n  position: absolute;\n  bottom: -20px;\n  right: unset;\n  left: 0;\n  font-size: 14px;\n");

var SandboxMapLegend = function SandboxMapLegend(props) {
  var data = props.data,
      mapProps = props.mapProps;
  var civicColor = mapProps.civicColor,
      scaleType = mapProps.scaleType,
      dataRange = mapProps.dataRange,
      colorRange = mapProps.colorRange,
      fieldName = mapProps.fieldName;
  var colorScaleType = scaleType.color;
  var choroplethColorScale = createColorScale(civicColor, scaleType, dataRange, colorRange);

  if (colorScaleType === "equal") {
    choroplethColorScale = updateEqualScale(data, choroplethColorScale, civicColor, dataRange, colorRange, fieldName);
  }

  if (colorScaleType === "quantile") {
    choroplethColorScale = updateQuantileScale(data, choroplethColorScale, civicColor, colorRange, fieldName);
  }

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

  var colorScaleRange = choroplethColorScale.range()[0].length === 4 ? choroplethColorScale.range() : choroplethColorScale.range().map(function (c) {
    return [].concat(_toConsumableArray(c), [255]);
  });
  var mapColorsArr = colorScaleRange.map(function (arr) {
    return formatColor(arr);
  });
  var bins = colorScaleType === "ordinal" || colorScaleType === "threshold" ? dataRange : choroplethColorScale.range().map(function (d) {
    return choroplethColorScale.invertExtent(d);
  });
  var ticks = colorScaleType === "ordinal" || colorScaleType === "threshold" ? bins : bins.reduce(function (a, c) {
    return c[1] ? [].concat(_toConsumableArray(a), [c[1]]) : [].concat(_toConsumableArray(a), [""]);
  }, []);
  var percentageFormat = format(".1%");

  var sandboxPercentFormat = function sandboxPercentFormat(p) {
    return p < 1 && p > 0 ? percentageFormat(p) : "".concat(p.toFixed(1), "%");
  };

  var sandboxDecimalFormat = format(".2n");

  var sandboxMoneyFormat = function sandboxMoneyFormat(d) {
    return "$".concat(civicFormat.numericShort(d));
  };

  var sandboxSentenceCase = function sandboxSentenceCase(str) {
    return str.length && str.split(" ").reduce(function (full, word) {
      return "".concat(full, " ").concat(word[0].toUpperCase() + word.substring(1));
    }, "").trim();
  };

  var formatTicks = function formatTicks(arr, typeFormat) {
    var formatter = typeFormat === "numeric" ? civicFormat.numeric : typeFormat === "numericShort" ? civicFormat.numericShort : typeFormat === "decimal" ? sandboxDecimalFormat : typeFormat === "percent" ? sandboxPercentFormat : typeFormat === "dollars" ? sandboxMoneyFormat : typeFormat === "year" ? civicFormat.year : typeFormat === "monthYear" ? civicFormat.monthYear : typeFormat === "titleCase" ? startCase : typeFormat === "sentenceCase" ? sandboxSentenceCase : civicFormat.unformatted;
    return arr.map(function (d) {
      return formatter(d);
    });
  };

  var formatType = mapProps.tooltip && mapProps.tooltip.primary && mapProps.tooltip.primary.format ? mapProps.tooltip.primary.format : "numeric";
  var ticksFormatted = formatTicks(ticks, formatType);
  var tickStyle = colorScaleType === "threshold" ? tickNumsThreshold : colorScaleType === "ordinal" ? tickNumsOrdinal : tickNums;
  var legend = mapColorsArr.map(function (d, i) {
    return jsx("div", {
      key: shortid.generate(),
      css: colorBox,
      style: {
        backgroundColor: d
      }
    }, jsx("div", {
      css: tickStyle
    }, jsx("span", null, ticksFormatted[i])));
  });
  return jsx("div", {
    css: legendContainer
  }, legend);
};

SandboxMapLegend.propTypes = {
  data: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
  mapProps: PropTypes.shape({}).isRequired
};
export default SandboxMapLegend;