@hackoregon/component-library/dist/SimpleLegend/SimpleLegend.js

Official repo for Hack Oregon React component library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _propTypes = _interopRequireDefault(require("prop-types"));

var _react = _interopRequireDefault(require("react"));

var _emotion = require("emotion");

var _VictoryThemeIndex = _interopRequireDefault(require("../VictoryTheme/VictoryThemeIndex"));

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

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n                margin-left: 5px;\n              "]);

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

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n              margin-left: 10px;\n            "]);

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

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica, sans-serif;\n    font-size: 14px;\n    font-weight: bold;\n    text-align: center;\n    margin: 10px 0 0 0;\n\n    @media (max-width: 640px) {\n      text-align: left;\n    }\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) } })); }

var SimpleLegend = function SimpleLegend(_ref) {
  var colorScale = _ref.colorScale,
      legendData = _ref.legendData;
  var legendStyle = (0, _emotion.css)(_templateObject());
  var colorMap = colorScale || _VictoryThemeIndex["default"].civic.group.colorScale;

  if (legendData.length) {
    return _react["default"].createElement("div", {
      className: legendStyle
    }, legendData.map(function (group, idx) {
      return _react["default"].createElement("span", {
        key: group.name,
        className: (0, _emotion.css)(_templateObject2())
      }, _react["default"].createElement("svg", {
        viewBox: "0 0 10 10",
        width: "10px"
      }, _react["default"].createElement("circle", {
        cx: "5",
        cy: "5",
        r: "5",
        fill: colorMap[idx]
      })), _react["default"].createElement("span", {
        className: (0, _emotion.css)(_templateObject3())
      }, group.name));
    }));
  }

  return null;
};

SimpleLegend.propTypes = {
  colorScale: _propTypes["default"].arrayOf(_propTypes["default"].string),
  legendData: _propTypes["default"].arrayOf(_propTypes["default"].shape({
    name: _propTypes["default"].string
  }))
};
SimpleLegend.defaultProps = {
  colorScale: null,
  legendData: null
};
var _default = SimpleLegend;
exports["default"] = _default;