sc-react-ions/lib/components/Nav/Nav.js

An open source set of React components that implement Ambassador's Design and UX patterns.

'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _Node = require('./Node');

var _Node2 = _interopRequireDefault(_Node);

var _style = require('./style.scss');

var _style2 = _interopRequireDefault(_style);

var _bind = require('classnames/bind');

var _bind2 = _interopRequireDefault(_bind);

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

var Nav = function Nav(props) {
  var cx = _bind2.default.bind(_style2.default);
  var navClasses = cx(_style2.default.nav, props.optClass);

  var nodes = props.data.map(function (item, index) {
    return _react2.default.createElement(_Node2.default, { node: item, children: item.nav, key: index });
  });

  return _react2.default.createElement(
    'div',
    { role: 'nav', className: navClasses },
    _react2.default.createElement(
      'ul',
      null,
      nodes
    )
  );
};

Nav.propTypes = {
  /**
   * List of navigation items (see code sample)
   */
  data: _propTypes2.default.array.isRequired,
  /**
   * An optional class name to pass along to the nav component.
   */
  optClass: _propTypes2.default.string
};

exports.default = Nav;