@itwin/itwinui-react 3.12.2 → 3.13.0

package/esm/core/Table/hooks/useResizeColumns.js

@@ -4,37 +4,33 @@ export const useResizeColumns = (ownerDocument) => (hooks) => {
   hooks.stateReducers.push(reducer);
   hooks.useInstanceBeforeDimensions.push(useInstanceBeforeDimensions);
 };
-const isTouchEvent = (event) => {
-  return event.type === 'touchstart';
-};
-const defaultGetResizerProps =
+let isTouchEvent = (event) => 'touchstart' === event.type;
+let defaultGetResizerProps =
   (ownerDocument) =>
   (props, { instance, header, nextHeader }) => {
-    const { dispatch } = instance;
-    const onResizeStart = (e, header) => {
-      if (isTouchEvent(e) && e.touches && e.touches.length > 1) {
-        return;
-      }
-      const headerIdWidths = getLeafHeaders(header).map((d) => [
+    let { dispatch } = instance;
+    let onResizeStart = (e, header) => {
+      if (isTouchEvent(e) && e.touches && e.touches.length > 1) return;
+      let headerIdWidths = getLeafHeaders(header).map((d) => [
         d.id,
         getHeaderWidth(d),
       ]);
-      const nextHeaderIdWidths = nextHeader
+      let nextHeaderIdWidths = nextHeader
         ? getLeafHeaders(nextHeader).map((d) => [d.id, getHeaderWidth(d)])
         : [];
-      const clientX = isTouchEvent(e)
+      let clientX = isTouchEvent(e)
         ? Math.round(e.touches[0].clientX)
         : e.clientX;
-      const dispatchMove = (clientXPos) =>
+      let dispatchMove = (clientXPos) =>
         dispatch({
           type: actions.columnResizing,
           clientX: clientXPos,
         });
-      const dispatchEnd = () =>
+      let dispatchEnd = () =>
         dispatch({
           type: actions.columnDoneResizing,
         });
-      const handlersAndEvents = {
+      let handlersAndEvents = {
         mouse: {
           moveEvent: 'mousemove',
           moveHandler: (e) => dispatchMove(e.clientX),
@@ -78,14 +74,12 @@ const defaultGetResizerProps =
           },
         },
       };
-      const events = isTouchEvent(e)
+      let events = isTouchEvent(e)
         ? handlersAndEvents.touch
         : handlersAndEvents.mouse;
-      const passiveIfSupported = passiveEventSupported()
-        ? {
-            passive: false,
-          }
-        : false;
+      let passiveIfSupported = !!passiveEventSupported() && {
+        passive: false,
+      };
       ownerDocument.current?.addEventListener(
         events.moveEvent,
         events.moveHandler,
@@ -96,13 +90,12 @@ const defaultGetResizerProps =
         events.upHandler,
         passiveIfSupported,
       );
-      if (!isTouchEvent(e)) {
+      if (!isTouchEvent(e))
         ownerDocument.current?.addEventListener(
           'mouseleave',
           handlersAndEvents.mouse.upHandler,
           passiveIfSupported,
         );
-      }
       dispatch({
         type: actions.columnStartResizing,
         columnId: header.id,
@@ -139,25 +132,23 @@ const defaultGetResizerProps =
     ];
   };
 useResizeColumns.pluginName = 'useResizeColumns';
-const reducer = (newState, action, previousState, instance) => {
-  if (action.type === actions.init) {
+let reducer = (newState, action, previousState, instance) => {
+  if (action.type === actions.init)
     return {
       ...newState,
       columnResizing: {
         columnWidths: {},
       },
     };
-  }
-  if (action.type === actions.resetResize) {
+  if (action.type === actions.resetResize)
     return {
       ...newState,
       columnResizing: {
         columnWidths: {},
       },
     };
-  }
   if (action.type === actions.columnStartResizing) {
-    const {
+    let {
       clientX,
       columnId,
       columnWidth,
@@ -179,26 +170,21 @@ const reducer = (newState, action, previousState, instance) => {
     };
   }
   if (action.type === actions.columnResizing) {
-    const { clientX } = action;
-    const {
+    let { clientX } = action;
+    let {
       startX = 0,
       columnWidth = 1,
       nextColumnWidth = 1,
       headerIdWidths = [],
       nextHeaderIdWidths = [],
     } = newState.columnResizing;
-    if (!instance) {
-      return newState;
-    }
-    const deltaX = clientX - startX;
-    const newColumnWidths = getColumnWidths(
-      headerIdWidths,
-      deltaX / columnWidth,
-    );
-    const isTableWidthDecreasing =
+    if (!instance) return newState;
+    let deltaX = clientX - startX;
+    let newColumnWidths = getColumnWidths(headerIdWidths, deltaX / columnWidth);
+    let isTableWidthDecreasing =
       calculateTableWidth(newColumnWidths, instance.flatHeaders) <
       instance.tableWidth;
-    const newNextColumnWidths =
+    let newNextColumnWidths =
       instance?.columnResizeMode === 'fit' ||
       (instance?.columnResizeMode === 'expand' && isTableWidthDecreasing)
         ? getColumnWidths(nextHeaderIdWidths, -deltaX / nextColumnWidth)
@@ -213,13 +199,10 @@ const reducer = (newState, action, previousState, instance) => {
         },
         instance,
       )
-    ) {
+    )
       return newState;
-    }
     instance?.flatHeaders.forEach((h) => {
-      if (!h.width) {
-        h.width = h.resizeWidth;
-      }
+      if (!h.width) h.width = h.resizeWidth;
     });
     return {
       ...newState,
@@ -233,20 +216,19 @@ const reducer = (newState, action, previousState, instance) => {
       },
     };
   }
-  if (action.type === actions.columnDoneResizing) {
+  if (action.type === actions.columnDoneResizing)
     return {
       ...newState,
       columnResizing: {
         ...newState.columnResizing,
-        startX: undefined,
-        isResizingColumn: undefined,
+        startX: void 0,
+        isResizingColumn: void 0,
       },
     };
-  }
   return newState;
 };
-const getColumnWidths = (headerIdWidths, deltaPercentage) => {
-  const columnWidths = {};
+let getColumnWidths = (headerIdWidths, deltaPercentage) => {
+  let columnWidths = {};
   headerIdWidths.forEach(([headerId, headerWidth]) => {
     columnWidths[headerId] = Math.max(
       headerWidth + headerWidth * deltaPercentage,
@@ -255,67 +237,54 @@ const getColumnWidths = (headerIdWidths, deltaPercentage) => {
   });
   return columnWidths;
 };
-const isNewColumnWidthsValid = (columnWidths, headers) => {
-  if (Object.values(columnWidths).some((width) => width <= 1)) {
-    return false;
-  }
-  for (const [headerId, width] of Object.entries(columnWidths)) {
-    const header = headers?.find((h) => h.id === headerId);
-    if (!header) {
-      continue;
-    }
-    const minWidth = header.minWidth || 0;
-    const maxWidth = header.maxWidth || Infinity;
-    if (width < minWidth || width > maxWidth) {
-      return false;
-    }
+let isNewColumnWidthsValid = (columnWidths, headers) => {
+  if (Object.values(columnWidths).some((width) => width <= 1)) return false;
+  for (let [headerId, width] of Object.entries(columnWidths)) {
+    let header = headers?.find((h) => h.id === headerId);
+    if (!header) continue;
+    let minWidth = header.minWidth || 0;
+    let maxWidth = header.maxWidth || 1 / 0;
+    if (width < minWidth || width > maxWidth) return false;
   }
   return true;
 };
-const isNewTableWidthValid = (columnWidths, instance) => {
-  if (instance.columnResizeMode === 'fit') {
-    return true;
-  }
+let isNewTableWidthValid = (columnWidths, instance) => {
+  if ('fit' === instance.columnResizeMode) return true;
   let newTableWidth = 0;
-  for (const header of instance.flatHeaders) {
+  for (let header of instance.flatHeaders)
     newTableWidth += columnWidths[header.id]
       ? columnWidths[header.id]
       : getHeaderWidth(header);
-  }
-  if (Math.round(newTableWidth) < instance.tableWidth) {
-    return false;
-  }
+  if (Math.round(newTableWidth) < instance.tableWidth) return false;
   return true;
 };
-const useInstanceBeforeDimensions = (instance) => {
-  const {
+let useInstanceBeforeDimensions = (instance) => {
+  let {
     flatHeaders,
     getHooks,
     state: { columnResizing },
     columnResizeMode,
   } = instance;
-  const getInstance = useGetLatest(instance);
+  let getInstance = useGetLatest(instance);
   flatHeaders.forEach((header, index) => {
-    const resizeWidth = columnResizing.columnWidths[header.id];
+    let resizeWidth = columnResizing.columnWidths[header.id];
     header.width = resizeWidth || header.width || header.originalWidth;
     header.isResizing = columnResizing.isResizingColumn === header.id;
-    const headerToResize =
-      header.disableResizing && columnResizeMode === 'fit'
+    let headerToResize =
+      header.disableResizing && 'fit' === columnResizeMode
         ? getPreviousResizableHeader(header, instance)
         : header;
-    const nextResizableHeader =
-      columnResizeMode === 'expand' && index === flatHeaders.length - 1
+    let nextResizableHeader =
+      'expand' === columnResizeMode && index === flatHeaders.length - 1
         ? getPreviousResizableHeader(header, instance)
         : getNextResizableHeader(header, instance);
     header.canResize =
-      header.disableResizing != null ? !header.disableResizing : true;
-    if (columnResizeMode === 'fit') {
+      null == header.disableResizing || !header.disableResizing;
+    if ('fit' === columnResizeMode)
       header.isResizerVisible =
         (header.canResize && !!nextResizableHeader) ||
         (headerToResize && !!instance.flatHeaders[index + 1]?.canResize);
-    } else {
-      header.isResizerVisible = header.canResize && !!headerToResize;
-    }
+    else header.isResizerVisible = header.canResize && !!headerToResize;
     header.getResizerProps = makePropGetter(getHooks().getResizerProps, {
       instance: getInstance(),
       header: headerToResize,
@@ -323,60 +292,54 @@ const useInstanceBeforeDimensions = (instance) => {
     });
   });
 };
-const getPreviousResizableHeader = (headerColumn, instance) => {
-  const headersList = (
+let getPreviousResizableHeader = (headerColumn, instance) => {
+  let headersList = (
     headerColumn.parent?.columns || instance.flatHeaders
   ).filter(({ isVisible }) => isVisible);
-  const headerIndex = headersList.findIndex((h) => h.id === headerColumn.id);
+  let headerIndex = headersList.findIndex((h) => h.id === headerColumn.id);
   return [...headersList]
     .slice(0, headerIndex)
     .reverse()
     .find((h) => !h.disableResizing);
 };
-const getNextResizableHeader = (headerColumn, instance) => {
-  const headersList = (
+let getNextResizableHeader = (headerColumn, instance) => {
+  let headersList = (
     headerColumn.parent?.columns || instance.flatHeaders
   ).filter(({ isVisible }) => isVisible);
-  const headerIndex = headersList.findIndex((h) => h.id === headerColumn.id);
+  let headerIndex = headersList.findIndex((h) => h.id === headerColumn.id);
   return [...headersList]
     .slice(headerIndex + 1)
     .find((h) => !h.disableResizing);
 };
 function getLeafHeaders(header) {
-  const leafHeaders = [];
-  const recurseHeader = (header) => {
-    if (header.columns && header.columns.length) {
+  let leafHeaders = [];
+  let recurseHeader = (header) => {
+    if (header.columns && header.columns.length)
       header.columns.map(recurseHeader);
-    }
     leafHeaders.push(header);
   };
   recurseHeader(header);
   return leafHeaders;
 }
-const getHeaderWidth = (header) => {
-  if (!header) {
-    return 0;
-  }
-  return typeof header.width === 'string' && Number.isNaN(Number(header.width))
+let getHeaderWidth = (header) => {
+  if (!header) return 0;
+  return 'string' == typeof header.width && Number.isNaN(Number(header.width))
     ? Number(header.resizeWidth || 0)
     : Number(header.width || header.resizeWidth || 0);
 };
-const calculateTableWidth = (columnWidths, headers) => {
+let calculateTableWidth = (columnWidths, headers) => {
   let newTableWidth = 0;
-  for (const header of headers) {
+  for (let header of headers)
     newTableWidth += columnWidths[header.id]
       ? columnWidths[header.id]
       : getHeaderWidth(header);
-  }
   return newTableWidth;
 };
 let passiveSupported = null;
-const passiveEventSupported = () => {
-  if (passiveSupported != null) {
-    return passiveSupported;
-  }
+let passiveEventSupported = () => {
+  if (null != passiveSupported) return passiveSupported;
   try {
-    const options = {
+    let options = {
       once: true,
       get passive() {
         passiveSupported = true;

package/esm/core/Table/hooks/useScrollToRow.js

@@ -6,34 +6,27 @@ export function useScrollToRow({
   paginatorRenderer,
   scrollToRow,
 }) {
-  const rowRefs = React.useRef({});
-  const pageRef = React.useRef(page);
+  let rowRefs = React.useRef({});
+  let pageRef = React.useRef(page);
   pageRef.current = page;
-  const dataRef = React.useRef(data);
+  let dataRef = React.useRef(data);
   dataRef.current = data;
-  const scrollToIndex = React.useMemo(() => {
-    if (!scrollToRow || paginatorRenderer) {
-      return undefined;
-    }
-    const index = scrollToRow(pageRef.current, dataRef.current);
-    return index < 0 ? undefined : index;
+  let scrollToIndex = React.useMemo(() => {
+    if (!scrollToRow || paginatorRenderer) return;
+    let index = scrollToRow(pageRef.current, dataRef.current);
+    return index < 0 ? void 0 : index;
   }, [paginatorRenderer, scrollToRow]);
   React.useEffect(() => {
-    if (
-      enableVirtualization ||
-      scrollToIndex === undefined ||
-      scrollToIndex === null ||
-      scrollToIndex < 0
-    ) {
+    if (enableVirtualization || null == scrollToIndex || scrollToIndex < 0)
       return;
-    }
     rowRefs.current[pageRef.current[scrollToIndex]?.id]?.scrollIntoView();
   }, [enableVirtualization, scrollToIndex]);
-  const tableRowRef = React.useCallback((row) => {
-    return (element) => {
+  let tableRowRef = React.useCallback(
+    (row) => (element) => {
       rowRefs.current[row.id] = element;
-    };
-  }, []);
+    },
+    [],
+  );
   return {
     scrollToIndex,
     tableRowRef,

package/esm/core/Table/hooks/useSelectionCell.js

@@ -2,11 +2,9 @@ import { SelectionColumn, SELECTION_CELL_ID } from '../columns/index.js';
 export const useSelectionCell =
   (isSelectable, selectionMode, isRowDisabled, density = 'default') =>
   (hooks) => {
-    if (!isSelectable) {
-      return;
-    }
+    if (!isSelectable) return;
     hooks.allColumns.push((columns) =>
-      selectionMode === 'single' ||
+      'single' === selectionMode ||
       columns.find((c) => c.id === SELECTION_CELL_ID)
         ? columns
         : [

package/esm/core/Table/hooks/useStickyColumns.js

@@ -5,17 +5,16 @@ export const useStickyColumns = (hooks) => {
   hooks.stateReducers.push(reducer);
   hooks.useInstance.push(useInstance);
 };
-const reducer = (newState, action) => {
-  if (action.type === actions.init) {
+let reducer = (newState, action) => {
+  if (action.type === actions.init)
     return {
       ...newState,
       sticky: {},
     };
-  }
   if (
     action.type === actions.setScrolledLeft &&
     newState.sticky?.isScrolledToLeft !== action.value
-  ) {
+  )
     return {
       ...newState,
       sticky: {
@@ -23,11 +22,10 @@ const reducer = (newState, action) => {
         isScrolledToLeft: action.value,
       },
     };
-  }
   if (
     action.type === actions.setScrolledRight &&
     newState.sticky?.isScrolledToRight !== action.value
-  ) {
+  )
     return {
       ...newState,
       sticky: {
@@ -35,34 +33,23 @@ const reducer = (newState, action) => {
         isScrolledToRight: action.value,
       },
     };
-  }
   return newState;
 };
-const useInstance = (instance) => {
-  const { flatHeaders } = instance;
+let useInstance = (instance) => {
+  let { flatHeaders } = instance;
   flatHeaders.forEach((header) => {
-    if (!header.originalSticky) {
-      header.originalSticky = header.sticky ?? 'none';
-    }
+    if (!header.originalSticky) header.originalSticky = header.sticky ?? 'none';
     header.sticky =
-      header.originalSticky === 'none' ? undefined : header.originalSticky;
+      'none' === header.originalSticky ? void 0 : header.originalSticky;
   });
   let hasLeftStickyColumn = false;
   [...flatHeaders].reverse().forEach((header) => {
-    if (header.sticky === 'left') {
-      hasLeftStickyColumn = true;
-    }
-    if (hasLeftStickyColumn) {
-      header.sticky = 'left';
-    }
+    if ('left' === header.sticky) hasLeftStickyColumn = true;
+    if (hasLeftStickyColumn) header.sticky = 'left';
   });
   let hasRightStickyColumn = false;
   flatHeaders.forEach((header) => {
-    if (header.sticky === 'right') {
-      hasRightStickyColumn = true;
-    }
-    if (hasRightStickyColumn) {
-      header.sticky = 'right';
-    }
+    if ('right' === header.sticky) hasRightStickyColumn = true;
+    if (hasRightStickyColumn) header.sticky = 'right';
   });
 };

package/esm/core/Table/hooks/useSubRowFiltering.js

@@ -3,25 +3,21 @@ import { defaultFilterFunctions } from '../filters/defaultFilterFunctions.js';
 export const useSubRowFiltering = (hasAnySubRows) => (hooks) => {
   hooks.useInstance.push(useInstance.bind({}, hasAnySubRows));
 };
-const useInstance = (hasAnySubRows, instance) => {
-  const setInitialSubRows = (rows) => {
+let useInstance = (hasAnySubRows, instance) => {
+  let setInitialSubRows = (rows) => {
     rows.forEach((row) => {
-      if (!row.initialSubRows) {
-        row.initialSubRows = row.subRows;
-      }
+      if (!row.initialSubRows) row.initialSubRows = row.subRows;
       setInitialSubRows(row.subRows);
     });
   };
   setInitialSubRows(instance.initialRows);
-  const {
+  let {
     filteredRows = instance.filteredRows,
     filteredFlatRows = instance.filteredFlatRows,
     filteredRowsById = instance.filteredRowsById,
   } = React.useMemo(() => {
-    if (!hasAnySubRows) {
-      return {};
-    }
-    const setSubRows = (rows) => {
+    if (!hasAnySubRows) return {};
+    let setSubRows = (rows) => {
       rows.forEach((row) => {
         row.subRows = row.initialSubRows ?? [];
         setSubRows(row.subRows);
@@ -30,34 +26,28 @@ const useInstance = (hasAnySubRows, instance) => {
     setSubRows(instance.initialRows);
     let currentlyFilteredRows = [...instance.initialRows];
     instance.state.filters.forEach(({ id: columnId, value: filterValue }) => {
-      const column = instance.allColumns.find((c) => c.id === columnId);
-      if (!column) {
-        return;
-      }
-      const filterTypes = {
+      let column = instance.allColumns.find((c) => c.id === columnId);
+      if (!column) return;
+      let filterTypes = {
         ...defaultFilterFunctions,
         ...instance.filterTypes,
       };
-      const filterFn =
-        typeof column.filter === 'function'
+      let filterFn =
+        'function' == typeof column.filter
           ? column.filter
           : filterTypes[column.filter ?? 'text'];
       currentlyFilteredRows = currentlyFilteredRows.filter((row) =>
         handleRowFiltering(row, filterFn, columnId, filterValue),
       );
     });
-    const filteredRows = [];
-    const filteredFlatRows = [];
-    const filteredRowsById = {};
-    const populateRows = (row) => {
-      if (row.depth === 0) {
-        filteredRows.push(row);
-      }
+    let filteredRows = [];
+    let filteredFlatRows = [];
+    let filteredRowsById = {};
+    let populateRows = (row) => {
+      if (0 === row.depth) filteredRows.push(row);
       filteredFlatRows.push(row);
       filteredRowsById[row.id] = row;
-      if (row.subRows.length) {
-        row.subRows.forEach((r) => populateRows(r));
-      }
+      if (row.subRows.length) row.subRows.forEach((r) => populateRows(r));
     };
     currentlyFilteredRows.forEach((row) => populateRows(row));
     return {
@@ -81,18 +71,14 @@ const useInstance = (hasAnySubRows, instance) => {
     rowsById: filteredRowsById,
   });
 };
-const handleRowFiltering = (row, filterFn, columnId, filterValue) => {
+let handleRowFiltering = (row, filterFn, columnId, filterValue) => {
   let hasFilteredSubRows = false;
   row.subRows = row.initialSubRows.filter((subRow) => {
-    const result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
-    if (result) {
-      hasFilteredSubRows = true;
-    }
+    let result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
+    if (result) hasFilteredSubRows = true;
     return result;
   });
-  if (hasFilteredSubRows) {
-    return true;
-  }
-  const result = filterFn([row], [columnId], filterValue);
+  if (hasFilteredSubRows) return true;
+  let result = filterFn([row], [columnId], filterValue);
   return !!result.length;
 };

package/esm/core/Table/hooks/useSubRowSelection.js

@@ -2,16 +2,15 @@ import * as React from 'react';
 export const useSubRowSelection = (hooks) => {
   hooks.useInstance.push(useInstance);
 };
-const useInstance = (instance) => {
-  const selectedFlatRows = React.useMemo(() => {
-    const selectedFlatRows = [];
-    const setSelectionState = (row, selectedRowIds) => {
+let useInstance = (instance) => {
+  let selectedFlatRows = React.useMemo(() => {
+    let selectedFlatRows = [];
+    let setSelectionState = (row, selectedRowIds) => {
       let isSomeSubRowsSelected = false;
       row.initialSubRows.forEach((subRow) => {
         setSelectionState(subRow, selectedRowIds);
-        if (subRow.isSelected || subRow.isSomeSelected) {
+        if (subRow.isSelected || subRow.isSomeSelected)
           isSomeSubRowsSelected = true;
-        }
       });
       if (selectedRowIds[row.id]) {
         row.isSelected = true;