"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Chip = Chip;
exports.Resource = Resource;
exports.MetadataQuestion = MetadataQuestion;
exports.CollapsableSection = CollapsableSection;

var _core = require("@emotion/core");

var _react = require("react");

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

var _lodash = _interopRequireDefault(require("lodash"));

var _Collapsable = _interopRequireDefault(require("../Collapsable/Collapsable"));

var _VisualizationColors = _interopRequireDefault(require("../_Themes/VisualizationColors"));

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

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  display: inline-block;\n  padding: 0 2em;\n  height: 2em;\n  line-height: 2em;\n  border-radius: 1em;\n  background-color: ", ";\n  margin: 0.5em 0.5em;\n  font-family: \"Roboto Condensed\", \"Helvetica Neue\", Helvetica, sans-serif;\n  font-weight: bold;\n  color: white;\n  cursor: pointer;\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 victoryColors = _VisualizationColors["default"].victoryColors;

var chipStyle = function chipStyle(index) {
  return (0, _core.css)(_templateObject(), victoryColors[index % victoryColors.length]);
};

function Chip(_ref) {
  var tag = _ref.tag,
      index = _ref.index;
  return (0, _core.jsx)("span", {
    css: chipStyle(index)
  }, "#".concat(tag));
}

Chip.propTypes = {
  tag: _propTypes["default"].string,
  index: _propTypes["default"].number
};

function Resource(_ref2) {
  var section = _ref2.section;
  return (0, _core.jsx)(_react.Fragment, null, (0, _core.jsx)("h3", null, section.heading), (0, _core.jsx)("ul", null, section.items.map(function (item) {
    return (0, _core.jsx)("li", null, (0, _core.jsx)("a", {
      href: item.link
    }, item.description));
  })));
}

Resource.propTypes = {
  section: _propTypes["default"].shape({
    heading: _propTypes["default"].string,
    items: _propTypes["default"].arrayOf(_propTypes["default"].shape({
      link: _propTypes["default"].string,
      description: _propTypes["default"].string
    }))
  })
};

function MetadataQuestion(_ref3) {
  var item = _ref3.item;
  return _lodash["default"].has(item, "section") ? (0, _core.jsx)("h3", null, item.section) : item.answer.length > 0 && (0, _core.jsx)(_react.Fragment, null, (0, _core.jsx)("h4", null, item.question), (0, _core.jsx)("p", null, item.answer));
}

MetadataQuestion.propTypes = {
  item: _propTypes["default"].shape({
    question: _propTypes["default"].string,
    answer: _propTypes["default"].string
  })
};

function CollapsableSection(_ref4) {
  var items = _ref4.items,
      collapseAfter = _ref4.collapseAfter;

  var beforeFold = _lodash["default"].slice(items, 0, collapseAfter);

  var afterFold = _lodash["default"].slice(items, collapseAfter);

  return (afterFold && afterFold.length) > 0 ? (0, _core.jsx)(_Collapsable["default"], null, (0, _core.jsx)(_Collapsable["default"].Section, null, beforeFold), (0, _core.jsx)(_Collapsable["default"].Section, {
    hidden: true
  }, afterFold)) : (0, _core.jsx)(_react.Fragment, null, beforeFold);
}

CollapsableSection.propTypes = {
  items: _propTypes["default"].arrayOf(_propTypes["default"].node),
  collapseAfter: _propTypes["default"].number
};