'use strict';

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

var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var index = require('../../utils/index.js');
var BreadcrumbShorter_styles = require('./BreadcrumbShorter.styles.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

var BreadcrumbShorter = function BreadcrumbShorter(_ref) {
  var children = _ref.children,
    separator = _ref.separator;
  var _useState = React.useState(false),
    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
    openShorter = _useState2[0],
    setOpenShorter = _useState2[1];
  var renderItems = index.addSeparator(children, separator);
  var onKeyPress = function onKeyPress(event) {
    event.persist();
    if (event.keyCode === 13) {
      setOpenShorter(true);
    }
  };
  return /*#__PURE__*/React__default.default.createElement(BreadcrumbShorter_styles.StyledRoot, null, !openShorter && /*#__PURE__*/React__default.default.createElement(BreadcrumbShorter_styles.StyledShorter, {
    tabIndex: 0,
    onClick: function onClick() {
      return setOpenShorter(true);
    },
    onKeyDown: onKeyPress
  }, "..."), openShorter && /*#__PURE__*/React__default.default.createElement(BreadcrumbShorter_styles.StyledHidden, null, renderItems.map(function (item) {
    return item;
  })));
};

exports.BreadcrumbShorter = BreadcrumbShorter;
