'use strict';

var _extends = require('./extends-7c86182f.js');
var keys = require('./keys-e982b3fa.js');
var toConsumableArray = require('./toConsumableArray-d7797c2b.js');
var React = require('react');
require('./_commonjsHelpers-06173234.js');
require('./core.get-iterator-method-5643aa10.js');
require('./_object-pie-083f2dd6.js');
require('./_object-sap-d1978572.js');
require('./_iter-detect-b1df62f0.js');

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

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

var sortByName = function sortByName(arr) {
  var items = [].concat(toConsumableArray._toConsumableArray(arr));
  items.sort(function (a, b) {
    var nameA = a.name.toUpperCase();
    var nameB = b.name.toUpperCase();
    if (nameA < nameB) {
      return -1;
    }
    if (nameA > nameB) {
      return 1;
    }
    return 0;
  });
  return items;
};

var AlphabeticList = function AlphabeticList(_ref) {
  var _ref$dataRecord = _ref.dataRecord,
      dataRecord = _ref$dataRecord === undefined ? [] : _ref$dataRecord;

  var dataList = {};
  if (dataRecord && dataRecord.length > 0) {
    var sortedData = sortByName(dataRecord);
    sortedData.forEach(function (item) {
      var firstLetter = item.name.charAt(0).toUpperCase();
      if (!dataList[firstLetter]) {
        dataList[firstLetter] = [];
      }
      dataList[firstLetter].push(item);
    });
  }

  var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'.split('');
  var itemsRef = React.useRef([]);

  var renderAlbhabetList = function renderAlbhabetList() {
    var style = {
      fontWeight: '600',
      fontSize: '30px',
      textDecoration: 'none',
      padding: '0 10px',
      color: 'grey'
    };
    return React__default['default'].createElement(
      'div',
      { className: 'd-flex flex-wrap mb-3' },
      alphabet.map(function (letter, i) {
        if (dataList[letter]) {
          return React__default['default'].createElement(
            'a',
            {
              key: i,
              onClick: function onClick() {
                var index = keys._Object$keys(dataList).findIndex(function (i) {
                  return i === letter;
                });
                if (itemsRef.current && itemsRef.current[index]) {
                  window.scrollTo(0, itemsRef.current[index].offsetTop);
                }
              } },
            React__default['default'].createElement(
              'span',
              {
                style: _extends._extends({}, style, {
                  color: 'black'
                }) },
              letter
            )
          );
        }
        return React__default['default'].createElement(
          'span',
          { key: i, style: style },
          letter
        );
      })
    );
  };

  React.useEffect(function () {
    itemsRef.current = itemsRef.current.slice(0, keys._Object$keys(dataList).length);
  }, [dataList]);

  return React__default['default'].createElement(
    React__default['default'].Fragment,
    null,
    renderAlbhabetList(),
    keys._Object$keys(dataList).map(function (letter, index) {
      return React__default['default'].createElement(
        React__default['default'].Fragment,
        { key: index },
        React__default['default'].createElement(
          'h3',
          { ref: function ref(el) {
              return itemsRef.current[index] = el;
            } },
          letter
        ),
        React__default['default'].createElement(
          'ul',
          null,
          dataList[letter].map(function (item, i) {
            return React__default['default'].createElement(
              'li',
              { key: i },
              React__default['default'].createElement(
                'a',
                { href: item.url },
                item.name
              )
            );
          })
        )
      );
    })
  );
};

module.exports = AlphabeticList;
