hbp-quickfire
Version:
A library of useful user-interface components built with React on top of React Bootstrap and MobX
58 lines (42 loc) • 13.3 kB
JavaScript
var _extends = Object.assign || function (target) {for (var i = 1; i < arguments.length; i++) {var source = arguments[i];for (var key in source) {if (Object.prototype.hasOwnProperty.call(source, key)) {target[key] = source[key];}}}return target;};var _createClass = function () {function defineProperties(target, props) {for (var i = 0; i < props.length; i++) {var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor);}}return function (Constructor, protoProps, staticProps) {if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor;};}();var _class, _class2, _temp;function _classCallCheck(instance, Constructor) {if (!(instance instanceof Constructor)) {throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self, call) {if (!self) {throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call && (typeof call === "object" || typeof call === "function") ? call : self;}function _inherits(subClass, superClass) {if (typeof superClass !== "function" && superClass !== null) {throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);}subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;} /*
* Copyright (c) Human Brain Project
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from "react";import PanelGroup from "react-bootstrap/lib/PanelGroup";import uniqueId from "lodash/uniqueId";import isNumber from "lodash/isNumber";import isString from "lodash/isString";
import { observer } from "mobx-react";
import GenericListItem from "./GenericListItem";
/**
* Generic List component that renders a list of items using Bootstrap Panels
* @class GenericList
* @property {array} items required - an array of items to be displayed in the list. Can be an array of primitives or objects
* @property {boolean} expanded optional - if the panel is expanded by default
* @property {object} itemTitle optional - react component to render the title for individual items. Gets passed the item to be rendered as a prop. Default value: ({ item }) => item
* @property {boolean} itemBody optional - react component to render the body for individual items. Gets passed the item to be rendered as a prop. Only necessary if you want a body to be displayed
* @property {array} actions required - an array of actions. An actions can be any react components that get rendered in the top right corner of the panel. For callback, implement the onClick which gets called with the selected item.
*/var
GenericList = observer(_class = (_temp = _class2 = function (_React$Component) {_inherits(GenericList, _React$Component);
function GenericList(props) {_classCallCheck(this, GenericList);var _this = _possibleConstructorReturn(this, (GenericList.__proto__ || Object.getPrototypeOf(GenericList)).call(this,
props));
_this.itemsMap = new Map();return _this;
}_createClass(GenericList, [{ key: "getItemKey", value: function getItemKey(
item) {
if (isNumber(item) || isString(item)) {
return uniqueId("item_");
}
if (!this.itemsMap.get(item)) {
var key = uniqueId("item_");
this.itemsMap.set(item, key);
return key;
}
return this.itemsMap.get(item);
} }, { key: "render", value: function render()
{var _this2 = this;
return (
React.createElement(PanelGroup, { id: "list", className: "quickfire-generic-list" },
this.props.items.map(function (item) {
var key = _this2.getItemKey(item);
return React.createElement(GenericListItem, _extends({}, _this2.props, { key: key, item: item }));
})));
} }]);return GenericList;}(React.Component), _class2.defaultProps = { itemTitle: function itemTitle(_ref) {var item = _ref.item;return item;}, actions: [], items: [], expanded: false }, _temp)) || _class;export { GenericList as default };