backpack-ui/dist/components/contentSectionList/index.js

Lonely Planet's Components

"use strict";

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

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

var _font = require("../../utils/font");

var _font2 = _interopRequireDefault(_font);

var _contentHeader = require("../contentHeader");

var _contentHeader2 = _interopRequireDefault(_contentHeader);

var _heading = require("../heading");

var _heading2 = _interopRequireDefault(_heading);

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

var styles = {
  list: {
    base: {
      fontFamily: (0, _font2.default)("miller"),
      fontSize: "20px",
      lineHeight: 36 / 20,
      marginLeft: "20px"
    }
  }
};

function ContentSectionList(_ref) {
  var header = _ref.header;
  var listItems = _ref.listItems;

  var isListItemsString = typeof listItems === "string";

  return _react2.default.createElement(
    "section",
    { className: "ContentSection" },
    header && header.title && _react2.default.createElement(_contentHeader2.default, header),
    listItems && _react2.default.createElement(
      "ul",
      { style: styles.list.base },
      !isListItemsString && listItems.map(function (item, index) {
        return _react2.default.createElement(
          "li",
          { key: index },
          item
        );
      }),
      isListItemsString && _react2.default.createElement(
        "li",
        null,
        listItems
      )
    )
  );
}

ContentSectionList.propTypes = {
  /**
   * Props for ContentHeader
   */
  header: _react2.default.PropTypes.shape({
    title: _react2.default.PropTypes.string,
    heading: _react2.default.PropTypes.shape(_heading2.default.propTypes),
    border: _react2.default.PropTypes.oneOf(["", "top", "bottom"])
  }).isRequired,

  /**
   * List item(s) to display
   */
  listItems: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.arrayOf(_react2.default.PropTypes.string)]).isRequired
};

ContentSectionList.defaultProps = {
  header: {
    title: "",
    heading: {},
    border: ""
  },

  listItems: ""
};

exports.default = ContentSectionList;