@mjhls/mjh-framework 1.0.444 → 1.0.446

package/dist/cjs/AlphabeticList.js

@@ -0,0 +1,137 @@
+'use strict';
+
+require('./_commonjsHelpers-06173234.js');
+require('./_to-object-329a650b.js');
+require('./core.get-iterator-method-41e87ec1.js');
+require('./_iter-detect-4d0352f8.js');
+require('./from-ea347372.js');
+var toConsumableArray = require('./toConsumableArray-ca04303b.js');
+require('./_object-pie-68c5bcbc.js');
+var _extends = require('./extends-60837c34.js');
+require('./_object-sap-5e74ba08.js');
+var React = require('react');
+var keys = require('./keys-a586b7a0.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;