"use strict";

exports.__esModule = true;
exports.default = void 0;

require("core-js/modules/es6.string.fixed");

require("core-js/modules/es6.string.anchor");

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

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

function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }

var Topbar =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(Topbar, _React$Component);

  function Topbar() {
    var _this;

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
    _this.state = {
      isMobileOpen: false,
      activeIndex: null,
      focus: 0
    };

    _this.getChildContext = function () {
      return {
        activeIndex: _this.state.activeIndex,
        onActivate: function onActivate(index) {
          return _this.setSelected(index);
        },
        onFocus: function onFocus(index) {
          return _this.setState(function () {
            return {
              focus: index
            };
          });
        },
        focus: _this.state.focus
      };
    };

    _this.setSelected = function (index) {
      if (index === _this.state.activeIndex) return;

      _this.setState(function () {
        return {
          activeIndex: index
        };
      });
    };

    return _this;
  }

  var _proto = Topbar.prototype;

  _proto.render = function render() {
    var _this2 = this;

    var _this$props = this.props,
        anchor = _this$props.anchor,
        brandAnchorElement = _this$props.brandAnchorElement,
        color = _this$props.color,
        fixed = _this$props.fixed,
        icon = _this$props.icon,
        image = _this$props.image,
        title = _this$props.title;
    var cuiTopBarClass = 'cui-top-bar';
    var cuiBrandClass = 'cui-brand';
    var brandNodeChildren = [_react.default.createElement("div", {
      className: cuiBrandClass + "__logo",
      key: cuiBrandClass + "__logo"
    }, image ? image : _react.default.createElement("i", {
      className: "icon " + icon
    })), _react.default.createElement("div", {
      className: cuiBrandClass + "__title",
      key: cuiBrandClass + "__title"
    }, title)];

    var getBrandAnchor = function getBrandAnchor() {
      return brandAnchorElement ? _react.default.cloneElement(brandAnchorElement, {
        className: "" + cuiBrandClass + ("" + (brandAnchorElement.props.className && " " + brandAnchorElement.props.className || ''))
      }, brandNodeChildren) : _react.default.createElement("a", {
        className: cuiBrandClass,
        href: anchor
      }, brandNodeChildren);
    };

    var brandNode = _react.default.createElement("div", {
      className: cuiTopBarClass + "__brand"
    }, getBrandAnchor());

    var injectChildren = _react.default.Children.map(this.props.children, function (child) {
      if (child.type.displayName === 'TopbarMobile') {
        return _react.default.cloneElement(child, {
          brandNode: brandNode
        });
      } else {
        return child;
      }
    });

    return _react.default.createElement("div", {
      className: "" + cuiTopBarClass + ("" + (fixed && " " + cuiTopBarClass + "--fixed" || '')) + (" " + cuiTopBarClass + "--" + color),
      role: "navigation",
      ref: function ref(_ref) {
        _this2.parentContainer = _ref;
      }
    }, _react.default.createElement("div", {
      className: cuiTopBarClass + "__container"
    }, brandNode, injectChildren));
  };

  return Topbar;
}(_react.default.Component);

Topbar.displayName = 'Topbar';
Topbar.childContextTypes = {
  focus: _propTypes.default.number,
  activeIndex: _propTypes.default.number,
  onActivate: _propTypes.default.func,
  onFocus: _propTypes.default.func
};
Topbar.propTypes = {
  /** App Url/Link (String) */
  anchor: _propTypes.default.string,

  /** Custom Node to wrap (Element) */
  brandAnchorElement: _propTypes.default.element,

  /** Title Text (String or Template) */
  title: _propTypes.default.string,

  /** Icon Class (String or Template) */
  icon: _propTypes.default.string,

  /** Image Source URL (String or Template) */
  image: _propTypes.default.node,

  /** Header Color (String) */
  color: _propTypes.default.string,

  /** Top-bar fixed to top (Boolean) */
  fixed: _propTypes.default.bool,

  /** children prop */
  children: _propTypes.default.node,

  /** HTML Class for Top Bar */
  className: _propTypes.default.string
};
Topbar.defaultProps = {
  anchor: null,
  brandAnchorElement: null,
  children: null,
  className: '',
  color: 'dark',
  fixed: false,
  icon: 'icon-cisco-logo',
  image: null,
  title: ''
};
var _default = Topbar;
exports.default = _default;