@itwin/itwinui-react 3.13.4 → 3.14.1

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

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

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

@@ -1,47 +1,55 @@
 import { actions } from 'react-table';
 actions.setScrolledLeft = 'setScrolledLeft';
 actions.setScrolledRight = 'setScrolledRight';
-export const useStickyColumns = (hooks)=>{
-    hooks.stateReducers.push(reducer);
-    hooks.useInstance.push(useInstance);
+export const useStickyColumns = (hooks) => {
+  hooks.stateReducers.push(reducer);
+  hooks.useInstance.push(useInstance);
 };
-let reducer = (newState, action)=>{
-    if (action.type === actions.init) return {
-        ...newState,
-        sticky: {}
+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: {
-            ...newState.sticky,
-            isScrolledToLeft: action.value
-        }
+  if (
+    action.type === actions.setScrolledLeft &&
+    newState.sticky?.isScrolledToLeft !== action.value
+  )
+    return {
+      ...newState,
+      sticky: {
+        ...newState.sticky,
+        isScrolledToLeft: action.value,
+      },
     };
-    if (action.type === actions.setScrolledRight && newState.sticky?.isScrolledToRight !== action.value) return {
-        ...newState,
-        sticky: {
-            ...newState.sticky,
-            isScrolledToRight: action.value
-        }
+  if (
+    action.type === actions.setScrolledRight &&
+    newState.sticky?.isScrolledToRight !== action.value
+  )
+    return {
+      ...newState,
+      sticky: {
+        ...newState.sticky,
+        isScrolledToRight: action.value,
+      },
     };
-    return newState;
+  return newState;
 };
-let useInstance = (instance)=>{
-    let { flatHeaders } = instance;
-    flatHeaders.forEach((header)=>{
-        if (!header.originalSticky) header.originalSticky = header.sticky ?? 'none';
-        header.sticky = 'none' === header.originalSticky ? void 0 : header.originalSticky;
-    });
-    let hasLeftStickyColumn = false;
-    [
-        ...flatHeaders
-    ].reverse().forEach((header)=>{
-        if ('left' === header.sticky) hasLeftStickyColumn = true;
-        if (hasLeftStickyColumn) header.sticky = 'left';
-    });
-    let hasRightStickyColumn = false;
-    flatHeaders.forEach((header)=>{
-        if ('right' === header.sticky) hasRightStickyColumn = true;
-        if (hasRightStickyColumn) header.sticky = 'right';
-    });
+let useInstance = (instance) => {
+  let { flatHeaders } = instance;
+  flatHeaders.forEach((header) => {
+    if (!header.originalSticky) header.originalSticky = header.sticky ?? 'none';
+    header.sticky =
+      'none' === header.originalSticky ? void 0 : header.originalSticky;
+  });
+  let hasLeftStickyColumn = false;
+  [...flatHeaders].reverse().forEach((header) => {
+    if ('left' === header.sticky) hasLeftStickyColumn = true;
+    if (hasLeftStickyColumn) header.sticky = 'left';
+  });
+  let hasRightStickyColumn = false;
+  flatHeaders.forEach((header) => {
+    if ('right' === header.sticky) hasRightStickyColumn = true;
+    if (hasRightStickyColumn) header.sticky = 'right';
+  });
 };

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

@@ -1,81 +1,84 @@
 import * as React from 'react';
 import { defaultFilterFunctions } from '../filters/defaultFilterFunctions.js';
-export const useSubRowFiltering = (hasAnySubRows)=>(hooks)=>{
-        hooks.useInstance.push(useInstance.bind({}, hasAnySubRows));
-    };
-let useInstance = (hasAnySubRows, instance)=>{
-    let setInitialSubRows = (rows)=>{
-        rows.forEach((row)=>{
-            if (!row.initialSubRows) row.initialSubRows = row.subRows;
-            setInitialSubRows(row.subRows);
-        });
+export const useSubRowFiltering = (hasAnySubRows) => (hooks) => {
+  hooks.useInstance.push(useInstance.bind({}, hasAnySubRows));
+};
+let useInstance = (hasAnySubRows, instance) => {
+  let setInitialSubRows = (rows) => {
+    rows.forEach((row) => {
+      if (!row.initialSubRows) row.initialSubRows = row.subRows;
+      setInitialSubRows(row.subRows);
+    });
+  };
+  setInitialSubRows(instance.initialRows);
+  let {
+    filteredRows = instance.filteredRows,
+    filteredFlatRows = instance.filteredFlatRows,
+    filteredRowsById = instance.filteredRowsById,
+  } = React.useMemo(() => {
+    if (!hasAnySubRows) return {};
+    let setSubRows = (rows) => {
+      rows.forEach((row) => {
+        row.subRows = row.initialSubRows ?? [];
+        setSubRows(row.subRows);
+      });
     };
-    setInitialSubRows(instance.initialRows);
-    let { filteredRows = instance.filteredRows, filteredFlatRows = instance.filteredFlatRows, filteredRowsById = instance.filteredRowsById } = React.useMemo(()=>{
-        if (!hasAnySubRows) return {};
-        let setSubRows = (rows)=>{
-            rows.forEach((row)=>{
-                row.subRows = row.initialSubRows ?? [];
-                setSubRows(row.subRows);
-            });
-        };
-        setSubRows(instance.initialRows);
-        let currentlyFilteredRows = [
-            ...instance.initialRows
-        ];
-        instance.state.filters.forEach(({ id: columnId, value: filterValue })=>{
-            let column = instance.allColumns.find((c)=>c.id === columnId);
-            if (!column) return;
-            let filterTypes = {
-                ...defaultFilterFunctions,
-                ...instance.filterTypes
-            };
-            let filterFn = 'function' == typeof column.filter ? column.filter : filterTypes[column.filter ?? 'text'];
-            currentlyFilteredRows = currentlyFilteredRows.filter((row)=>handleRowFiltering(row, filterFn, columnId, filterValue));
-        });
-        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));
-        };
-        currentlyFilteredRows.forEach((row)=>populateRows(row));
-        return {
-            filteredRows,
-            filteredFlatRows,
-            filteredRowsById
-        };
-    }, [
-        instance.allColumns,
-        instance.filterTypes,
-        instance.initialRows,
-        instance.state.filters,
-        hasAnySubRows
-    ]);
-    Object.assign(instance, {
-        filteredRows,
-        filteredFlatRows,
-        filteredRowsById,
-        rows: filteredRows,
-        flatRows: filteredFlatRows,
-        rowsById: filteredRowsById
+    setSubRows(instance.initialRows);
+    let currentlyFilteredRows = [...instance.initialRows];
+    instance.state.filters.forEach(({ id: columnId, value: filterValue }) => {
+      let column = instance.allColumns.find((c) => c.id === columnId);
+      if (!column) return;
+      let filterTypes = {
+        ...defaultFilterFunctions,
+        ...instance.filterTypes,
+      };
+      let filterFn =
+        'function' == typeof column.filter
+          ? column.filter
+          : filterTypes[column.filter ?? 'text'];
+      currentlyFilteredRows = currentlyFilteredRows.filter((row) =>
+        handleRowFiltering(row, filterFn, columnId, filterValue),
+      );
     });
+    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));
+    };
+    currentlyFilteredRows.forEach((row) => populateRows(row));
+    return {
+      filteredRows,
+      filteredFlatRows,
+      filteredRowsById,
+    };
+  }, [
+    instance.allColumns,
+    instance.filterTypes,
+    instance.initialRows,
+    instance.state.filters,
+    hasAnySubRows,
+  ]);
+  Object.assign(instance, {
+    filteredRows,
+    filteredFlatRows,
+    filteredRowsById,
+    rows: filteredRows,
+    flatRows: filteredFlatRows,
+    rowsById: filteredRowsById,
+  });
 };
-let handleRowFiltering = (row, filterFn, columnId, filterValue)=>{
-    let hasFilteredSubRows = false;
-    row.subRows = row.initialSubRows.filter((subRow)=>{
-        let result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
-        if (result) hasFilteredSubRows = true;
-        return result;
-    });
-    if (hasFilteredSubRows) return true;
-    let result = filterFn([
-        row
-    ], [
-        columnId
-    ], filterValue);
-    return !!result.length;
+let handleRowFiltering = (row, filterFn, columnId, filterValue) => {
+  let hasFilteredSubRows = false;
+  row.subRows = row.initialSubRows.filter((subRow) => {
+    let result = handleRowFiltering(subRow, filterFn, columnId, filterValue);
+    if (result) hasFilteredSubRows = true;
+    return result;
+  });
+  if (hasFilteredSubRows) return true;
+  let result = filterFn([row], [columnId], filterValue);
+  return !!result.length;
 };

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

@@ -1,32 +1,32 @@
 import * as React from 'react';
-export const useSubRowSelection = (hooks)=>{
-    hooks.useInstance.push(useInstance);
+export const useSubRowSelection = (hooks) => {
+  hooks.useInstance.push(useInstance);
 };
-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) isSomeSubRowsSelected = true;
-            });
-            if (selectedRowIds[row.id]) {
-                row.isSelected = true;
-                row.isSomeSelected = false;
-                selectedFlatRows.push(row);
-            } else {
-                row.isSelected = false;
-                row.isSomeSelected = isSomeSubRowsSelected;
-            }
-        };
-        instance.rows.forEach((row)=>setSelectionState(row, instance.state.selectedRowIds));
-        return selectedFlatRows;
-    }, [
-        instance.rows,
-        instance.state.selectedRowIds
-    ]);
-    Object.assign(instance, {
-        selectedFlatRows
-    });
+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)
+          isSomeSubRowsSelected = true;
+      });
+      if (selectedRowIds[row.id]) {
+        row.isSelected = true;
+        row.isSomeSelected = false;
+        selectedFlatRows.push(row);
+      } else {
+        row.isSelected = false;
+        row.isSomeSelected = isSomeSubRowsSelected;
+      }
+    };
+    instance.rows.forEach((row) =>
+      setSelectionState(row, instance.state.selectedRowIds),
+    );
+    return selectedFlatRows;
+  }, [instance.rows, instance.state.selectedRowIds]);
+  Object.assign(instance, {
+    selectedFlatRows,
+  });
 };

package/DEV-esm/core/Table/index.js

@@ -2,4 +2,8 @@ export { Table } from './Table.js';
 export { BaseFilter, FilterButtonBar, tableFilters } from './filters/index.js';
 export { DefaultCell, EditableCell } from './cells/index.js';
 export { TablePaginator } from './TablePaginator.js';
-export { ActionColumn, ExpanderColumn, SelectionColumn } from './columns/index.js';
+export {
+  ActionColumn,
+  ExpanderColumn,
+  SelectionColumn,
+} from './columns/index.js';

package/DEV-esm/core/Table/utils.js

@@ -1,49 +1,50 @@
 import * as React from 'react';
-export const getCellStyle = (column, isTableResizing)=>{
-    let style = {};
-    style.flex = "1 1 145px";
-    if (column.width) {
-        let width = 'string' == typeof column.width ? column.width : `${column.width}px`;
-        style.width = width;
-        if (isTableResizing && column.canResize) style.flex = `${Number(column.width)} ${Number(column.width)} ${width}`;
-        else style.flex = `0 0 ${width}`;
-    }
-    if (column.maxWidth) style.maxWidth = `${column.maxWidth}px`;
-    if (column.minWidth) style.minWidth = `${column.minWidth}px`;
-    return style;
+export const getCellStyle = (column, isTableResizing) => {
+  let style = {};
+  style.flex = '1 1 145px';
+  if (column.width) {
+    let width =
+      'string' == typeof column.width ? column.width : `${column.width}px`;
+    style.width = width;
+    if (isTableResizing && column.canResize)
+      style.flex = `${Number(column.width)} ${Number(column.width)} ${width}`;
+    else style.flex = `0 0 ${width}`;
+  }
+  if (column.maxWidth) style.maxWidth = `${column.maxWidth}px`;
+  if (column.minWidth) style.minWidth = `${column.minWidth}px`;
+  return style;
 };
-export const getStickyStyle = (column, columnList)=>{
-    if (!column.sticky) return {};
-    let left = 0;
-    for (let col of columnList){
-        if (col.id === column.id) break;
-        left += Number(col.width || col.resizeWidth || 0);
-    }
-    let right = 0;
-    for (let col of [
-        ...columnList
-    ].reverse()){
-        if (col.id === column.id) break;
-        right += Number(col.width || col.resizeWidth || 0);
-    }
-    return {
-        '--iui-table-sticky-left': 'left' === column.sticky ? `${left}px` : void 0,
-        '--iui-table-sticky-right': 'right' === column.sticky ? `${right}px` : void 0
-    };
+export const getStickyStyle = (column, columnList) => {
+  if (!column.sticky) return {};
+  let left = 0;
+  for (let col of columnList) {
+    if (col.id === column.id) break;
+    left += Number(col.width || col.resizeWidth || 0);
+  }
+  let right = 0;
+  for (let col of [...columnList].reverse()) {
+    if (col.id === column.id) break;
+    right += Number(col.width || col.resizeWidth || 0);
+  }
+  return {
+    '--iui-table-sticky-left': 'left' === column.sticky ? `${left}px` : void 0,
+    '--iui-table-sticky-right':
+      'right' === column.sticky ? `${right}px` : void 0,
+  };
 };
-export const getSubRowStyle = ({ density = 'default', depth = 1 })=>{
-    let cellPadding = 16;
-    let expanderMargin = 8;
-    if ('condensed' === density) {
-        cellPadding = 12;
-        expanderMargin = 4;
-    } else if ('extra-condensed' === density) {
-        cellPadding = 8;
-        expanderMargin = 4;
-    }
-    let multiplier = 26 + expanderMargin;
-    return {
-        paddingInlineStart: cellPadding + depth * multiplier
-    };
+export const getSubRowStyle = ({ density = 'default', depth = 1 }) => {
+  let cellPadding = 16;
+  let expanderMargin = 8;
+  if ('condensed' === density) {
+    cellPadding = 12;
+    expanderMargin = 4;
+  } else if ('extra-condensed' === density) {
+    cellPadding = 8;
+    expanderMargin = 4;
+  }
+  let multiplier = 26 + expanderMargin;
+  return {
+    paddingInlineStart: cellPadding + depth * multiplier,
+  };
 };
 export const TableColumnsContext = React.createContext([]);