@hackoregon/component-library
Version:
Official repo for Hack Oregon React component library
96 lines (72 loc) • 3.36 kB
JavaScript
;
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 _CivicVictoryTheme = _interopRequireDefault(require("../VictoryTheme/CivicVictoryTheme"));
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 chipStyle = function chipStyle(index) {
return (0, _core.css)(_templateObject(), _CivicVictoryTheme["default"].group.colorScale[index % _CivicVictoryTheme["default"].group.colorScale.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 item = _ref2.item;
return _lodash["default"].has(item, "section") ? (0, _core.jsx)("h3", null, item.section) : (0, _core.jsx)("li", null, (0, _core.jsx)("a", {
href: item.link
}, item.description));
}
Resource.propTypes = {
item: _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
};