"use strict";

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

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

var _classnames = _interopRequireDefault(require("classnames"));

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

var defaultSymbol = /*#__PURE__*/_react.default.createElement("svg", {
  height: "1em",
  width: "1em",
  className: "oec-legend__symbol__svg"
}, /*#__PURE__*/_react.default.createElement("rect", {
  width: "100%",
  height: "100%",
  fill: "currentColor"
}));

function Legend(_ref) {
  var items = _ref.items,
      _ref$vertical = _ref.vertical,
      vertical = _ref$vertical === void 0 ? false : _ref$vertical;
  return /*#__PURE__*/_react.default.createElement("ul", {
    className: (0, _classnames.default)('margin-y-2 oec-legend add-list-reset', {
      'grid-col': vertical,
      'grid-row grid-gap': !vertical
    })
  }, items.filter(function (item) {
    return !item.hidden;
  }).map(function (item, index) {
    return /*#__PURE__*/_react.default.createElement("li", {
      key: index,
      className: (0, _classnames.default)('oec-legend__item oec-legend-item', {
        'margin-y-1': vertical,
        'margin-right-1': !vertical
      })
    }, /*#__PURE__*/_react.default.createElement("div", {
      className: "oec-legend-item__symbol ".concat(item.symbolClass)
    }, item.symbol || defaultSymbol), /*#__PURE__*/_react.default.createElement("div", {
      className: "oec-legend-item__text width-fit-content display-inline margin-left-1 ".concat(item.textClass || '')
    }, item.text));
  }));
}