'use strict';

require('./_commonjsHelpers-06173234.js');
require('./core.get-iterator-method-f3c44602.js');
require('./web.dom.iterable-e34bf324.js');
var React = require('react');
var slicedToArray = require('./slicedToArray-f6d4eaa8.js');
var Breadcrumb = require('react-bootstrap/Breadcrumb');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var Breadcrumb__default = /*#__PURE__*/_interopDefaultLegacy(Breadcrumb);

var Breadcrumbs = function Breadcrumbs(_ref) {
  var _ref$data = _ref.data,
      data = _ref$data === undefined ? [] : _ref$data,
      _ref$separator = _ref.separator,
      separator = _ref$separator === undefined ? '/' : _ref$separator;

  // To be used on landing pages eg. /news/[url]
  var _useState = React.useState(''),
      _useState2 = slicedToArray._slicedToArray(_useState, 2),
      parentPath = _useState2[0],
      setParentPath = _useState2[1];

  var _useState3 = React.useState(''),
      _useState4 = slicedToArray._slicedToArray(_useState3, 2),
      currentPath = _useState4[0],
      setCurrentPath = _useState4[1];

  var _useState5 = React.useState(''),
      _useState6 = slicedToArray._slicedToArray(_useState5, 2),
      parentPathName = _useState6[0],
      setParentPathName = _useState6[1];

  var get_parent_path = function get_parent_path(parsedUrl) {
    var parent_path = '';
    for (var i = 1; i < parsedUrl.length - 3; i++) {
      if (parsedUrl.length > i + 1) {
        parent_path = '' + parsedUrl[parsedUrl.length - (i + 1)] + (parent_path ? '/' + parent_path : '');
      }
    }

    return parent_path;
  };

  React.useEffect(function () {
    var parsedUrl = window.location.href.split('/');
    setCurrentPath(parsedUrl[parsedUrl.length - 1].split('?')[0]);
    setParentPathName(parsedUrl[parsedUrl.length - 2].split('?')[0]);
    setParentPath(get_parent_path(parsedUrl));
  }, []);

  if (data && data.length > 0) {
    return React__default['default'].createElement(
      Breadcrumb__default['default'],
      null,
      data.map(function (item, index) {
        return React__default['default'].createElement(
          Breadcrumb__default['default'].Item,
          { key: index, href: item.url, active: item.isActive || false },
          item.name
        );
      }),
      React__default['default'].createElement(
        'style',
        { jsx: 'true' },
        '\n          .breadcrumb {\n            background: transparent;\n            padding-left: 0.25rem;\n          }\n          .breadcrumb .breadcrumb-item + .breadcrumb-item::before {\n            content: \'' + separator + '\';\n          }\n          .breadcrumb-item.active {\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n            max-width: 40ch;\n          }\n          @media screen and (max-width: 1400px) {\n            .breadcrumb-item.active {\n              max-width: 20ch;\n            }\n          }\n          @media screen and (max-width: 768px) {\n            .breadcrumb-item.active {\n              max-width: 40ch;\n            }\n          }\n        '
      )
    );
  }

  return React__default['default'].createElement(
    Breadcrumb__default['default'],
    null,
    React__default['default'].createElement(
      Breadcrumb__default['default'].Item,
      { href: '/' },
      'home'
    ),
    parentPath.split('/').length > 1 && React__default['default'].createElement(
      Breadcrumb__default['default'].Item,
      { active: true },
      '...'
    ),
    React__default['default'].createElement(
      Breadcrumb__default['default'].Item,
      { href: '/' + parentPath },
      parentPathName
    ),
    React__default['default'].createElement(
      Breadcrumb__default['default'].Item,
      { active: true },
      currentPath
    ),
    React__default['default'].createElement(
      'style',
      { jsx: 'true' },
      '\n        ol.breadcrumb {\n          background: transparent;\n          padding-left: 0.25rem;\n        }\n        .breadcrumb-item.active {\n          white-space: nowrap;\n          overflow: hidden;\n          text-overflow: ellipsis;\n          max-width: 40ch;\n        }\n        @media screen and (max-width: 1400px) {\n          .breadcrumb-item.active {\n            max-width: 20ch;\n          }\n        }\n        @media screen and (max-width: 768px) {\n          .breadcrumb-item.active {\n            max-width: 40ch;\n          }\n        }\n      '
    )
  );
};

var Breadcrumbs$1 = React__default['default'].memo(Breadcrumbs);

module.exports = Breadcrumbs$1;
