UNPKG

@massds/mayflower-react

Version:

React versions of Mayflower design system UI components

74 lines (71 loc) 4 kB
"use strict"; exports.__esModule = true; exports["default"] = void 0; var _react = _interopRequireDefault(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _index = _interopRequireDefault(require("../CompHeading/index.js")); var _index2 = _interopRequireDefault(require("../Paragraph/index.js")); var _index3 = _interopRequireDefault(require("../DecorativeLink/index.js")); var _nanoid = _interopRequireDefault(require("nanoid")); function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; } /** * LinkList module. * @module @massds/mayflower-react/LinkList * @requires module:@massds/mayflower-assets/scss/03-organisms/link-list * @requires module:@massds/mayflower-assets/scss/01-atoms/comp-heading * @requires module:@massds/mayflower-assets/scss/01-atoms/decorative-link */ // import child components var LinkList = function LinkList(props) { var compHeading = props.compHeading, description = props.description, stacked = props.stacked, hideBullets = props.hideBullets, links = props.links, more = props.more; var bulletClass = hideBullets ? 'ma__link-list__items--no-bullets' : ''; var length = links.length; var halfLength = Math.ceil(length / 2); return /*#__PURE__*/_react["default"].createElement("section", { className: "ma__link-list" }, compHeading && /*#__PURE__*/_react["default"].createElement(_index["default"], compHeading), description && /*#__PURE__*/_react["default"].createElement(_index2["default"], description), /*#__PURE__*/_react["default"].createElement("div", { className: "ma__link-list__container" }, stacked || length < 4 ? /*#__PURE__*/_react["default"].createElement("ul", { className: "ma__link-list__items " + bulletClass }, links.map(function (link, index) { return /*#__PURE__*/ /* eslint-disable-next-line react/no-array-index-key */_react["default"].createElement("li", { className: "ma__link-list__item", key: index }, /*#__PURE__*/_react["default"].createElement(_index3["default"], link)); })) : /*#__PURE__*/_react["default"].createElement("ul", { className: "ma__link-list__items ma__link-list__items_columns " + bulletClass }, links.slice(0, halfLength).map(function (link, index) { return /*#__PURE__*/ /* eslint-disable-next-line react/no-array-index-key */_react["default"].createElement("li", { className: "ma__link-list__item item-left", key: index }, /*#__PURE__*/_react["default"].createElement(_index3["default"], link)); }), links.slice(halfLength, length).map(function (link) { return /*#__PURE__*/ /* eslint-disable-next-line react/no-array-index-key */_react["default"].createElement("li", { className: "ma__link-list__item item-right", key: (0, _nanoid["default"])() }, /*#__PURE__*/_react["default"].createElement(_index3["default"], link)); }))), /*#__PURE__*/_react["default"].createElement("div", { className: "ma__link-list__see-all" }, more && /*#__PURE__*/_react["default"].createElement(_index3["default"], more))); }; LinkList.propTypes = process.env.NODE_ENV !== "production" ? { /** `@atoms/headings/CompHeading` */ compHeading: _propTypes["default"].shape(_index["default"].PropTypes), /** short description rendered below the heading, note that this version renders `@atoms/text/Paragraph` instead of rich text */ description: _propTypes["default"].shape(_index2["default"].PropTypes), /** Render links as a stacked list instead of two columns */ stacked: _propTypes["default"].bool, /** Hide bullets for the list of links */ hideBullets: _propTypes["default"].bool, /** List of links rendered */ links: _propTypes["default"].arrayOf(_propTypes["default"].shape(_index3["default"].PropTypes)).isRequired, /** `@atoms/DecorativeLink` as see all link */ more: _propTypes["default"].shape(_index3["default"].PropTypes) } : {}; var _default = exports["default"] = LinkList; module.exports = exports.default;