@codacy/ui-components 0.64.16 → 0.64.17

package/lib/Table/SelectableTable.js

@@ -1,69 +1,71 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSelectableTableContext = exports.SelectableTable = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _Table = require("./Table.styles");
+var _2 = require("../");
+var _lodash = require("lodash");
+var _Table2 = require("./Table");
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["children", "items", "totalLength", "onSelectionChange", "initialValue"],
-    _excluded2 = ["children", "sticky", "stickyOffset"],
-    _excluded3 = ["children", "index", "disabled"];
-import React, { useCallback, useContext, useEffect, useState } from 'react';
-import { TableWrapper, StyledTableHeader, StyledTableHeaderCell, StyledTableBodyCell, StyledTableRow, StyledTable } from './Table.styles';
-import { Checkbox, Caption, Link } from '../';
-import { uniq } from 'lodash';
-import { ColumnsGroup } from './Table';
+  _excluded2 = ["children", "sticky", "stickyOffset"],
+  _excluded3 = ["children", "index", "disabled"];
 var INITIAL_TABLE_STATE = {
   indexes: [],
   multiple: 'none'
 };
-var SelectableTableContext = React.createContext(null);
-
+var SelectableTableContext = /*#__PURE__*/_react["default"].createContext(null);
 var sequentialArray = function sequentialArray(from, to) {
   return new Array(to - from + 1).fill(0).map(function (_, idx) {
     return idx + from;
   });
 };
-
-export var useSelectableTableContext = function useSelectableTableContext() {
-  var context = useContext(SelectableTableContext);
-
+var useSelectableTableContext = exports.useSelectableTableContext = function useSelectableTableContext() {
+  var context = (0, _react.useContext)(SelectableTableContext);
   if (context === null) {
     throw new Error("You are using SelectableTableContext outside it's provider.");
   }
-
   return context;
 };
+
 /**
  * Base selectable table component
  */
-
 function SelectableTableComponent(_ref) {
   var _initialValue$selecte, _initialValue$selecte2;
-
   var children = _ref.children,
-      items = _ref.items,
-      totalLength = _ref.totalLength,
-      onSelectionChange = _ref.onSelectionChange,
-      initialValue = _ref.initialValue,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  var _useState = useState(initialValue ? {
-    indexes: initialValue.selected ? initialValue.selected.map(function (v) {
-      return items.indexOf(v);
-    }) : [],
-    totalLength: totalLength,
-    multiple: initialValue.allSelected ? 'all' : items.length > 0 && ((_initialValue$selecte = initialValue.selected) === null || _initialValue$selecte === void 0 ? void 0 : _initialValue$selecte.length) === items.length ? 'visible' : items.length > 0 && !!((_initialValue$selecte2 = initialValue.selected) === null || _initialValue$selecte2 === void 0 ? void 0 : _initialValue$selecte2.length) ? 'partial' : 'none'
-  } : INITIAL_TABLE_STATE),
-      _useState2 = _slicedToArray(_useState, 2),
-      selected = _useState2[0],
-      setSelected = _useState2[1];
-
-  var add = useCallback(function (idxFrom, idxTo) {
+    items = _ref.items,
+    totalLength = _ref.totalLength,
+    onSelectionChange = _ref.onSelectionChange,
+    initialValue = _ref.initialValue,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var _useState = (0, _react.useState)(initialValue ? {
+      indexes: initialValue.selected ? initialValue.selected.map(function (v) {
+        return items.indexOf(v);
+      }) : [],
+      totalLength: totalLength,
+      multiple: initialValue.allSelected ? 'all' : items.length > 0 && ((_initialValue$selecte = initialValue.selected) === null || _initialValue$selecte === void 0 ? void 0 : _initialValue$selecte.length) === items.length ? 'visible' : items.length > 0 && !!((_initialValue$selecte2 = initialValue.selected) !== null && _initialValue$selecte2 !== void 0 && _initialValue$selecte2.length) ? 'partial' : 'none'
+    } : INITIAL_TABLE_STATE),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    selected = _useState2[0],
+    setSelected = _useState2[1];
+  var add = (0, _react.useCallback)(function (idxFrom, idxTo) {
     if (idxTo !== undefined && idxTo !== idxFrom) {
       var from = Math.min(idxFrom, idxTo);
       var to = Math.max(idxFrom, idxTo);
       var rangeToAdd = sequentialArray(from, to);
       setSelected(function (_ref2) {
         var indexes = _ref2.indexes;
-        var newIndexes = uniq([].concat(_toConsumableArray(indexes), _toConsumableArray(rangeToAdd))).sort();
+        var newIndexes = (0, _lodash.uniq)([].concat((0, _toConsumableArray2["default"])(indexes), (0, _toConsumableArray2["default"])(rangeToAdd))).sort();
         return {
           indexes: newIndexes,
           multiple: newIndexes.length === totalLength ? 'all' : newIndexes.length === items.length ? 'visible' : 'partial',
@@ -75,7 +77,7 @@ function SelectableTableComponent(_ref) {
     } else {
       setSelected(function (_ref3) {
         var indexes = _ref3.indexes;
-        var newIndexes = !indexes.includes(idxFrom) ? [].concat(_toConsumableArray(indexes), [idxFrom]).sort() : indexes;
+        var newIndexes = !indexes.includes(idxFrom) ? [].concat((0, _toConsumableArray2["default"])(indexes), [idxFrom]).sort() : indexes;
         return {
           indexes: newIndexes,
           multiple: newIndexes.length === totalLength ? 'all' : newIndexes.length === items.length ? 'visible' : 'partial',
@@ -86,14 +88,13 @@ function SelectableTableComponent(_ref) {
       });
     }
   }, [items.length, totalLength]);
-  var remove = useCallback(function (idxFrom, idxTo) {
+  var remove = (0, _react.useCallback)(function (idxFrom, idxTo) {
     var response = {
       indexes: [],
       lastAction: 'remove',
       lastIndex: idxFrom,
       totalLength: totalLength
     };
-
     if (idxTo !== undefined && idxTo !== idxFrom) {
       var from = Math.min(idxFrom, idxTo);
       var to = Math.max(idxFrom, idxTo);
@@ -103,7 +104,7 @@ function SelectableTableComponent(_ref) {
         var newIndexes = indexes.filter(function (i) {
           return !rangeToRemove.includes(i);
         });
-        return _objectSpread(_objectSpread({}, response), {}, {
+        return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, response), {}, {
           indexes: newIndexes,
           multiple: newIndexes.length ? 'partial' : 'none'
         });
@@ -111,138 +112,157 @@ function SelectableTableComponent(_ref) {
     } else {
       setSelected(function (_ref5) {
         var indexes = _ref5.indexes,
-            multiple = _ref5.multiple;
+          multiple = _ref5.multiple;
         var realIndexes = multiple === 'visible' || multiple === 'all' ? sequentialArray(0, items.length - 1) : indexes;
         var newIndexes = realIndexes.includes(idxFrom) ? realIndexes.filter(function (i) {
           return i !== idxFrom;
         }) : realIndexes;
-        return _objectSpread(_objectSpread({}, response), {}, {
+        return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, response), {}, {
           indexes: newIndexes,
           multiple: newIndexes.length ? 'partial' : 'none'
         });
       });
     }
   }, [items.length, totalLength]);
-  var selectAllVisible = useCallback(function () {
+  var selectAllVisible = (0, _react.useCallback)(function () {
     setSelected({
       indexes: [],
       multiple: 'visible',
       totalLength: totalLength
     });
   }, [totalLength]);
-  var selectAll = useCallback(function () {
+  var selectAll = (0, _react.useCallback)(function () {
     setSelected({
       indexes: [],
       multiple: 'all',
       totalLength: totalLength
     });
   }, [totalLength]);
-  var clearSelection = useCallback(function () {
+  var clearSelection = (0, _react.useCallback)(function () {
     setSelected({
       indexes: [],
       multiple: 'none'
     });
   }, []);
-  useEffect(function () {
+  (0, _react.useEffect)(function () {
     if (onSelectionChange) {
-      onSelectionChange(selected.multiple === 'visible' ? _toConsumableArray(items) : selected.indexes.map(function (idx) {
+      onSelectionChange(selected.multiple === 'visible' ? (0, _toConsumableArray2["default"])(items) : selected.indexes.map(function (idx) {
         return items[idx];
       }), selected.multiple === 'all');
     }
   }, [selected, items, onSelectionChange]);
-  return /*#__PURE__*/React.createElement(TableWrapper, props, /*#__PURE__*/React.createElement(SelectableTableContext.Provider, {
-    value: _objectSpread(_objectSpread({}, selected), {}, {
-      itemsLength: items.length,
-      add: add,
-      remove: remove,
-      selectAllVisible: selectAllVisible,
-      selectAll: selectAll,
-      clearSelection: clearSelection
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.TableWrapper, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectableTableContext.Provider, {
+      value: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, selected), {}, {
+        itemsLength: items.length,
+        add: add,
+        remove: remove,
+        selectAllVisible: selectAllVisible,
+        selectAll: selectAll,
+        clearSelection: clearSelection
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.StyledTable, {
+        children: children
+      })
     })
-  }, /*#__PURE__*/React.createElement(StyledTable, null, children)));
+  }));
 }
-
 var Header = function Header(_ref6) {
   var children = _ref6.children,
-      _ref6$sticky = _ref6.sticky,
-      sticky = _ref6$sticky === void 0 ? false : _ref6$sticky,
-      _ref6$stickyOffset = _ref6.stickyOffset,
-      stickyOffset = _ref6$stickyOffset === void 0 ? '0' : _ref6$stickyOffset,
-      props = _objectWithoutProperties(_ref6, _excluded2);
-
+    _ref6$sticky = _ref6.sticky,
+    sticky = _ref6$sticky === void 0 ? false : _ref6$sticky,
+    _ref6$stickyOffset = _ref6.stickyOffset,
+    stickyOffset = _ref6$stickyOffset === void 0 ? '0' : _ref6$stickyOffset,
+    props = (0, _objectWithoutProperties2["default"])(_ref6, _excluded2);
   var selection = useSelectableTableContext();
   var selectStatus = selection.multiple === 'none' ? false : selection.multiple === 'partial' ? 'indeterminate' : true;
-  var handleSelectChange = useCallback(function (checked) {
+  var handleSelectChange = (0, _react.useCallback)(function (checked) {
     if (checked) selection.selectAllVisible();else selection.clearSelection();
   }, [selection]);
   var hasMoreRows = !!selection.totalLength && selection.totalLength > selection.itemsLength;
   var selectedVisibleWithMoreRows = selection.multiple === 'visible' && hasMoreRows;
   var selectedAllWithMoreRows = selection.multiple === 'all' && hasMoreRows;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ColumnsGroup, null, /*#__PURE__*/React.createElement(StyledTableHeaderCell, {
-    width: "3.25rem"
-  }), children), /*#__PURE__*/React.createElement(StyledTableHeader, Object.assign({
-    sticky: sticky,
-    stickyOffset: stickyOffset
-  }, props), /*#__PURE__*/React.createElement(StyledTableRow, null, /*#__PURE__*/React.createElement(StyledTableHeaderCell, {
-    totalizer: selectedVisibleWithMoreRows || selectedAllWithMoreRows
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    size: "sm",
-    onChange: handleSelectChange,
-    checked: selectStatus,
-    className: "th-checkbox"
-  })), selectedVisibleWithMoreRows ? /*#__PURE__*/React.createElement(StyledTableHeaderCell, {
-    align: "left",
-    totalizer: true,
-    colSpan: React.Children.count(children)
-  }, /*#__PURE__*/React.createElement(Caption, {
-    mr: 4,
-    as: "span",
-    size: "md"
-  }, selection.itemsLength, " selected"), /*#__PURE__*/React.createElement(Link, {
-    onClick: selection.selectAll
-  }, "Select all ", selection.totalLength, " instead")) : selectedAllWithMoreRows ? /*#__PURE__*/React.createElement(StyledTableHeaderCell, {
-    align: "left",
-    totalizer: true,
-    colSpan: React.Children.count(children)
-  }, /*#__PURE__*/React.createElement(Caption, {
-    mr: 4,
-    as: "span",
-    size: "md"
-  }, "All ", selection.totalLength, " selected"), /*#__PURE__*/React.createElement(Link, {
-    onClick: selection.clearSelection
-  }, "Clear selection")) : children)));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table2.ColumnsGroup, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.StyledTableHeaderCell, {
+        width: "3.25rem"
+      }), children]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.StyledTableHeader, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+      sticky: sticky,
+      stickyOffset: stickyOffset
+    }, props), {}, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table.StyledTableRow, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.StyledTableHeaderCell, {
+          totalizer: selectedVisibleWithMoreRows || selectedAllWithMoreRows,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_2.Checkbox, {
+            size: "sm",
+            onChange: handleSelectChange,
+            checked: selectStatus,
+            className: "th-checkbox"
+          })
+        }), selectedVisibleWithMoreRows ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table.StyledTableHeaderCell, {
+          align: "left",
+          totalizer: true,
+          colSpan: _react["default"].Children.count(children),
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_2.Caption, {
+            mr: 4,
+            as: "span",
+            size: "md",
+            children: [selection.itemsLength, " selected"]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_2.Link, {
+            onClick: selection.selectAll,
+            children: ["Select all ", selection.totalLength, " instead"]
+          })]
+        }) : selectedAllWithMoreRows ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table.StyledTableHeaderCell, {
+          align: "left",
+          totalizer: true,
+          colSpan: _react["default"].Children.count(children),
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_2.Caption, {
+            mr: 4,
+            as: "span",
+            size: "md",
+            children: ["All ", selection.totalLength, " selected"]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_2.Link, {
+            onClick: selection.clearSelection,
+            children: "Clear selection"
+          })]
+        }) : children]
+      })
+    }))]
+  });
 };
-
 var Row = function Row(_ref7) {
   var children = _ref7.children,
-      index = _ref7.index,
-      _ref7$disabled = _ref7.disabled,
-      disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
-      props = _objectWithoutProperties(_ref7, _excluded3);
-
+    index = _ref7.index,
+    _ref7$disabled = _ref7.disabled,
+    disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
+    props = (0, _objectWithoutProperties2["default"])(_ref7, _excluded3);
   var selection = useSelectableTableContext();
-  var handleSelectChange = useCallback(function (checked, event) {
-    if ((event === null || event === void 0 ? void 0 : event.shiftKey) && selection.lastAction) {
+  var handleSelectChange = (0, _react.useCallback)(function (checked, event) {
+    if (event !== null && event !== void 0 && event.shiftKey && selection.lastAction) {
       if (selection.lastAction === 'add') selection.add(index, selection.lastIndex);else selection.remove(index, selection.lastIndex);
     } else {
       if (checked) selection.add(index);else selection.remove(index);
     }
   }, [selection, index]);
   var isSelected = selection.multiple === 'all' || selection.multiple === 'visible' || selection.indexes.includes(index);
-  return /*#__PURE__*/React.createElement(StyledTableRow, props, /*#__PURE__*/React.createElement(StyledTableBodyCell, null, /*#__PURE__*/React.createElement(Checkbox, {
-    size: "sm",
-    onChange: handleSelectChange,
-    checked: !disabled && isSelected,
-    disabled: disabled,
-    className: "tr-checkbox"
-  })), children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Table.StyledTableRow, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.StyledTableBodyCell, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_2.Checkbox, {
+        size: "sm",
+        onChange: handleSelectChange,
+        checked: !disabled && isSelected,
+        disabled: disabled,
+        className: "tr-checkbox"
+      })
+    }), children]
+  }));
 };
+
 /**
  * @deprecated Use the NewSelectableTable instead.
  */
-
-
-export var SelectableTable = Object.assign(SelectableTableComponent, {
+var SelectableTable = exports.SelectableTable = Object.assign(SelectableTableComponent, {
   Header: Header,
   Row: Row
 });