@itwin/itwinui-react 2.0.0-dev.1 → 2.0.0-dev.3

package/cjs/core/Table/TableCell.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -19,17 +8,17 @@ exports.TableCell = void 0;
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-var react_1 = __importDefault(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var utils_1 = require("./utils");
-var SubRowExpander_1 = require("./SubRowExpander");
-var columns_1 = require("./columns");
-var cells_1 = require("./cells");
-var TableCell = function (props) {
-    var cell = props.cell, cellIndex = props.cellIndex, isDisabled = props.isDisabled, tableHasSubRows = props.tableHasSubRows, tableInstance = props.tableInstance, expanderCell = props.expanderCell;
-    var hasSubRowExpander = cellIndex ===
-        cell.row.cells.findIndex(function (c) { return c.column.id !== columns_1.SELECTION_CELL_ID; });
-    var getSubRowStyle = function () {
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const utils_1 = require("./utils");
+const SubRowExpander_1 = require("./SubRowExpander");
+const columns_1 = require("./columns");
+const cells_1 = require("./cells");
+const TableCell = (props) => {
+    const { cell, cellIndex, isDisabled, tableHasSubRows, tableInstance, expanderCell, } = props;
+    const hasSubRowExpander = cellIndex ===
+        cell.row.cells.findIndex((c) => c.column.id !== columns_1.SELECTION_CELL_ID);
+    const getSubRowStyle = () => {
         if (!tableHasSubRows || !hasSubRowExpander) {
             return undefined;
         }
@@ -39,19 +28,26 @@ var TableCell = function (props) {
             paddingLeft: 16 + (cell.row.depth + (cell.row.canExpand ? 0 : 1)) * 35,
         };
     };
-    var cellElementProps = cell.getCellProps({
+    const cellElementProps = cell.getCellProps({
         className: (0, classnames_1.default)('iui-table-cell', cell.column.cellClassName, {
             'iui-table-cell-sticky': !!cell.column.sticky,
         }),
-        style: __assign(__assign(__assign({}, (0, utils_1.getCellStyle)(cell.column, !!tableInstance.state.isTableResizing)), getSubRowStyle()), (0, utils_1.getStickyStyle)(cell.column, tableInstance.visibleColumns)),
+        style: {
+            ...(0, utils_1.getCellStyle)(cell.column, !!tableInstance.state.isTableResizing),
+            ...getSubRowStyle(),
+            ...(0, utils_1.getStickyStyle)(cell.column, tableInstance.visibleColumns),
+        },
     });
-    var cellProps = __assign(__assign({}, tableInstance), { cell: cell, row: cell.row, value: cell.value, column: cell.column });
-    var cellContent = (react_1.default.createElement(react_1.default.Fragment, null,
+    const cellProps = {
+        ...tableInstance,
+        ...{ cell, row: cell.row, value: cell.value, column: cell.column },
+    };
+    const cellContent = (react_1.default.createElement(react_1.default.Fragment, null,
         tableHasSubRows && hasSubRowExpander && cell.row.canExpand && (react_1.default.createElement(SubRowExpander_1.SubRowExpander, { cell: cell, isDisabled: isDisabled, cellProps: cellProps, expanderCell: expanderCell })),
         cell.render('Cell')));
-    var cellRendererProps = {
-        cellElementProps: cellElementProps,
-        cellProps: cellProps,
+    const cellRendererProps = {
+        cellElementProps,
+        cellProps,
         children: (react_1.default.createElement(react_1.default.Fragment, null,
             cellContent,
             cell.column.sticky === 'left' &&
@@ -59,7 +55,10 @@ var TableCell = function (props) {
             cell.column.sticky === 'right' &&
                 tableInstance.state.sticky.isScrolledToLeft && (react_1.default.createElement("div", { className: 'iui-table-cell-shadow-left' })))),
     };
-    return (react_1.default.createElement(react_1.default.Fragment, null, cell.column.cellRenderer ? (cell.column.cellRenderer(__assign(__assign({}, cellRendererProps), { isDisabled: function () { return isDisabled; } }))) : (react_1.default.createElement(cells_1.DefaultCell, __assign({}, cellRendererProps, { isDisabled: function () { return isDisabled; } })))));
+    return (react_1.default.createElement(react_1.default.Fragment, null, cell.column.cellRenderer ? (cell.column.cellRenderer({
+        ...cellRendererProps,
+        isDisabled: () => isDisabled,
+    })) : (react_1.default.createElement(cells_1.DefaultCell, { ...cellRendererProps, isDisabled: () => isDisabled }))));
 };
 exports.TableCell = TableCell;
 exports.default = exports.TableCell;

package/cjs/core/Table/TablePaginator.js

@@ -1,26 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -30,23 +8,21 @@ exports.TablePaginator = void 0;
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-var react_1 = __importDefault(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
 require("@itwin/itwinui-css/css/table.css");
-var Buttons_1 = require("../Buttons");
-var ProgressIndicators_1 = require("../ProgressIndicators");
-var Menu_1 = require("../Menu");
-var utils_1 = require("../utils");
-var defaultLocalization = {
-    pageSizeLabel: function (size) { return "".concat(size, " per page"); },
-    rangeLabel: function (startIndex, endIndex, totalRows, isLoading) {
-        return isLoading
-            ? "".concat(startIndex, "-").concat(endIndex, "\u2026")
-            : "".concat(startIndex, "-").concat(endIndex, " of ").concat(totalRows);
-    },
+const Buttons_1 = require("../Buttons");
+const ProgressIndicators_1 = require("../ProgressIndicators");
+const Menu_1 = require("../Menu");
+const utils_1 = require("../utils");
+const defaultLocalization = {
+    pageSizeLabel: (size) => `${size} per page`,
+    rangeLabel: (startIndex, endIndex, totalRows, isLoading) => isLoading
+        ? `${startIndex}-${endIndex}…`
+        : `${startIndex}-${endIndex} of ${totalRows}`,
     previousPage: 'Previous page',
     nextPage: 'Next page',
-    goToPageLabel: function (page) { return "Go to page ".concat(page); },
+    goToPageLabel: (page) => `Go to page ${page}`,
     rowsPerPageLabel: 'Rows per page',
 };
 /**
@@ -58,50 +34,45 @@ var defaultLocalization = {
  *   paginatorRenderer={(props) => <TablePaginator {...props} />}
  * />
  */
-var TablePaginator = function (props) {
-    var currentPage = props.currentPage, totalRowsCount = props.totalRowsCount, pageSize = props.pageSize, onPageChange = props.onPageChange, _a = props.totalSelectedRowsCount, totalSelectedRowsCount = _a === void 0 ? 0 : _a, _b = props.focusActivationMode, focusActivationMode = _b === void 0 ? 'manual' : _b, _c = props.isLoading, isLoading = _c === void 0 ? false : _c, _d = props.size, size = _d === void 0 ? 'default' : _d, pageSizeList = props.pageSizeList, onPageSizeChange = props.onPageSizeChange, userLocalization = props.localization, className = props.className, rest = __rest(props, ["currentPage", "totalRowsCount", "pageSize", "onPageChange", "totalSelectedRowsCount", "focusActivationMode", "isLoading", "size", "pageSizeList", "onPageSizeChange", "localization", "className"]);
+const TablePaginator = (props) => {
+    const { currentPage, totalRowsCount, pageSize, onPageChange, totalSelectedRowsCount = 0, focusActivationMode = 'manual', isLoading = false, size = 'default', pageSizeList, onPageSizeChange, localization: userLocalization, className, ...rest } = props;
     (0, utils_1.useTheme)();
-    var localization = react_1.default.useMemo(function () { return (__assign(__assign({}, defaultLocalization), userLocalization)); }, [userLocalization]);
-    var pageListRef = react_1.default.useRef(null);
-    var _e = react_1.default.useState(currentPage), focusedIndex = _e[0], setFocusedIndex = _e[1];
-    react_1.default.useEffect(function () {
+    const localization = react_1.default.useMemo(() => ({ ...defaultLocalization, ...userLocalization }), [userLocalization]);
+    const pageListRef = react_1.default.useRef(null);
+    const [focusedIndex, setFocusedIndex] = react_1.default.useState(currentPage);
+    react_1.default.useEffect(() => {
         setFocusedIndex(currentPage);
     }, [currentPage]);
-    var needFocus = react_1.default.useRef(false);
-    var isMounted = react_1.default.useRef(false);
-    react_1.default.useEffect(function () {
+    const needFocus = react_1.default.useRef(false);
+    const isMounted = react_1.default.useRef(false);
+    react_1.default.useEffect(() => {
         var _a, _b;
         // Checking `isMounted.current` prevents from focusing on initial load.
         // Checking `needFocus.current` prevents from focusing page when clicked on previous/next page.
         if (isMounted.current && needFocus.current) {
-            var buttonToFocus = Array.from((_b = (_a = pageListRef.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.iui-table-paginator-page-button')) !== null && _b !== void 0 ? _b : []).find(function (el) { var _a; return ((_a = el.textContent) === null || _a === void 0 ? void 0 : _a.trim()) === (focusedIndex + 1).toString(); });
+            const buttonToFocus = Array.from((_b = (_a = pageListRef.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.iui-table-paginator-page-button')) !== null && _b !== void 0 ? _b : []).find((el) => { var _a; return ((_a = el.textContent) === null || _a === void 0 ? void 0 : _a.trim()) === (focusedIndex + 1).toString(); });
             buttonToFocus === null || buttonToFocus === void 0 ? void 0 : buttonToFocus.focus();
             needFocus.current = false;
         }
         isMounted.current = true;
     }, [focusedIndex]);
-    var buttonSize = size != 'default' ? 'small' : undefined;
-    var pageButton = react_1.default.useCallback(function (index, tabIndex) {
-        if (tabIndex === void 0) { tabIndex = index === focusedIndex ? 0 : -1; }
-        return (react_1.default.createElement("button", { key: index, className: (0, classnames_1.default)('iui-table-paginator-page-button', {
-                'iui-table-paginator-page-button-small': buttonSize === 'small',
-            }), "data-iui-active": index === currentPage, onClick: function () { return onPageChange(index); }, "aria-current": index === currentPage, "aria-label": localization.goToPageLabel(index + 1), tabIndex: tabIndex }, index + 1));
-    }, [focusedIndex, currentPage, localization, buttonSize, onPageChange]);
-    var totalPagesCount = Math.ceil(totalRowsCount / pageSize);
-    var pageList = react_1.default.useMemo(function () {
-        return new Array(totalPagesCount)
-            .fill(null)
-            .map(function (_, index) { return pageButton(index); });
-    }, [pageButton, totalPagesCount]);
-    var _f = (0, utils_1.useOverflow)(pageList), overflowRef = _f[0], visibleCount = _f[1];
-    var _g = (0, utils_1.useContainerWidth)(), paginatorResizeRef = _g[0], paginatorWidth = _g[1];
-    var onKeyDown = function (event) {
+    const buttonSize = size != 'default' ? 'small' : undefined;
+    const pageButton = react_1.default.useCallback((index, tabIndex = index === focusedIndex ? 0 : -1) => (react_1.default.createElement("button", { key: index, className: (0, classnames_1.default)('iui-table-paginator-page-button', {
+            'iui-table-paginator-page-button-small': buttonSize === 'small',
+        }), "data-iui-active": index === currentPage, onClick: () => onPageChange(index), "aria-current": index === currentPage, "aria-label": localization.goToPageLabel(index + 1), tabIndex: tabIndex }, index + 1)), [focusedIndex, currentPage, localization, buttonSize, onPageChange]);
+    const totalPagesCount = Math.ceil(totalRowsCount / pageSize);
+    const pageList = react_1.default.useMemo(() => new Array(totalPagesCount)
+        .fill(null)
+        .map((_, index) => pageButton(index)), [pageButton, totalPagesCount]);
+    const [overflowRef, visibleCount] = (0, utils_1.useOverflow)(pageList);
+    const [paginatorResizeRef, paginatorWidth] = (0, utils_1.useContainerWidth)();
+    const onKeyDown = (event) => {
         // alt + arrow keys are used by browser/assistive technologies
         if (event.altKey) {
             return;
         }
-        var focusPage = function (delta) {
-            var newFocusedIndex = (0, utils_1.getBoundedValue)(focusedIndex + delta, 0, totalPagesCount - 1);
+        const focusPage = (delta) => {
+            const newFocusedIndex = (0, utils_1.getBoundedValue)(focusedIndex + delta, 0, totalPagesCount - 1);
             needFocus.current = true;
             if (focusActivationMode === 'auto') {
                 onPageChange(newFocusedIndex);
@@ -133,9 +104,9 @@ var TablePaginator = function (props) {
                 break;
         }
     };
-    var halfVisibleCount = Math.floor(visibleCount / 2);
-    var startPage = focusedIndex - halfVisibleCount;
-    var endPage = focusedIndex + halfVisibleCount + 1;
+    const halfVisibleCount = Math.floor(visibleCount / 2);
+    let startPage = focusedIndex - halfVisibleCount;
+    let endPage = focusedIndex + halfVisibleCount + 1;
     if (startPage < 0) {
         endPage = Math.min(totalPagesCount, endPage + Math.abs(startPage)); // If no room at the beginning, show extra pages at the end
         startPage = 0;
@@ -144,22 +115,22 @@ var TablePaginator = function (props) {
         startPage = Math.max(0, startPage - (endPage - totalPagesCount)); // If no room at the end, show extra pages at the beginning
         endPage = totalPagesCount;
     }
-    var hasNoRows = totalPagesCount === 0;
-    var showPagesList = totalPagesCount > 1 || isLoading;
-    var showPageSizeList = pageSizeList && !!onPageSizeChange && !!totalRowsCount;
-    var ellipsis = (react_1.default.createElement("span", { className: (0, classnames_1.default)('iui-table-paginator-ellipsis', {
+    const hasNoRows = totalPagesCount === 0;
+    const showPagesList = totalPagesCount > 1 || isLoading;
+    const showPageSizeList = pageSizeList && !!onPageSizeChange && !!totalRowsCount;
+    const ellipsis = (react_1.default.createElement("span", { className: (0, classnames_1.default)('iui-table-paginator-ellipsis', {
             'iui-table-paginator-ellipsis-small': size === 'small',
         }) }, "\u2026"));
-    var noRowsContent = (react_1.default.createElement(react_1.default.Fragment, null, isLoading ? (react_1.default.createElement(ProgressIndicators_1.ProgressRadial, { indeterminate: true, size: 'small' })) : (react_1.default.createElement(Buttons_1.Button, { styleType: 'borderless', disabled: true, size: buttonSize }, "1"))));
+    const noRowsContent = (react_1.default.createElement(react_1.default.Fragment, null, isLoading ? (react_1.default.createElement(ProgressIndicators_1.ProgressRadial, { indeterminate: true, size: 'small' })) : (react_1.default.createElement(Buttons_1.Button, { styleType: 'borderless', disabled: true, size: buttonSize }, "1"))));
     if (!showPagesList && !showPageSizeList) {
         return null;
     }
-    return (react_1.default.createElement("div", __assign({ className: (0, classnames_1.default)('iui-table-paginator', className), ref: paginatorResizeRef }, rest),
-        react_1.default.createElement("div", { className: 'iui-left' }, totalSelectedRowsCount > 0 && (react_1.default.createElement("span", null, "".concat(totalSelectedRowsCount, " ").concat(totalSelectedRowsCount === 1 ? 'row' : 'rows', " selected")))),
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)('iui-table-paginator', className), ref: paginatorResizeRef, ...rest },
+        react_1.default.createElement("div", { className: 'iui-left' }, totalSelectedRowsCount > 0 && (react_1.default.createElement("span", null, `${totalSelectedRowsCount} ${totalSelectedRowsCount === 1 ? 'row' : 'rows'} selected`))),
         showPagesList && (react_1.default.createElement("div", { className: 'iui-center', ref: overflowRef },
-            react_1.default.createElement(Buttons_1.IconButton, { styleType: 'borderless', disabled: currentPage === 0, onClick: function () { return onPageChange(currentPage - 1); }, size: buttonSize, "aria-label": localization.previousPage },
+            react_1.default.createElement(Buttons_1.IconButton, { styleType: 'borderless', disabled: currentPage === 0, onClick: () => onPageChange(currentPage - 1), size: buttonSize, "aria-label": localization.previousPage },
                 react_1.default.createElement(utils_1.SvgChevronLeft, null)),
-            react_1.default.createElement("span", { className: 'iui-table-paginator-pages-group', onKeyDown: onKeyDown, ref: pageListRef }, (function () {
+            react_1.default.createElement("span", { className: 'iui-table-paginator-pages-group', onKeyDown: onKeyDown, ref: pageListRef }, (() => {
                 if (hasNoRows) {
                     return noRowsContent;
                 }
@@ -178,17 +149,15 @@ var TablePaginator = function (props) {
                         ellipsis,
                         react_1.default.createElement(ProgressIndicators_1.ProgressRadial, { indeterminate: true, size: 'small' })))));
             })()),
-            react_1.default.createElement(Buttons_1.IconButton, { styleType: 'borderless', disabled: currentPage === totalPagesCount - 1 || hasNoRows, onClick: function () { return onPageChange(currentPage + 1); }, size: buttonSize, "aria-label": localization.nextPage },
+            react_1.default.createElement(Buttons_1.IconButton, { styleType: 'borderless', disabled: currentPage === totalPagesCount - 1 || hasNoRows, onClick: () => onPageChange(currentPage + 1), size: buttonSize, "aria-label": localization.nextPage },
                 react_1.default.createElement(utils_1.SvgChevronRight, null)))),
         react_1.default.createElement("div", { className: 'iui-right' }, showPageSizeList && (react_1.default.createElement(react_1.default.Fragment, null,
             localization.rowsPerPageLabel !== null &&
                 paginatorWidth >= 1024 && (react_1.default.createElement("span", { className: 'iui-table-paginator-page-size-label' }, localization.rowsPerPageLabel)),
-            react_1.default.createElement(Buttons_1.DropdownButton, { styleType: 'borderless', size: buttonSize, menuItems: function (close) {
-                    return pageSizeList.map(function (size) { return (react_1.default.createElement(Menu_1.MenuItem, { key: size, isSelected: size === pageSize, onClick: function () {
-                            close();
-                            onPageSizeChange(size);
-                        } }, localization.pageSizeLabel(size))); });
-                } }, localization.rangeLabel(currentPage * pageSize + 1, Math.min(totalRowsCount, (currentPage + 1) * pageSize), totalRowsCount, isLoading)))))));
+            react_1.default.createElement(Buttons_1.DropdownButton, { styleType: 'borderless', size: buttonSize, menuItems: (close) => pageSizeList.map((size) => (react_1.default.createElement(Menu_1.MenuItem, { key: size, isSelected: size === pageSize, onClick: () => {
+                        close();
+                        onPageSizeChange(size);
+                    } }, localization.pageSizeLabel(size)))) }, localization.rangeLabel(currentPage * pageSize + 1, Math.min(totalRowsCount, (currentPage + 1) * pageSize), totalRowsCount, isLoading)))))));
 };
 exports.TablePaginator = TablePaginator;
 exports.default = exports.TablePaginator;

package/cjs/core/Table/TableRowMemoized.d.ts

@@ -8,11 +8,9 @@ import { CellProps, Row, TableInstance, TableState } from 'react-table';
  */
 export declare const TableRow: <T extends Record<string, unknown>>(props: {
     row: Row<T>;
-    rowProps?: ((row: Row<T>) => Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-    } & {
-        status?: "positive" | "warning" | "negative" | undefined;
-        isLoading?: boolean | undefined;
+    rowProps?: ((row: Row<T>) => React.ComponentPropsWithRef<'div'> & {
+        status?: 'positive' | 'warning' | 'negative';
+        isLoading?: boolean;
     }) | undefined;
     isLast: boolean;
     onRowInViewport: React.MutableRefObject<((rowData: T) => void) | undefined>;
@@ -30,11 +28,9 @@ export declare const TableRow: <T extends Record<string, unknown>>(props: {
 }) => JSX.Element;
 export declare const TableRowMemoized: <T extends Record<string, unknown>>(props: {
     row: Row<T>;
-    rowProps?: ((row: Row<T>) => Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-    } & {
-        status?: "positive" | "warning" | "negative" | undefined;
-        isLoading?: boolean | undefined;
+    rowProps?: ((row: Row<T>) => React.ComponentPropsWithRef<'div'> & {
+        status?: 'positive' | 'warning' | 'negative';
+        isLoading?: boolean;
     }) | undefined;
     isLast: boolean;
     onRowInViewport: React.MutableRefObject<((rowData: T) => void) | undefined>;

package/cjs/core/Table/TableRowMemoized.js

@@ -1,26 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -30,27 +8,27 @@ exports.TableRowMemoized = exports.TableRow = void 0;
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-var react_1 = __importDefault(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var utils_1 = require("../utils");
-var TableCell_1 = require("./TableCell");
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const utils_1 = require("../utils");
+const TableCell_1 = require("./TableCell");
 /**
  * Memoization is needed to avoid unnecessary re-renders of all rows when additional data is added when lazy-loading.
  * Using `isLast` here instead of passing data length to avoid re-renders of all rows when more data is added. Now only the last row re-renders.
  * Although state is not used it is needed for `React.memo` to check state that changes row state e.g. selection.
  * When adding new features check whether it changes state that affects row. If it does then add equality check to `React.memo`.
  */
-var TableRow = function (props) {
+const TableRow = (props) => {
     var _a;
-    var row = props.row, rowProps = props.rowProps, isLast = props.isLast, onRowInViewport = props.onRowInViewport, onBottomReached = props.onBottomReached, intersectionMargin = props.intersectionMargin, onClick = props.onClick, subComponent = props.subComponent, isDisabled = props.isDisabled, tableHasSubRows = props.tableHasSubRows, tableInstance = props.tableInstance, expanderCell = props.expanderCell, bodyRef = props.bodyRef, tableRowRef = props.tableRowRef;
-    var onIntersect = react_1.default.useCallback(function () {
+    const { row, rowProps, isLast, onRowInViewport, onBottomReached, intersectionMargin, onClick, subComponent, isDisabled, tableHasSubRows, tableInstance, expanderCell, bodyRef, tableRowRef, } = props;
+    const onIntersect = react_1.default.useCallback(() => {
         var _a, _b;
         (_a = onRowInViewport.current) === null || _a === void 0 ? void 0 : _a.call(onRowInViewport, row.original);
         isLast && ((_b = onBottomReached.current) === null || _b === void 0 ? void 0 : _b.call(onBottomReached));
     }, [isLast, onBottomReached, onRowInViewport, row.original]);
-    var intersectionRoot = react_1.default.useMemo(function () {
+    const intersectionRoot = react_1.default.useMemo(() => {
         var _a, _b;
-        var isTableBodyScrollable = ((_a = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.scrollHeight) !== null && _a !== void 0 ? _a : 0) > ((_b = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.offsetHeight) !== null && _b !== void 0 ? _b : 0);
+        const isTableBodyScrollable = ((_a = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.scrollHeight) !== null && _a !== void 0 ? _a : 0) > ((_b = bodyRef === null || bodyRef === void 0 ? void 0 : bodyRef.offsetHeight) !== null && _b !== void 0 ? _b : 0);
         // If table body is scrollable, make it the intersection root
         if (isTableBodyScrollable) {
             return bodyRef;
@@ -58,48 +36,50 @@ var TableRow = function (props) {
         // Otherwise, make the viewport the intersection root
         return undefined;
     }, [bodyRef]);
-    var intersectionRef = (0, utils_1.useIntersection)(onIntersect, {
-        rootMargin: "".concat(intersectionMargin, "px"),
+    const intersectionRef = (0, utils_1.useIntersection)(onIntersect, {
+        rootMargin: `${intersectionMargin}px`,
         root: intersectionRoot,
     });
-    var userRowProps = (_a = rowProps === null || rowProps === void 0 ? void 0 : rowProps(row)) !== null && _a !== void 0 ? _a : {};
-    var status = userRowProps.status, isLoading = userRowProps.isLoading, restUserRowProps = __rest(userRowProps, ["status", "isLoading"]);
-    var mergedProps = __assign(__assign(__assign({}, row.getRowProps({ style: { flex: "0 0 auto", minWidth: '100%' } })), restUserRowProps), {
-        className: (0, classnames_1.default)('iui-table-row', {
-            'iui-table-row-expanded': row.isExpanded && subComponent,
-            'iui-loading': isLoading,
-        }, userRowProps === null || userRowProps === void 0 ? void 0 : userRowProps.className),
-        'aria-selected': row.isSelected || undefined,
-        'aria-disabled': isDisabled || undefined,
-        'data-iui-status': status,
-    });
-    var refs = (0, utils_1.useMergedRefs)(intersectionRef, mergedProps.ref, tableRowRef);
+    const userRowProps = (_a = rowProps === null || rowProps === void 0 ? void 0 : rowProps(row)) !== null && _a !== void 0 ? _a : {};
+    const { status, isLoading, ...restUserRowProps } = userRowProps;
+    const mergedProps = {
+        ...row.getRowProps({ style: { flex: `0 0 auto`, minWidth: '100%' } }),
+        ...restUserRowProps,
+        ...{
+            className: (0, classnames_1.default)('iui-table-row', {
+                'iui-table-row-expanded': row.isExpanded && subComponent,
+                'iui-loading': isLoading,
+            }, userRowProps === null || userRowProps === void 0 ? void 0 : userRowProps.className),
+            'aria-selected': row.isSelected || undefined,
+            'aria-disabled': isDisabled || undefined,
+            'data-iui-status': status,
+        },
+    };
+    const refs = (0, utils_1.useMergedRefs)(intersectionRef, mergedProps.ref, tableRowRef);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", __assign({}, mergedProps, { ref: refs, onClick: function (event) {
+        react_1.default.createElement("div", { ...mergedProps, ref: refs, onClick: (event) => {
                 var _a;
                 (_a = mergedProps === null || mergedProps === void 0 ? void 0 : mergedProps.onClick) === null || _a === void 0 ? void 0 : _a.call(mergedProps, event);
                 onClick === null || onClick === void 0 ? void 0 : onClick(event, row);
-            } }), row.cells.map(function (cell, index) {
+            } }, row.cells.map((cell, index) => {
             return (react_1.default.createElement(TableCell_1.TableCell, { key: cell.getCellProps().key, cell: cell, cellIndex: index, isDisabled: isDisabled, tableHasSubRows: tableHasSubRows, tableInstance: tableInstance, expanderCell: expanderCell }));
         })),
         subComponent && (react_1.default.createElement(utils_1.WithCSSTransition, { in: row.isExpanded },
             react_1.default.createElement("div", { className: (0, classnames_1.default)('iui-table-row', 'iui-table-expanded-content'), "aria-disabled": isDisabled }, subComponent(row))))));
 };
 exports.TableRow = TableRow;
-var hasAnySelectedSubRow = function (row, selectedRowIds) {
+const hasAnySelectedSubRow = (row, selectedRowIds) => {
     if (selectedRowIds === null || selectedRowIds === void 0 ? void 0 : selectedRowIds[row.id]) {
         return true;
     }
-    return row.subRows.some(function (subRow) {
-        return hasAnySelectedSubRow(subRow, selectedRowIds);
-    });
+    return row.subRows.some((subRow) => hasAnySelectedSubRow(subRow, selectedRowIds));
 };
-exports.TableRowMemoized = react_1.default.memo(exports.TableRow, function (prevProp, nextProp) {
+exports.TableRowMemoized = react_1.default.memo(exports.TableRow, (prevProp, nextProp) => {
     var _a, _b, _c, _d, _e, _f, _g;
     return prevProp.isLast === nextProp.isLast &&
         ((_a = prevProp.state.hiddenColumns) === null || _a === void 0 ? void 0 : _a.length) ===
             ((_b = nextProp.state.hiddenColumns) === null || _b === void 0 ? void 0 : _b.length) &&
-        !!((_c = prevProp.state.hiddenColumns) === null || _c === void 0 ? void 0 : _c.every(function (column, index) { var _a; return ((_a = nextProp.state.hiddenColumns) === null || _a === void 0 ? void 0 : _a[index]) === column; })) &&
+        !!((_c = prevProp.state.hiddenColumns) === null || _c === void 0 ? void 0 : _c.every((column, index) => { var _a; return ((_a = nextProp.state.hiddenColumns) === null || _a === void 0 ? void 0 : _a[index]) === column; })) &&
         prevProp.onRowInViewport === nextProp.onRowInViewport &&
         prevProp.onBottomReached === nextProp.onBottomReached &&
         prevProp.onClick === nextProp.onClick &&
@@ -107,16 +87,12 @@ exports.TableRowMemoized = react_1.default.memo(exports.TableRow, function (prev
         ((_d = prevProp.state.selectedRowIds) === null || _d === void 0 ? void 0 : _d[prevProp.row.id]) ===
             ((_e = nextProp.state.selectedRowIds) === null || _e === void 0 ? void 0 : _e[nextProp.row.id]) &&
         // Check if sub-rows selection has changed and whether to show indeterminate state or not
-        prevProp.row.subRows.some(function (subRow) {
-            return hasAnySelectedSubRow(subRow, prevProp.state.selectedRowIds);
-        }) ===
-            nextProp.row.subRows.some(function (subRow) {
-                return hasAnySelectedSubRow(subRow, nextProp.state.selectedRowIds);
-            }) &&
+        prevProp.row.subRows.some((subRow) => hasAnySelectedSubRow(subRow, prevProp.state.selectedRowIds)) ===
+            nextProp.row.subRows.some((subRow) => hasAnySelectedSubRow(subRow, nextProp.state.selectedRowIds)) &&
         ((_f = prevProp.state.expanded) === null || _f === void 0 ? void 0 : _f[prevProp.row.id]) ===
             ((_g = nextProp.state.expanded) === null || _g === void 0 ? void 0 : _g[nextProp.row.id]) &&
         prevProp.subComponent === nextProp.subComponent &&
-        prevProp.row.cells.every(function (cell, index) { return nextProp.row.cells[index].column === cell.column; }) &&
+        prevProp.row.cells.every((cell, index) => nextProp.row.cells[index].column === cell.column) &&
         prevProp.isDisabled === nextProp.isDisabled &&
         prevProp.rowProps === nextProp.rowProps &&
         prevProp.expanderCell === nextProp.expanderCell &&

package/cjs/core/Table/actionHandlers/expandHandler.js

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.onExpandHandler = void 0;
-var onExpandHandler = function (newState, instance, onExpand) {
+const onExpandHandler = (newState, instance, onExpand) => {
     if (!(instance === null || instance === void 0 ? void 0 : instance.preFilteredFlatRows.length)) {
         onExpand === null || onExpand === void 0 ? void 0 : onExpand([], newState);
         return;
     }
-    var expandedData = [];
-    instance.preFilteredFlatRows.forEach(function (row) {
+    const expandedData = [];
+    instance.preFilteredFlatRows.forEach((row) => {
         if (newState.expanded[row.id]) {
             expandedData.push(row.original);
         }

package/cjs/core/Table/actionHandlers/filterHandler.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.onFilterHandler = void 0;
-var onFilterHandler = function (newState, action, previousState, instance, onFilter) {
-    var previousFilter = previousState.filters.find(function (f) { return f.id === action.columnId; });
+const onFilterHandler = (newState, action, previousState, instance, onFilter) => {
+    const previousFilter = previousState.filters.find((f) => f.id === action.columnId);
     if ((previousFilter === null || previousFilter === void 0 ? void 0 : previousFilter.value) != action.filterValue) {
-        var filters = newState.filters.map(function (f) {
+        const filters = newState.filters.map((f) => {
             var _a, _b;
-            var column = instance === null || instance === void 0 ? void 0 : instance.allColumns.find(function (c) { return c.id === f.id; });
+            const column = instance === null || instance === void 0 ? void 0 : instance.allColumns.find((c) => c.id === f.id);
             return {
                 id: f.id,
                 value: f.value,

package/cjs/core/Table/actionHandlers/resizeHandler.js

@@ -1,22 +1,20 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.onTableResizeEnd = exports.onTableResizeStart = void 0;
-var onTableResizeStart = function (state) {
-    return __assign(__assign({}, state), { isTableResizing: true });
+const onTableResizeStart = (state) => {
+    return { ...state, isTableResizing: true };
 };
 exports.onTableResizeStart = onTableResizeStart;
-var onTableResizeEnd = function (state, action) {
-    return __assign(__assign({}, state), { isTableResizing: false, columnResizing: __assign(__assign({}, state.columnResizing), { columnWidths: __assign({}, action.columnWidths) }) });
+const onTableResizeEnd = (state, action) => {
+    return {
+        ...state,
+        isTableResizing: false,
+        columnResizing: {
+            ...state.columnResizing,
+            columnWidths: {
+                ...action.columnWidths,
+            },
+        },
+    };
 };
 exports.onTableResizeEnd = onTableResizeEnd;