@bigbinary/neetoui
Version:
neetoUI drives the experience at all neeto products
1,098 lines (1,078 loc) • 50.3 kB
JavaScript
import _ConfigProvider from 'antd/lib/config-provider';
import _Table from 'antd/lib/table';
import _extends from '@babel/runtime/helpers/extends';
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default, { useRef, useEffect, useState, useMemo, useCallback } from 'react';
import classnames from 'classnames';
import { isPresent, noop, snakeToCamelCase, camelToSnakeCase, isNotEmpty, modifyBy, dynamicArray } from '@bigbinary/neeto-cist';
import { UpArrow, DownArrow, InfoRound, Left, Right, MenuHorizontal } from '@bigbinary/neeto-icons';
import { isNil, move, isEmpty, all, includes, __, pipe, filter, pluck, equals, has, without, append, props, mergeLeft, assoc } from 'ramda';
import ReactDragListView from 'react-drag-listview';
import { useTranslation } from 'react-i18next';
import { useHistory } from 'react-router-dom';
import { ANTD_LOCALE } from './constants.js';
import '@bigbinary/neeto-hotkeys';
import './overlayManager.js';
import { g as getLocale, a as getFromLocalStorage, r as removeFromLocalStorage, s as setToLocalStorage, h as hyphenize, b as buildUrl, n as noop$1, A as ANT_DESIGN_GLOBAL_TOKEN_OVERRIDES } from './index-Dxaw6gl9.js';
import { u as useQueryParams } from './useQueryParams-b60CHFUx.js';
import Button from './Button.js';
import Callout from './Callout.js';
import Typography from './Typography.js';
import { T as TABLE_SORT_ORDERS, U as URL_SORT_ORDERS, H as HeaderCellMenu, a as TABLE_PAGINATION_HEIGHT, b as TABLE_ROW_HEIGHT, C as COLUMN_FIXED_VALUES, S as SELECT_ALL_ROWS_CALLOUT_MOBILE_HEIGHT, c as SELECT_ALL_ROWS_CALLOUT_DESKTOP_HEIGHT, u as useRestoreScrollPosition, d as TABLE_DEFAULT_HEADER_HEIGHT } from './useRestoreScrollPosition-C1NSANQW.js';
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
import Popover from './Popover.js';
import { Resizable } from 'react-resizable';
import Spinner from './Spinner.js';
import 'antd/locale/de_DE';
import 'antd/locale/en_US';
import 'antd/locale/es_ES';
import 'antd/locale/fr_FR';
import 'antd/locale/nl_NL';
import 'antd/locale/pl_PL';
import 'antd/locale/pt_PT';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import 'qs';
import './en-CIkXIYyl.js';
import 'dayjs';
import 'dayjs/plugin/localeData';
import 'dayjs/plugin/utc';
import 'dayjs/plugin/weekday';
import 'dayjs/plugin/weekOfYear';
import './Tooltip.js';
import '@tippyjs/react';
import 'tippy.js';
import './Dropdown.js';
import 'zustand';
var useTimeout = function useTimeout(callback, delay) {
var savedCallback = useRef(callback);
useEffect(function () {
savedCallback.current = callback;
}, [callback]);
useEffect(function () {
var id = setTimeout(function () {
return savedCallback.current();
}, delay);
return function () {
return clearTimeout(id);
};
}, [delay]);
};
// eslint-disable-next-line @bigbinary/neeto/no-dumb-components-with-use-translation
var AllRowsSelectedCallout = function AllRowsSelectedCallout(_ref) {
var calloutProps = _ref.calloutProps,
onClearSelection = _ref.onClearSelection,
allRowsSelectedMessage = _ref.allRowsSelectedMessage,
clearSelectionButtonLabel = _ref.clearSelectionButtonLabel;
var _useTranslation = useTranslation(),
t = _useTranslation.t,
i18n = _useTranslation.i18n;
return /*#__PURE__*/React__default.createElement(Callout, _extends({
className: "my-2"
}, calloutProps, {
"data-testid": "clear-selections-callout"
}), /*#__PURE__*/React__default.createElement("div", {
className: "neeto-ui-flex neeto-ui-gap-3"
}, /*#__PURE__*/React__default.createElement(Typography, {
style: "body2"
}, allRowsSelectedMessage || getLocale(i18n, t, "neetoui.table.allRowsSelected")), /*#__PURE__*/React__default.createElement(Button, {
"data-testid": "clear-selections-button",
style: "link",
label: clearSelectionButtonLabel || getLocale(i18n, t, "neetoui.table.clearSelection"),
onClick: onClearSelection
})));
};
var SelectAllRowsCallout = function SelectAllRowsCallout(_ref) {
var calloutProps = _ref.calloutProps,
onBulkSelectAllRows = _ref.onBulkSelectAllRows,
selectAllRowButtonLabel = _ref.selectAllRowButtonLabel,
selectAllRowMessage = _ref.selectAllRowMessage;
return /*#__PURE__*/React__default.createElement(Callout, _extends({
className: "my-2"
}, calloutProps, {
"data-testid": "select-all-rows-callout"
}), /*#__PURE__*/React__default.createElement("div", {
className: "neeto-ui-flex neeto-ui-gap-3"
}, /*#__PURE__*/React__default.createElement(Typography, {
style: "body2"
}, selectAllRowMessage), /*#__PURE__*/React__default.createElement(Button, {
"data-testid": "select-all-rows-button",
label: selectAllRowButtonLabel,
style: "link",
onClick: onBulkSelectAllRows
})));
};
var useLocalStorage = function useLocalStorage(key, defaultValue) {
var _useState = useState(function () {
return getFromLocalStorage(key, defaultValue);
}),
_useState2 = _slicedToArray(_useState, 2),
storedValue = _useState2[0],
setStoredValue = _useState2[1];
var setValue = function setValue(value) {
return setStoredValue(function (prevStoredValue) {
var newValue = typeof value === "function" ? value(prevStoredValue) : value;
if (isNil(newValue)) {
removeFromLocalStorage(key);
} else {
setToLocalStorage(key, newValue);
}
return newValue;
});
};
return [storedValue, setValue];
};
var useReorderColumns = function useReorderColumns(_ref) {
var isEnabled = _ref.isEnabled,
columns = _ref.columns,
setColumns = _ref.setColumns,
onColumnUpdate = _ref.onColumnUpdate,
rowSelection = _ref.rowSelection;
if (!isEnabled) return {
dragProps: {},
columns: columns
};
var isColumnFixed = function isColumnFixed(column) {
return !!column.fixed;
};
var dragProps = {
onDragEnd: function onDragEnd(fromIndex, toIndex) {
var from = fromIndex;
var to = toIndex;
if (rowSelection) {
from = fromIndex - 1;
to = toIndex - 1;
}
if (!columns[from] || !columns[to]) return;
if (isColumnFixed(columns[from]) || isColumnFixed(columns[to])) return;
var newColumns = move(from, to, columns);
setColumns(newColumns);
onColumnUpdate(newColumns);
},
nodeSelector: "th:not(.ant-table-cell-fix-left):not(.ant-table-cell-scrollbar)",
handleSelector: ".drag-handler",
ignoreSelector: ".react-resizable-handle"
};
return {
dragProps: dragProps,
columns: columns
};
};
var SortIcon = function SortIcon(_ref) {
var sortOrder = _ref.sortOrder;
if (sortOrder === TABLE_SORT_ORDERS.asc || sortOrder === URL_SORT_ORDERS.ascend) {
return /*#__PURE__*/React__default.createElement(UpArrow, {
size: 14
});
}
if (sortOrder === TABLE_SORT_ORDERS.desc || sortOrder === URL_SORT_ORDERS.descend) {
return /*#__PURE__*/React__default.createElement(DownArrow, {
size: 14
});
}
return null;
};
var _excluded$5 = ["title", "description"];
var TitleWithInfoIcon = function TitleWithInfoIcon(_ref) {
var title = _ref.title,
description = _ref.description,
rest = _objectWithoutProperties(_ref, _excluded$5);
var popoverRef = useRef();
return /*#__PURE__*/React__default.createElement("span", {
className: "relative pr-5"
}, typeof title === "function" ? title(rest) : title, description && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
className: "neeto-ui-table__column-title-info-icon",
ref: popoverRef
}, /*#__PURE__*/React__default.createElement(InfoRound, {
color: "currentColor",
size: 14
})), /*#__PURE__*/React__default.createElement(Popover, {
appendTo: function appendTo() {
return document.body;
},
position: "bottom",
reference: popoverRef
}, /*#__PURE__*/React__default.createElement(Typography, {
lineHeight: "normal",
style: "body2"
}, description))));
};
var TitleWithInfoIcon$1 = /*#__PURE__*/React__default.memo(TitleWithInfoIcon);
var _excluded$4 = ["children", "isSortable", "isAddEnabled", "sortedInfo", "onSort", "isHidable", "isDeletable", "isFixedColumn", "isColumnFreezeEnabled", "onColumnHide", "onAddColumn", "onColumnDelete", "onColumnFreeze", "onMoreActionClick", "column", "moreActions"];
var CellContent = function CellContent(_ref) {
var children = _ref.children,
isSortable = _ref.isSortable,
isAddEnabled = _ref.isAddEnabled,
sortedInfo = _ref.sortedInfo,
onSort = _ref.onSort,
_ref$isHidable = _ref.isHidable,
isHidable = _ref$isHidable === void 0 ? true : _ref$isHidable,
_ref$isDeletable = _ref.isDeletable,
isDeletable = _ref$isDeletable === void 0 ? false : _ref$isDeletable,
isFixedColumn = _ref.isFixedColumn,
isColumnFreezeEnabled = _ref.isColumnFreezeEnabled,
onColumnHide = _ref.onColumnHide,
onAddColumn = _ref.onAddColumn,
onColumnDelete = _ref.onColumnDelete,
onColumnFreeze = _ref.onColumnFreeze,
onMoreActionClick = _ref.onMoreActionClick,
column = _ref.column,
_ref$moreActions = _ref.moreActions,
moreActions = _ref$moreActions === void 0 ? [] : _ref$moreActions,
headerProps = _objectWithoutProperties(_ref, _excluded$4);
var isColumnHidable = isHidable && isPresent(onColumnHide);
var isColumnDeletable = isDeletable && isPresent(onColumnDelete);
var hasMoreActions = !isEmpty(moreActions) && isPresent(onMoreActionClick);
var hasMoreMenu = isSortable || isColumnHidable || isAddEnabled || hasMoreActions || isPresent(column) && isColumnFreezeEnabled;
return /*#__PURE__*/React__default.createElement("th", _extends({}, headerProps, {
title: "",
onClick: isSortable ? noop : headerProps.onClick
}), /*#__PURE__*/React__default.createElement("div", {
className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-between",
"data-cy": "".concat(hyphenize(headerProps.title), "-header-title")
}, /*#__PURE__*/React__default.createElement("div", {
className: "neeto-ui-min-w-0 neeto-ui-flex-grow neeto-ui-truncate neeto-ui-table__column-title-content"
}, children), hasMoreMenu && /*#__PURE__*/React__default.createElement(HeaderCellMenu, {
column: column,
hasMoreActions: hasMoreActions,
isAddEnabled: isAddEnabled,
isColumnDeletable: isColumnDeletable,
isColumnFreezeEnabled: isColumnFreezeEnabled,
isFixedColumn: isFixedColumn,
isSortable: isSortable,
moreActions: moreActions,
onAddColumn: onAddColumn,
onColumnDelete: onColumnDelete,
onColumnFreeze: onColumnFreeze,
onColumnHide: onColumnHide,
onMoreActionClick: onMoreActionClick,
onSort: onSort,
sortedInfo: sortedInfo,
isHidable: isColumnHidable
})));
};
var CellContent$1 = /*#__PURE__*/React__default.memo(CellContent);
var _excluded$3 = ["onResize", "width", "onResizeStop", "className"];
var HeaderCell = function HeaderCell(props) {
var onResize = props.onResize,
width = props.width,
onResizeStop = props.onResizeStop,
className = props.className,
restProps = _objectWithoutProperties(props, _excluded$3);
if (!width) {
return /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, restProps, {
className: classnames(className, "drag-handler")
}));
}
return /*#__PURE__*/React__default.createElement(Resizable, {
onResize: onResize,
onResizeStop: onResizeStop,
width: width,
draggableOpts: {
enableUserSelectHack: false
},
height: 0,
handle: /*#__PURE__*/React__default.createElement("span", {
className: "react-resizable-handle",
onClick: function onClick(e) {
return e.stopPropagation();
}
}),
onResizeStart: function onResizeStart(e) {
e.preventDefault();
}
}, /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, restProps, {
className: classnames(className, "drag-handler")
})));
};
var HeaderCell$1 = /*#__PURE__*/React__default.memo(HeaderCell);
var _excluded$2 = ["onResize", "width", "onResizeStop", "onResizeStart"];
var ResizableHeaderCell = function ResizableHeaderCell(props) {
var onResize = props.onResize,
width = props.width,
_onResizeStop = props.onResizeStop,
_onResizeStart = props.onResizeStart,
restProps = _objectWithoutProperties(props, _excluded$2);
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
isResizing = _useState2[0],
setIsResizing = _useState2[1];
if (!width) {
return /*#__PURE__*/React__default.createElement(CellContent$1, restProps);
}
return /*#__PURE__*/React__default.createElement(Resizable, _defineProperty({
onResize: onResize,
onResizeStop: _onResizeStop,
width: width,
draggableOpts: {
enableUserSelectHack: false
},
height: 0,
handle: /*#__PURE__*/React__default.createElement("span", {
className: classnames("react-resizable-handle", {
"react-resizable-handle--resizing": isResizing
}),
onClick: function onClick(e) {
return e.stopPropagation();
}
}, /*#__PURE__*/React__default.createElement("span", {
className: "neeto-ui-table-react-resizable-handle__inner"
})),
onResizeStart: function onResizeStart(e, data) {
e.preventDefault();
setIsResizing(true);
_onResizeStart === null || _onResizeStart === void 0 || _onResizeStart(e, data);
}
}, "onResizeStop", function onResizeStop(e, data) {
setIsResizing(false);
_onResizeStop === null || _onResizeStop === void 0 || _onResizeStop(e, data);
}), /*#__PURE__*/React__default.createElement(CellContent$1, restProps));
};
var ResizableHeaderCell$1 = /*#__PURE__*/React__default.memo(ResizableHeaderCell);
var _excluded$1 = ["className"];
var ReorderableHeaderCell = function ReorderableHeaderCell(_ref) {
var className = _ref.className,
props = _objectWithoutProperties(_ref, _excluded$1);
return /*#__PURE__*/React__default.createElement(CellContent$1, _extends({}, props, {
className: classnames(className, "drag-handler")
}));
};
var convertLocationPathnameToId = function convertLocationPathnameToId() {
var pathname = decodeURIComponent(window.location.pathname).replace(/^\//, "");
var hash = 0;
for (var i = 0; i < pathname.length; i++) {
var _char = pathname.charCodeAt(i);
hash = (hash << 5) - hash + _char;
hash = hash & hash; // Convert to 32-bit integer
}
return Math.abs(hash).toString(16).toUpperCase();
};
var getHeaderCell = function getHeaderCell(_ref) {
var enableColumnResize = _ref.enableColumnResize,
enableColumnReorder = _ref.enableColumnReorder;
if (enableColumnReorder && enableColumnResize) return {
cell: HeaderCell$1
};
if (enableColumnResize) return {
cell: ResizableHeaderCell$1
};
if (enableColumnReorder) return {
cell: ReorderableHeaderCell
};
return {
cell: CellContent$1
};
};
var isIncludedIn = function isIncludedIn(array1, array2) {
return all(includes(__, array1), array2);
};
var getSelectAllRowsCalloutHeight = function getSelectAllRowsCalloutHeight() {
return window.innerWidth < 768 ? SELECT_ALL_ROWS_CALLOUT_MOBILE_HEIGHT : SELECT_ALL_ROWS_CALLOUT_DESKTOP_HEIGHT;
};
var sortFrozenColumns = function sortFrozenColumns(columnData) {
var originalIndices = new Map(columnData.map(function (col, index) {
return [col.dataIndex, index];
}));
return function (a, b) {
var aFixed = isPresent(a.fixed);
var bFixed = isPresent(b.fixed);
var aIndex = originalIndices.get(a.dataIndex);
var bIndex = originalIndices.get(b.dataIndex);
if (aFixed !== bFixed) return aFixed ? -1 : 1;
return aIndex - bIndex;
};
};
var getFixedColumns = function getFixedColumns(columnData) {
return pipe(filter(function (_ref2) {
var fixed = _ref2.fixed;
return isPresent(fixed);
}), pluck("dataIndex"))(columnData);
};
var getColumnSortOrder = function getColumnSortOrder(col, sortedInfo) {
return equals(sortedInfo.field, col.dataIndex) || equals(sortedInfo.field, col.key) ? sortedInfo.order : null;
};
var getColumFixedValue = function getColumFixedValue(col, frozenColumns) {
return (frozenColumns === null || frozenColumns === void 0 ? void 0 : frozenColumns.indexOf(col.dataIndex)) !== -1 ? COLUMN_FIXED_VALUES.LEFT : null;
};
var getFrozenColumnsLocalStorageKey = function getFrozenColumnsLocalStorageKey(localStorageKeyPrefix) {
var prefix = isPresent(localStorageKeyPrefix) ? localStorageKeyPrefix : convertLocationPathnameToId();
return "NEETOUI-".concat(prefix, "-FIXED_COLUMNS");
};
var getSortInfoFromQueryParams = function getSortInfoFromQueryParams(queryParams) {
var sortedInfo = {};
if (isPresent(queryParams.sort_by) && isPresent(queryParams.order_by) && isPresent(TABLE_SORT_ORDERS[queryParams.order_by])) {
sortedInfo.field = queryParams.sort_by.includes("+") ? queryParams.sort_by.split("+").map(snakeToCamelCase) : snakeToCamelCase(queryParams.sort_by);
sortedInfo.order = TABLE_SORT_ORDERS[queryParams.order_by];
}
return sortedInfo;
};
var getSortField = function getSortField(field) {
if (Array.isArray(field)) {
return field.map(camelToSnakeCase).join("+");
}
return camelToSnakeCase(field);
};
var calculateRowsPerPage = function calculateRowsPerPage() {
var viewportHeight = window.innerHeight;
var rowsPerPage = Math.floor((viewportHeight - TABLE_PAGINATION_HEIGHT) / TABLE_ROW_HEIGHT * 3);
return Math.ceil(rowsPerPage / 10) * 10;
};
function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var useResizableColumns = function useResizableColumns(_ref) {
var columns = _ref.columns,
columnData = _ref.columnData,
frozenColumns = _ref.frozenColumns,
setColumns = _ref.setColumns,
isEnabled = _ref.isEnabled,
isAddEnabled = _ref.isAddEnabled,
isColumnFreezeEnabled = _ref.isColumnFreezeEnabled,
onColumnAdd = _ref.onColumnAdd,
onColumnUpdate = _ref.onColumnUpdate,
onColumnDelete = _ref.onColumnDelete,
handleSort = _ref.handleSort,
sortedInfo = _ref.sortedInfo,
onColumnHide = _ref.onColumnHide,
onColumnFreeze = _ref.onColumnFreeze,
onMoreActionClick = _ref.onMoreActionClick,
tableOnChangeProps = _ref.tableOnChangeProps;
var handleResize = function handleResize(index) {
return function (_, _ref2) {
var size = _ref2.size;
var nextColumns = _toConsumableArray(columns);
nextColumns[index] = _objectSpread$2(_objectSpread$2({}, nextColumns[index]), {}, {
width: size.width
});
setColumns(nextColumns);
};
};
var computedColumnsData = useMemo(function () {
return columns.map(function (col, index) {
var fixed = getColumFixedValue(col, frozenColumns);
var modifiedColumn = _objectSpread$2(_objectSpread$2({}, col), {}, {
onHeaderCell: function onHeaderCell(column) {
return {
width: column.width,
onResize: isEnabled ? handleResize(index) : noop,
onResizeStop: function onResizeStop() {
return isEnabled ? onColumnUpdate(columns) : noop;
},
isSortable: isPresent(col.sorter),
onSort: handleSort,
sortedInfo: sortedInfo,
onColumnHide: onColumnHide,
onColumnFreeze: onColumnFreeze,
onMoreActionClick: onMoreActionClick,
isColumnFreezeEnabled: isColumnFreezeEnabled,
isAddEnabled: isAddEnabled && !fixed,
onAddColumn: function onAddColumn(positionOffset) {
return onColumnAdd(index + positionOffset);
},
isFixedColumn: !!fixed,
onColumnDelete: onColumnDelete,
isHidable: col.isHidable,
isDeletable: col.isDeletable,
moreActions: col.moreActions,
column: col,
"data-text-align": column.align
};
},
sortIcon: SortIcon,
sortOrder: getColumnSortOrder(col, sortedInfo),
fixed: fixed,
title: col.description ? function (props) {
return /*#__PURE__*/React__default.createElement(TitleWithInfoIcon$1, _extends({}, props, {
description: col.description,
title: col.title
}));
} : col.title
});
if (!has("ellipsis", col)) modifiedColumn.ellipsis = true;
return modifiedColumn;
}).sort(sortFrozenColumns(columnData));
}, [columns, sortedInfo, tableOnChangeProps, onColumnFreeze, frozenColumns, columnData]);
return {
columns: computedColumnsData
};
};
function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var useColumns = function useColumns(_ref) {
var columns = _ref.columns,
columnData = _ref.columnData,
setColumns = _ref.setColumns,
isResizeEnabled = _ref.isResizeEnabled,
isReorderEnabled = _ref.isReorderEnabled,
isAddEnabled = _ref.isAddEnabled,
isColumnFreezeEnabled = _ref.isColumnFreezeEnabled,
onColumnAdd = _ref.onColumnAdd,
onColumnUpdate = _ref.onColumnUpdate,
onColumnDelete = _ref.onColumnDelete,
rowSelection = _ref.rowSelection,
sortedInfo = _ref.sortedInfo,
setSortedInfo = _ref.setSortedInfo,
onColumnHide = _ref.onColumnHide,
onMoreActionClick = _ref.onMoreActionClick,
onTableChange = _ref.onTableChange,
tableOnChangeProps = _ref.tableOnChangeProps,
handleTableSortChange = _ref.handleTableSortChange,
isDefaultPageChangeHandler = _ref.isDefaultPageChangeHandler,
localStorageKeyPrefix = _ref.localStorageKeyPrefix;
var _useLocalStorage = useLocalStorage(getFrozenColumnsLocalStorageKey(localStorageKeyPrefix)),
_useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
frozenColumns = _useLocalStorage2[0],
setFrozenColumns = _useLocalStorage2[1];
var onColumnFreeze = useCallback(function (isFixedColumn, _ref2) {
var dataIndex = _ref2.dataIndex;
var updatedColumns = isFixedColumn ? without([dataIndex], frozenColumns) : append(dataIndex, frozenColumns);
setFrozenColumns(updatedColumns);
}, [frozenColumns, setFrozenColumns]);
useEffect(function () {
if (isEmpty(columnData) || frozenColumns) return;
var fixedCols = getFixedColumns(columnData);
setFrozenColumns(fixedCols);
}, [columnData, setFrozenColumns]);
var _useReorderColumns = useReorderColumns({
isEnabled: isReorderEnabled,
columns: columns,
setColumns: setColumns,
onColumnUpdate: onColumnUpdate,
rowSelection: rowSelection
}),
dragProps = _useReorderColumns.dragProps;
var handleSort = function handleSort(sorter) {
var _tableOnChangeProps$c, _tableOnChangeProps$c2, _tableOnChangeProps$c3;
var newSortedInfo = _objectSpread$1({}, sorter);
if (equals(props(["field", "order"], newSortedInfo), props(["field", "order"], sortedInfo))) {
newSortedInfo = {
field: null,
order: null,
column: null,
columnKey: null
};
}
setSortedInfo(newSortedInfo);
onTableChange === null || onTableChange === void 0 || onTableChange(((_tableOnChangeProps$c = tableOnChangeProps.current) === null || _tableOnChangeProps$c === void 0 ? void 0 : _tableOnChangeProps$c.pagination) || {}, ((_tableOnChangeProps$c2 = tableOnChangeProps.current) === null || _tableOnChangeProps$c2 === void 0 ? void 0 : _tableOnChangeProps$c2.filters) || {}, _objectSpread$1({}, newSortedInfo));
isDefaultPageChangeHandler && handleTableSortChange(((_tableOnChangeProps$c3 = tableOnChangeProps.current) === null || _tableOnChangeProps$c3 === void 0 ? void 0 : _tableOnChangeProps$c3.pagination) || {}, newSortedInfo);
};
var _useResizableColumns = useResizableColumns({
columns: columns,
columnData: columnData,
frozenColumns: frozenColumns,
setColumns: setColumns,
isEnabled: isResizeEnabled,
isAddEnabled: isAddEnabled,
isColumnFreezeEnabled: isColumnFreezeEnabled,
onColumnAdd: onColumnAdd,
onColumnUpdate: onColumnUpdate,
onColumnDelete: onColumnDelete,
handleSort: handleSort,
sortedInfo: sortedInfo,
onColumnHide: onColumnHide,
onMoreActionClick: onMoreActionClick,
tableOnChangeProps: tableOnChangeProps,
onColumnFreeze: onColumnFreeze
}),
computedColumnsData = _useResizableColumns.columns;
return {
dragProps: dragProps,
columns: computedColumnsData
};
};
var useScroll = function useScroll(_ref) {
var fixedHeight = _ref.fixedHeight,
enableColumnReorder = _ref.enableColumnReorder,
loading = _ref.loading,
otherProps = _ref.otherProps,
rowData = _ref.rowData,
pageSize = _ref.pageSize,
shouldShowSelectAllRowsCallout = _ref.shouldShowSelectAllRowsCallout,
shouldShowAllRowsSelectedCallout = _ref.shouldShowAllRowsSelectedCallout,
headerHeight = _ref.headerHeight;
var _useState = useState(0),
_useState2 = _slicedToArray(_useState, 2),
containerHeight = _useState2[0],
setContainerHeight = _useState2[1];
var resizeObserver = useRef(new ResizeObserver(function (_ref2) {
var _ref3 = _slicedToArray(_ref2, 1),
entry = _ref3[0];
return setContainerHeight(entry.contentRect.height);
}));
var scrollRef = useRef(null);
var tableRef = useCallback(function (table) {
scrollRef.current = table;
if (!fixedHeight) return;
var observer = resizeObserver.current;
if (table !== null) {
var _table$parentNode;
var targetNode = enableColumnReorder ? table === null || table === void 0 || (_table$parentNode = table.parentNode) === null || _table$parentNode === void 0 ? void 0 : _table$parentNode.parentNode : table === null || table === void 0 ? void 0 : table.parentNode;
observer.observe(targetNode);
} else if (observer) {
observer.disconnect();
}
}, [resizeObserver.current, fixedHeight, enableColumnReorder]);
var _useRestoreScrollPosi = useRestoreScrollPosition({
tableRef: tableRef,
scrollRef: scrollRef,
loading: loading
}),
handleScroll = _useRestoreScrollPosi.handleScroll;
var calculateTableContainerHeight = function calculateTableContainerHeight() {
var isPaginationVisible = otherProps.pagination !== false && rowData.length > pageSize;
var selectAllRowsCalloutHeight = 0;
if (shouldShowSelectAllRowsCallout || shouldShowAllRowsSelectedCallout) {
selectAllRowsCalloutHeight = getSelectAllRowsCalloutHeight();
}
return containerHeight - headerHeight - (isPaginationVisible ? TABLE_PAGINATION_HEIGHT : 0) - selectAllRowsCalloutHeight;
};
return {
tableRef: tableRef,
tableContainerRef: null,
handleScroll: handleScroll,
calculatedScroll: {
x: "max-content",
y: calculateTableContainerHeight()
}
};
};
var useTableSort = function useTableSort() {
var queryParams = useQueryParams();
var _useState = useState(function () {
return getSortInfoFromQueryParams(queryParams);
}),
_useState2 = _slicedToArray(_useState, 2),
sortedInfo = _useState2[0],
setSortedInfo = _useState2[1];
useEffect(function () {
setSortedInfo(getSortInfoFromQueryParams(queryParams));
}, [queryParams === null || queryParams === void 0 ? void 0 : queryParams.sort_by, queryParams === null || queryParams === void 0 ? void 0 : queryParams.order_by]);
var history = useHistory();
var handleTableChange = function handleTableChange(pagination, sorter) {
var params = {
sort_by: sorter.order ? getSortField(sorter.field) : undefined,
order_by: URL_SORT_ORDERS[sorter.order],
page: pagination.current
};
var pathname = window.location.pathname;
history.push(buildUrl(pathname, mergeLeft(params, queryParams)));
};
return {
handleTableChange: handleTableChange,
sortedInfo: sortedInfo,
setSortedInfo: setSortedInfo
};
};
var useVirtualScroll = function useVirtualScroll(_ref) {
var otherProps = _ref.otherProps,
rowData = _ref.rowData,
pageSize = _ref.pageSize,
shouldShowSelectAllRowsCallout = _ref.shouldShowSelectAllRowsCallout,
shouldShowAllRowsSelectedCallout = _ref.shouldShowAllRowsSelectedCallout,
headerHeight = _ref.headerHeight;
var _useState = useState({
top: 0,
left: 0
}),
_useState2 = _slicedToArray(_useState, 2),
containerRect = _useState2[0],
setContainerRect = _useState2[1];
var tableContainerRef = useRef(null);
useEffect(function () {
var updateContainerRect = function updateContainerRect() {
if (!tableContainerRef.current) return;
var rect = tableContainerRef.current.getBoundingClientRect();
setContainerRect(rect);
};
updateContainerRect();
window.addEventListener("scroll", updateContainerRect);
window.addEventListener("resize", updateContainerRect);
return function () {
window.removeEventListener("scroll", updateContainerRect);
window.removeEventListener("resize", updateContainerRect);
};
}, []);
var calculateTableContainerHeight = function calculateTableContainerHeight() {
var isPaginationVisible = otherProps.pagination !== false && rowData.length > pageSize;
var selectAllRowsCalloutHeight = 0;
if (shouldShowSelectAllRowsCallout || shouldShowAllRowsSelectedCallout) {
selectAllRowsCalloutHeight = getSelectAllRowsCalloutHeight();
}
var containerHeight = window.innerHeight - containerRect.top;
return containerHeight - headerHeight - (isPaginationVisible ? TABLE_PAGINATION_HEIGHT : 0) - selectAllRowsCalloutHeight;
};
return {
tableRef: null,
tableContainerRef: tableContainerRef,
handleScroll: noop,
calculatedScroll: {
x: window.innerWidth - (containerRect === null || containerRect === void 0 ? void 0 : containerRect.left),
y: calculateTableContainerHeight()
}
};
};
var _excluded = ["allowRowClick", "enableColumnResize", "enableColumnReorder", "enableColumnFreeze", "enableAddColumn", "className", "columnData", "currentPageNumber", "defaultPageSize", "handlePageChange", "loading", "onRowClick", "onRowSelect", "rowData", "totalCount", "selectedRowKeys", "fixedHeight", "paginationProps", "rowKey", "scroll", "rowSelection", "shouldDynamicallyRenderRowSize", "bordered", "onColumnUpdate", "components", "onColumnHide", "onColumnAdd", "onColumnDelete", "onChange", "onMoreActionClick", "bulkSelectAllRowsProps", "localStorageKeyPrefix", "virtual"];
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var Table = function Table(_ref) {
var _ref$allowRowClick = _ref.allowRowClick,
allowRowClick = _ref$allowRowClick === void 0 ? true : _ref$allowRowClick,
_ref$enableColumnResi = _ref.enableColumnResize,
enableColumnResize = _ref$enableColumnResi === void 0 ? true : _ref$enableColumnResi,
_ref$enableColumnReor = _ref.enableColumnReorder,
enableColumnReorder = _ref$enableColumnReor === void 0 ? false : _ref$enableColumnReor,
_ref$enableColumnFree = _ref.enableColumnFreeze,
enableColumnFreeze = _ref$enableColumnFree === void 0 ? true : _ref$enableColumnFree,
_ref$enableAddColumn = _ref.enableAddColumn,
enableAddColumn = _ref$enableAddColumn === void 0 ? false : _ref$enableAddColumn,
_ref$className = _ref.className,
className = _ref$className === void 0 ? "" : _ref$className,
_ref$columnData = _ref.columnData,
columnData = _ref$columnData === void 0 ? [] : _ref$columnData,
_ref$currentPageNumbe = _ref.currentPageNumber,
currentPageNumber = _ref$currentPageNumbe === void 0 ? 1 : _ref$currentPageNumbe,
_ref$defaultPageSize = _ref.defaultPageSize,
defaultPageSize = _ref$defaultPageSize === void 0 ? 30 : _ref$defaultPageSize,
_ref$handlePageChange = _ref.handlePageChange,
handlePageChange = _ref$handlePageChange === void 0 ? noop$1 : _ref$handlePageChange,
_ref$loading = _ref.loading,
loading = _ref$loading === void 0 ? false : _ref$loading,
onRowClick = _ref.onRowClick,
onRowSelect = _ref.onRowSelect,
_ref$rowData = _ref.rowData,
rowData = _ref$rowData === void 0 ? [] : _ref$rowData,
_ref$totalCount = _ref.totalCount,
totalCount = _ref$totalCount === void 0 ? 0 : _ref$totalCount,
_ref$selectedRowKeys = _ref.selectedRowKeys,
initialSelectedRowKeys = _ref$selectedRowKeys === void 0 ? [] : _ref$selectedRowKeys,
_ref$fixedHeight = _ref.fixedHeight,
fixedHeight = _ref$fixedHeight === void 0 ? false : _ref$fixedHeight,
_ref$paginationProps = _ref.paginationProps,
paginationProps = _ref$paginationProps === void 0 ? {} : _ref$paginationProps,
_ref$rowKey = _ref.rowKey,
rowKey = _ref$rowKey === void 0 ? "id" : _ref$rowKey,
scroll = _ref.scroll,
rowSelection = _ref.rowSelection,
_ref$shouldDynamicall = _ref.shouldDynamicallyRenderRowSize,
shouldDynamicallyRenderRowSize = _ref$shouldDynamicall === void 0 ? false : _ref$shouldDynamicall,
_ref$bordered = _ref.bordered,
bordered = _ref$bordered === void 0 ? true : _ref$bordered,
_ref$onColumnUpdate = _ref.onColumnUpdate,
onColumnUpdate = _ref$onColumnUpdate === void 0 ? noop$1 : _ref$onColumnUpdate,
_ref$components = _ref.components,
components = _ref$components === void 0 ? {} : _ref$components,
onColumnHide = _ref.onColumnHide,
_ref$onColumnAdd = _ref.onColumnAdd,
onColumnAdd = _ref$onColumnAdd === void 0 ? noop$1 : _ref$onColumnAdd,
onColumnDelete = _ref.onColumnDelete,
onChange = _ref.onChange,
onMoreActionClick = _ref.onMoreActionClick,
bulkSelectAllRowsProps = _ref.bulkSelectAllRowsProps,
localStorageKeyPrefix = _ref.localStorageKeyPrefix,
_ref$virtual = _ref.virtual,
virtual = _ref$virtual === void 0 ? false : _ref$virtual,
otherProps = _objectWithoutProperties(_ref, _excluded);
var _useTranslation = useTranslation(),
i18n = _useTranslation.i18n;
var _useState = useState(TABLE_DEFAULT_HEADER_HEIGHT),
_useState2 = _slicedToArray(_useState, 2),
headerHeight = _useState2[0],
setHeaderHeight = _useState2[1];
var _useState3 = useState(columnData),
_useState4 = _slicedToArray(_useState3, 2),
columns = _useState4[0],
setColumns = _useState4[1];
var _useState5 = useState(false),
_useState6 = _slicedToArray(_useState5, 2),
bulkSelectedAllRows = _useState6[0],
setBulkSelectedAllRows = _useState6[1];
var _useState7 = useState({}),
_useState8 = _slicedToArray(_useState7, 2),
columnChanges = _useState8[0],
setColumnChanges = _useState8[1];
var _useTableSort = useTableSort(),
handleTableSortChange = _useTableSort.handleTableChange,
sortedInfo = _useTableSort.sortedInfo,
setSortedInfo = _useTableSort.setSortedInfo;
var _ref2 = bulkSelectAllRowsProps !== null && bulkSelectAllRowsProps !== void 0 ? bulkSelectAllRowsProps : {},
handleSetBulkSelectedAllRows = _ref2.setBulkSelectedAllRows;
var isDefaultPageChangeHandler = handlePageChange === noop$1;
var history = useHistory();
var headerRef = useRef();
var tableOnChangeProps = useRef({});
useTimeout(function () {
var headerHeight = headerRef.current ? headerRef.current.offsetHeight : TABLE_DEFAULT_HEADER_HEIGHT;
setHeaderHeight(headerHeight);
}, 10);
var handleColumnUpdateWithChanges = function handleColumnUpdateWithChanges(updatedColumns) {
var newChanges = {};
updatedColumns.forEach(function (col) {
var originalCol = columnData.find(function (c) {
return c.dataIndex === col.dataIndex;
});
var changes = {};
if (col.width && col.width !== (originalCol === null || originalCol === void 0 ? void 0 : originalCol.width)) {
changes.width = col.width;
}
if (Object.keys(changes).length > 0) {
newChanges[col.dataIndex] = changes;
}
});
setColumnChanges(function (prev) {
return _objectSpread(_objectSpread({}, prev), newChanges);
});
onColumnUpdate(updatedColumns);
};
var _useColumns = useColumns({
isReorderEnabled: enableColumnReorder,
isResizeEnabled: enableColumnResize,
isAddEnabled: enableAddColumn,
isColumnFreezeEnabled: enableColumnFreeze,
onTableChange: onChange,
columns: columns,
columnData: columnData,
setColumns: setColumns,
onColumnUpdate: handleColumnUpdateWithChanges,
rowSelection: rowSelection,
sortedInfo: sortedInfo,
setSortedInfo: setSortedInfo,
onColumnHide: onColumnHide,
onMoreActionClick: onMoreActionClick,
onColumnAdd: onColumnAdd,
onColumnDelete: onColumnDelete,
tableOnChangeProps: tableOnChangeProps,
handleTableSortChange: handleTableSortChange,
isDefaultPageChangeHandler: isDefaultPageChangeHandler,
localStorageKeyPrefix: localStorageKeyPrefix
}),
dragProps = _useColumns.dragProps,
curatedColumnsData = _useColumns.columns;
var queryParams = useQueryParams();
var setSortFromURL = function setSortFromURL(columnData) {
var _queryParams$sort_by;
return modifyBy({
dataIndex: snakeToCamelCase((_queryParams$sort_by = queryParams.sort_by) !== null && _queryParams$sort_by !== void 0 ? _queryParams$sort_by : "")
}, assoc("sortOrder", TABLE_SORT_ORDERS[queryParams.order_by]), columnData);
};
var sortedColumns = isDefaultPageChangeHandler ? setSortFromURL(curatedColumnsData) : curatedColumnsData;
var locale = {
emptyText: /*#__PURE__*/React__default.createElement(Typography, {
style: "body2"
}, "No Data")
};
var selectedRowKeys = bulkSelectedAllRows ? pluck(rowKey, rowData) : initialSelectedRowKeys;
var showBulkSelectionCallout = useMemo(function () {
return isIncludedIn(selectedRowKeys, pluck(rowKey, rowData)) && selectedRowKeys.length !== totalCount && !bulkSelectedAllRows;
}, [selectedRowKeys, rowKey, rowData, totalCount, bulkSelectedAllRows]);
var shouldShowSelectAllRowsCallout = bulkSelectAllRowsProps && showBulkSelectionCallout;
var shouldShowAllRowsSelectedCallout = bulkSelectAllRowsProps && bulkSelectedAllRows;
var pageSize = shouldDynamicallyRenderRowSize ? calculateRowsPerPage() : paginationProps.pageSize || defaultPageSize;
var _ref3 = (virtual ? useVirtualScroll : useScroll)({
fixedHeight: fixedHeight,
enableColumnReorder: enableColumnReorder,
loading: loading,
otherProps: otherProps,
rowData: rowData,
pageSize: pageSize,
shouldShowSelectAllRowsCallout: shouldShowSelectAllRowsCallout,
shouldShowAllRowsSelectedCallout: shouldShowAllRowsSelectedCallout,
headerHeight: headerHeight
}),
tableRef = _ref3.tableRef,
tableContainerRef = _ref3.tableContainerRef,
handleScroll = _ref3.handleScroll,
calculatedScroll = _ref3.calculatedScroll;
var handleRowChange = function handleRowChange(selectedRowKeys, selectedRows) {
var tableWrapper = document.querySelector('[data-testid="table-wrapper"]');
if (selectedRowKeys.length !== defaultPageSize) {
setBulkSelectedAllRows(false);
handleSetBulkSelectedAllRows === null || handleSetBulkSelectedAllRows === void 0 || handleSetBulkSelectedAllRows(false);
tableWrapper === null || tableWrapper === void 0 || tableWrapper.classList.remove("neeto-ui-overflow-hidden");
} else {
tableWrapper === null || tableWrapper === void 0 || tableWrapper.classList.add("neeto-ui-overflow-hidden");
}
onRowSelect === null || onRowSelect === void 0 || onRowSelect(selectedRowKeys, selectedRows);
};
var rowSelectionProps = rowSelection ? _objectSpread(_objectSpread({
type: "checkbox",
preserveSelectedRowKeys: true,
columnWidth: 48
}, rowSelection), {}, {
onChange: handleRowChange,
selectedRowKeys: selectedRowKeys
}) : false;
// eslint-disable-next-line @bigbinary/neeto/no-excess-function-arguments
var handleTableChange = function handleTableChange(pagination, filters, sorter, extras) {
setSortedInfo(sorter);
isDefaultPageChangeHandler && handleTableSortChange(pagination, sorter);
onChange === null || onChange === void 0 || onChange(pagination, filters, sorter, extras);
tableOnChangeProps.current = {
pagination: pagination,
filters: filters
};
};
var componentOverrides = _objectSpread(_objectSpread({}, components), {}, {
header: getHeaderCell({
enableColumnResize: enableColumnResize,
enableColumnReorder: enableColumnReorder
})
});
var calculatePageSizeOptions = function calculatePageSizeOptions() {
return dynamicArray(5, function (index) {
return (index + 1) * pageSize;
});
};
var itemRender = function itemRender(_, type, originalElement) {
var commonProps = {
size: "small",
style: "text"
};
if (type === "prev") return /*#__PURE__*/React__default.createElement(Button, _extends({
icon: Left
}, commonProps));
if (type === "next") return /*#__PURE__*/React__default.createElement(Button, _extends({
icon: Right
}, commonProps));
if (type === "jump-prev" || type === "jump-next") {
return /*#__PURE__*/React__default.createElement(Button, _extends({
icon: MenuHorizontal
}, commonProps));
}
return originalElement;
};
useEffect(function () {
if (isNotEmpty(initialSelectedRowKeys)) return;
setBulkSelectedAllRows(false);
handleSetBulkSelectedAllRows === null || handleSetBulkSelectedAllRows === void 0 || handleSetBulkSelectedAllRows(false);
}, [handleSetBulkSelectedAllRows, initialSelectedRowKeys]);
useEffect(function () {
var shouldNavigateToLastPage = isEmpty(rowData) && !loading && currentPageNumber !== 1;
if (!shouldNavigateToLastPage) return;
var lastPage = Math.ceil(totalCount / pageSize);
var page = Math.max(1, lastPage);
var pathname = window.location.pathname;
isDefaultPageChangeHandler ? history.push(buildUrl(pathname, mergeLeft({
page: page
}, queryParams))) : handlePageChange(page, pageSize);
}, [rowData]);
useEffect(function () {
var mergedColumns = columnData.map(function (col) {
return _objectSpread(_objectSpread({}, col), columnChanges[col.dataIndex]);
});
setColumns(mergedColumns);
}, [columnData, columnChanges]);
var neetoUIFontBold = parseInt(getComputedStyle(document.documentElement).getPropertyValue("--neeto-ui-font-bold"), 10);
var renderTable = function renderTable() {
return /*#__PURE__*/React__default.createElement(_ConfigProvider, {
locale: ANTD_LOCALE[i18n.language || "en"],
theme: {
token: _objectSpread({}, ANT_DESIGN_GLOBAL_TOKEN_OVERRIDES),
components: {
Pagination: {
itemActiveBg: "rgb(var(--neeto-ui-primary-500))",
itemActiveBgDisabled: "rgb(var(--neeto-ui-gray-50))",
itemActiveColorDisabled: "rgb(var(--neeto-ui-gray-300))",
itemBg: "rgb(var(--neeto-ui-white))",
itemInputBg: "rgb(var(--neeto-ui-white))",
itemLinkBg: "rgb(var(--neeto-ui-white))",
// Global overrides
colorBgContainer: "rgb(var(--neeto-ui-primary-500))",
colorPrimary: "rgb(var(--neeto-ui-white))",
colorPrimaryHover: "rgb(var(--neeto-ui-white))",
colorBgTextHover: "rgb(var(--neeto-ui-gray-200))",
borderRadius: 6
},
Table: {
headerBorderRadius: 0,
bodySortBg: "rgb(var(--neeto-ui-gray-50))",
borderColor: "rgb(var(--neeto-ui-gray-200))",
expandIconBg: "rgb(var(--neeto-ui-white))",
filterDropdownBg: "rgb(var(--neeto-ui-white))",
filterDropdownMenuBg: "rgb(var(--neeto-ui-white))",
fixedHeaderSortActiveBg: "rgb(var(--neeto-ui-gray-200))",
footerBg: "rgb(var(--neeto-ui-gray-100))",
footerColor: "rgb(var(--neeto-ui-black))",
headerBg: "rgb(var(--neeto-ui-gray-100))",
headerColor: "rgb(var(--neeto-ui-black))",
headerFilterHoverBg: "rgb(var(--neeto-ui-gray-100))",
headerSortActiveBg: "rgb(var(--neeto-ui-gray-200))",
headerSortHoverBg: "rgb(var(--neeto-ui-gray-200))",
headerSplitColor: "rgb(var(--neeto-ui-gray-100))",
rowExpandedBg: "rgb(var(--neeto-ui-gray-100))",
rowHoverBg: "rgb(var(--neeto-ui-gray-50))",
rowSelectedBg: "rgb(var(--neeto-ui-accent-50))",
rowSelectedHoverBg: "rgb(var(--neeto-ui-accent-50))",
stickyScrollBarBg: "rgb(var(--neeto-ui-gray-300))",
cellPaddingBlock: 11,
// Global overrides
colorPrimary: "rgb(var(--neeto-ui-primary-500))",
fontSize: 14,
fontWeightStrong: neetoUIFontBold,
paddingContentVerticalLG: 11
}
}
}
}, shouldShowSelectAllRowsCallout && /*#__PURE__*/React__default.createElement(SelectAllRowsCallout, _extends({}, bulkSelectAllRowsProps, {
onBulkSelectAllRows: function onBulkSelectAllRows() {
setBulkSelectedAllRows(true);
handleSetBulkSelectedAllRows === null || handleSetBulkSelectedAllRows === void 0 || handleSetBulkSelectedAllRows(true);
}
})), shouldShowAllRowsSelectedCallout && /*#__PURE__*/React__default.createElement(AllRowsSelectedCallout, _extends({}, bulkSelectAllRowsProps, {
onClearSelection: function onClearSelection() {
setBulkSelectedAllRows(false);
handleSetBulkSelectedAllRows === null || handleSetBulkSelectedAllRows === void 0 || handleSetBulkSelectedAllRows(false);
handleRowChange([], []);
}
})), /*#__PURE__*/React__default.createElement(_Table, _extends({
bordered: bordered,
locale: locale,
rowKey: rowKey,
virtual: virtual,
columns: sortedColumns,
components: componentOverrides,
dataSource: rowData,
loading: {
spinning: loading,
indicator: /*#__PURE__*/React__default.createElement(Spinner, null)
},
ref: tableRef,
rowSelection: rowSelectionProps,
scroll: _objectSpread(_objectSpread({}, calculatedScroll), scroll),
showSorterTooltip: false,
pagination: _objectSpread(_objectSpread({
hideOnSinglePage: true
}, paginationProps), {}, {
showSizeChanger: false,
total: totalCount !== null && totalCount !== void 0 ? totalCount : 0,
current: currentPageNumber,
defaultPageSize: pageSize,
pageSizeOptions: calculatePageSizeOptions(),
onChange: handlePageChange,
itemRender: itemRender
}),
rowClassName: classnames("neeto-ui-table--row", {
"neeto-ui-table--row_hover": allowRowClick
}, [className]),
onChange: handleTableChange,
onScroll: handleScroll,
onHeaderRow: function onHeaderRow() {
return {
ref: headerRef,
className: classnames("neeto-ui-table__header", {
"neeto-ui-table-reorderable": enableColumnReorder
}),
id: "neeto-ui-table__header"
};
},
onRow: function onRow(record, rowIndex) {
return {
onClick: function onClick(event) {
return allowRowClick && onRowClick && onRowClick(event, record, rowIndex);
}
};
}
}, otherProps)));
};
var renderTableVirtual = function renderTableVirtual() {
return virtual ? /*#__PURE__*/React