@fluentui/react-table 9.0.0-rc.5 → 9.0.1

package/lib-amd/hooks/createColumn.js

@@ -0,0 +1,36 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.createTableColumn = void 0;
+    var defaultCompare = function () { return 0; };
+    var defaultRenderCell = function () {
+        if (process.env.NODE_ENV !== 'production') {
+            // eslint-disable-next-line no-console
+            console.warn('@fluentui/react-table: You are using the default column renderCell function that renders null');
+        }
+        return null;
+    };
+    var defaultRenderHeaderCell = function () {
+        if (process.env.NODE_ENV !== 'production') {
+            // eslint-disable-next-line no-console
+            console.warn('@fluentui/react-table: You are using the default column renderHeaderCell function that renders null');
+        }
+        return null;
+    };
+    /**
+     * Helper function to create column definition with defaults
+     * @param options - column definition options
+     * @returns - column definition with defaults
+     */
+    function createTableColumn(options) {
+        var columnId = options.columnId, _a = options.renderCell, renderCell = _a === void 0 ? defaultRenderCell : _a, _b = options.renderHeaderCell, renderHeaderCell = _b === void 0 ? defaultRenderHeaderCell : _b, _c = options.compare, compare = _c === void 0 ? defaultCompare : _c;
+        return {
+            columnId: columnId,
+            renderCell: renderCell,
+            renderHeaderCell: renderHeaderCell,
+            compare: compare,
+        };
+    }
+    exports.createTableColumn = createTableColumn;
+});
+//# sourceMappingURL=createColumn.js.map

package/lib-amd/hooks/createColumn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createColumn.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/createColumn.ts"],"names":[],"mappings":";;;;IAEA,IAAM,cAAc,GAAG,cAAM,OAAA,CAAC,EAAD,CAAC,CAAC;IAE/B,IAAM,iBAAiB,GAAG;QACxB,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;YACzC,sCAAsC;YACtC,OAAO,CAAC,IAAI,CAAC,+FAA+F,CAAC,CAAC;SAC/G;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,IAAM,uBAAuB,GAAG;QAC9B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;YACzC,sCAAsC;YACtC,OAAO,CAAC,IAAI,CAAC,qGAAqG,CAAC,CAAC;SACrH;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF;;;;OAIG;IACH,SAAgB,iBAAiB,CAAQ,OAAwC;QAE7E,IAAA,QAAQ,GAIN,OAAO,SAJD,EACR,KAGE,OAAO,WAHqB,EAA9B,UAAU,mBAAG,iBAAiB,KAAA,EAC9B,KAEE,OAAO,iBAFiC,EAA1C,gBAAgB,mBAAG,uBAAuB,KAAA,EAC1C,KACE,OAAO,QADe,EAAxB,OAAO,mBAAG,cAAc,KAAA,CACd;QAEZ,OAAO;YACL,QAAQ,UAAA;YACR,UAAU,YAAA;YACV,gBAAgB,kBAAA;YAChB,OAAO,SAAA;SACR,CAAC;IACJ,CAAC;IAdD,8CAcC","sourcesContent":["import { CreateTableColumnOptions } from './types';\n\nconst defaultCompare = () => 0;\n\nconst defaultRenderCell = () => {\n  if (process.env.NODE_ENV !== 'production') {\n    // eslint-disable-next-line no-console\n    console.warn('@fluentui/react-table: You are using the default column renderCell function that renders null');\n  }\n\n  return null;\n};\n\nconst defaultRenderHeaderCell = () => {\n  if (process.env.NODE_ENV !== 'production') {\n    // eslint-disable-next-line no-console\n    console.warn('@fluentui/react-table: You are using the default column renderHeaderCell function that renders null');\n  }\n\n  return null;\n};\n\n/**\n * Helper function to create column definition with defaults\n * @param options - column definition options\n * @returns - column definition with defaults\n */\nexport function createTableColumn<TItem>(options: CreateTableColumnOptions<TItem>) {\n  const {\n    columnId,\n    renderCell = defaultRenderCell,\n    renderHeaderCell = defaultRenderHeaderCell,\n    compare = defaultCompare,\n  } = options;\n\n  return {\n    columnId,\n    renderCell,\n    renderHeaderCell,\n    compare,\n  };\n}\n"]}

package/lib-amd/hooks/index.js

@@ -0,0 +1,11 @@
+define(["require", "exports", "tslib", "./types", "./useTableFeatures", "./useTableSort", "./useTableSelection", "./createColumn", "./useTableColumnSizing"], function (require, exports, tslib_1, types_1, useTableFeatures_1, useTableSort_1, useTableSelection_1, createColumn_1, useTableColumnSizing_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(types_1, exports);
+    tslib_1.__exportStar(useTableFeatures_1, exports);
+    tslib_1.__exportStar(useTableSort_1, exports);
+    tslib_1.__exportStar(useTableSelection_1, exports);
+    tslib_1.__exportStar(createColumn_1, exports);
+    tslib_1.__exportStar(useTableColumnSizing_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/index.ts"],"names":[],"mappings":";;;IAAA,uCAAwB;IACxB,kDAAmC;IACnC,8CAA+B;IAC/B,mDAAoC;IACpC,8CAA+B;IAC/B,sDAAuC","sourcesContent":["export * from './types';\nexport * from './useTableFeatures';\nexport * from './useTableSort';\nexport * from './useTableSelection';\nexport * from './createColumn';\nexport * from './useTableColumnSizing';\n"]}

package/lib-amd/hooks/selectionManager.js

@@ -0,0 +1,82 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.createSelectionManager = void 0;
+    function createSelectionManager(mode, onSelectionChange) {
+        if (onSelectionChange === void 0) { onSelectionChange = function () { return undefined; }; }
+        var managerFactory = mode === 'multiselect' ? createMultipleSelectionManager : createSingleSelectionManager;
+        return managerFactory(onSelectionChange);
+    }
+    exports.createSelectionManager = createSelectionManager;
+    function createMultipleSelectionManager(onSelectionChange) {
+        var toggleAllItems = function (e, itemIds, selectedItems) {
+            var allItemsSelected = itemIds.every(function (itemId) { return selectedItems.has(itemId); });
+            if (allItemsSelected) {
+                selectedItems.clear();
+            }
+            else {
+                itemIds.forEach(function (itemId) { return selectedItems.add(itemId); });
+            }
+            onSelectionChange(e, new Set(selectedItems));
+        };
+        var toggleItem = function (e, itemId, selectedItems) {
+            if (selectedItems.has(itemId)) {
+                selectedItems.delete(itemId);
+            }
+            else {
+                selectedItems.add(itemId);
+            }
+            onSelectionChange(e, new Set(selectedItems));
+        };
+        var selectItem = function (e, itemId, selectedItems) {
+            selectedItems.add(itemId);
+            onSelectionChange(e, new Set(selectedItems));
+        };
+        var deselectItem = function (e, itemId, selectedItems) {
+            selectedItems.delete(itemId);
+            onSelectionChange(e, new Set(selectedItems));
+        };
+        var clearItems = function (e) {
+            onSelectionChange(e, new Set());
+        };
+        var isSelected = function (itemId, selectedItems) {
+            return selectedItems.has(itemId);
+        };
+        return {
+            toggleItem: toggleItem,
+            selectItem: selectItem,
+            deselectItem: deselectItem,
+            clearItems: clearItems,
+            isSelected: isSelected,
+            toggleAllItems: toggleAllItems,
+        };
+    }
+    function createSingleSelectionManager(onSelectionChange) {
+        var toggleItem = function (e, itemId) {
+            onSelectionChange(e, new Set([itemId]));
+        };
+        var clearItems = function (e) {
+            onSelectionChange(e, new Set());
+        };
+        var isSelected = function (itemId, selectedItems) {
+            return selectedItems.has(itemId);
+        };
+        var selectItem = function (e, itemId) {
+            onSelectionChange(e, new Set([itemId]));
+        };
+        return {
+            deselectItem: clearItems,
+            selectItem: selectItem,
+            toggleAllItems: function () {
+                if (process.env.NODE_ENV !== 'production') {
+                    throw new Error('[react-table]: `toggleAllItems` should not be used in single selection mode');
+                }
+                return undefined;
+            },
+            toggleItem: toggleItem,
+            clearItems: clearItems,
+            isSelected: isSelected,
+        };
+    }
+});
+//# sourceMappingURL=selectionManager.js.map

package/lib-amd/hooks/selectionManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectionManager.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/selectionManager.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { SelectionMode } from './types';\n\ntype OnSelectionChangeCallback = (e: React.SyntheticEvent, selectedItems: Set<SelectionItemId>) => void;\n\nexport interface SelectionManager {\n  toggleItem(e: React.SyntheticEvent, id: SelectionItemId, selectedItems: Set<SelectionItemId>): void;\n  selectItem(e: React.SyntheticEvent, id: SelectionItemId, selectedItems: Set<SelectionItemId>): void;\n  deselectItem(e: React.SyntheticEvent, id: SelectionItemId, selectedItems: Set<SelectionItemId>): void;\n  clearItems(e: React.SyntheticEvent): void;\n  isSelected(id: SelectionItemId, selectedItems: Set<SelectionItemId>): boolean;\n  toggleAllItems(e: React.SyntheticEvent, itemIds: SelectionItemId[], selectedItems: Set<SelectionItemId>): void;\n}\n\nexport type SelectionItemId = string | number;\n\nexport function createSelectionManager(\n  mode: SelectionMode,\n  onSelectionChange: OnSelectionChangeCallback = () => undefined,\n): SelectionManager {\n  const managerFactory = mode === 'multiselect' ? createMultipleSelectionManager : createSingleSelectionManager;\n\n  return managerFactory(onSelectionChange);\n}\n\nfunction createMultipleSelectionManager(onSelectionChange: OnSelectionChangeCallback): SelectionManager {\n  const toggleAllItems: SelectionManager['toggleAllItems'] = (e, itemIds, selectedItems) => {\n    const allItemsSelected = itemIds.every(itemId => selectedItems.has(itemId));\n\n    if (allItemsSelected) {\n      selectedItems.clear();\n    } else {\n      itemIds.forEach(itemId => selectedItems.add(itemId));\n    }\n\n    onSelectionChange(e, new Set(selectedItems));\n  };\n\n  const toggleItem: SelectionManager['toggleItem'] = (e, itemId, selectedItems) => {\n    if (selectedItems.has(itemId)) {\n      selectedItems.delete(itemId);\n    } else {\n      selectedItems.add(itemId);\n    }\n\n    onSelectionChange(e, new Set(selectedItems));\n  };\n\n  const selectItem: SelectionManager['selectItem'] = (e, itemId, selectedItems) => {\n    selectedItems.add(itemId);\n    onSelectionChange(e, new Set(selectedItems));\n  };\n\n  const deselectItem: SelectionManager['deselectItem'] = (e, itemId, selectedItems) => {\n    selectedItems.delete(itemId);\n    onSelectionChange(e, new Set(selectedItems));\n  };\n\n  const clearItems: SelectionManager['clearItems'] = e => {\n    onSelectionChange(e, new Set());\n  };\n\n  const isSelected = (itemId: SelectionItemId, selectedItems: Set<SelectionItemId>) => {\n    return selectedItems.has(itemId);\n  };\n\n  return {\n    toggleItem,\n    selectItem,\n    deselectItem,\n    clearItems,\n    isSelected,\n    toggleAllItems,\n  };\n}\n\nfunction createSingleSelectionManager(onSelectionChange: OnSelectionChangeCallback): SelectionManager {\n  const toggleItem: SelectionManager['toggleItem'] = (e, itemId) => {\n    onSelectionChange(e, new Set([itemId]));\n  };\n\n  const clearItems: SelectionManager['clearItems'] = e => {\n    onSelectionChange(e, new Set<SelectionItemId>());\n  };\n\n  const isSelected = (itemId: SelectionItemId, selectedItems: Set<SelectionItemId>) => {\n    return selectedItems.has(itemId);\n  };\n\n  const selectItem: SelectionManager['selectItem'] = (e, itemId) => {\n    onSelectionChange(e, new Set([itemId]));\n  };\n\n  return {\n    deselectItem: clearItems,\n    selectItem,\n    toggleAllItems: () => {\n      if (process.env.NODE_ENV !== 'production') {\n        throw new Error('[react-table]: `toggleAllItems` should not be used in single selection mode');\n      }\n\n      return undefined;\n    },\n    toggleItem,\n    clearItems,\n    isSelected,\n  };\n}\n"]}

package/lib-amd/hooks/types.js

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=types.js.map

package/lib-amd/hooks/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { SortDirection } from '../components/Table/Table.types';\nimport { TableHeaderCellProps } from '../components/TableHeaderCell/TableHeaderCell.types';\n\nexport type TableRowId = string | number;\nexport type TableColumnId = string | number;\nexport type SelectionMode = 'single' | 'multiselect';\n\nexport interface SortState {\n  sortColumn: TableColumnId | undefined;\n  sortDirection: SortDirection;\n}\n\nexport interface OnSelectionChangeData {\n  selectedItems: Set<TableRowId>;\n}\n\nexport interface CreateTableColumnOptions<TItem> extends Partial<TableColumnDefinition<TItem>> {\n  columnId: TableColumnId;\n}\n\nexport interface TableColumnDefinition<TItem> {\n  columnId: TableColumnId;\n  compare: (a: TItem, b: TItem) => number;\n  renderHeaderCell: () => React.ReactNode;\n  renderCell: (item: TItem) => React.ReactNode;\n}\n\nexport type RowEnhancer<TItem, TRowState extends TableRowData<TItem> = TableRowData<TItem>> = (\n  row: TableRowData<TItem>,\n) => TRowState;\n\nexport interface TableSortState<TItem> {\n  /**\n   * Current sort direction\n   */\n  sortDirection: SortDirection;\n  /**\n   * Column id of the currently sorted column\n   */\n  sortColumn: TableColumnId | undefined;\n  /**\n   * Set the sort direction for the specified column\n   */\n  setColumnSort: (event: React.SyntheticEvent, columnId: TableColumnId, sortDirection: SortDirection) => void;\n  /**\n   * Toggles the sort direction for specified column\n   */\n  toggleColumnSort: (event: React.SyntheticEvent, columnId: TableColumnId) => void;\n  /**\n   * Returns the sort direction if a column is sorted,\n   * returns undefined if the column is not sorted\n   */\n  getSortDirection: (columnId: TableColumnId) => SortDirection | undefined;\n\n  /**\n   * Sorts rows and returns a **shallow** copy of original items\n   */\n  sort: <TRowState extends TableRowData<TItem>>(rows: TRowState[]) => TRowState[];\n}\n\nexport interface TableSelectionState {\n  /**\n   * Clears all selected rows\n   */\n  clearRows: (e: React.SyntheticEvent) => void;\n  /**\n   * Selects single row\n   */\n  selectRow: (e: React.SyntheticEvent, rowId: TableRowId) => void;\n  /**\n   * De-selects single row\n   */\n  deselectRow: (e: React.SyntheticEvent, rowId: TableRowId) => void;\n  /**\n   * Toggle selection of all rows\n   */\n  toggleAllRows: (e: React.SyntheticEvent) => void;\n  /**\n   * Toggle selection of single row\n   */\n  toggleRow: (e: React.SyntheticEvent, rowId: TableRowId) => void;\n  /**\n   * Collection of row ids corresponding to selected rows\n   */\n  selectedRows: Set<TableRowId>;\n  /**\n   * Whether all rows are selected\n   */\n  allRowsSelected: boolean;\n  /**\n   * Whether some rows are selected\n   */\n  someRowsSelected: boolean;\n\n  /**\n   * Checks if a given rowId is selected\n   */\n  isRowSelected: (rowId: TableRowId) => boolean;\n\n  selectionMode: SelectionMode;\n}\n\nexport interface TableRowData<TItem> {\n  /**\n   * User provided data\n   */\n  item: TItem;\n  /**\n   * The row id, defaults to index position in the collection\n   */\n  rowId: TableRowId;\n}\n\nexport interface TableFeaturesState<TItem> extends Pick<UseTableFeaturesOptions<TItem>, 'items' | 'getRowId'> {\n  /**\n   * The row data for rendering\n   * @param rowEnhancer - Enhances the row with extra user data\n   */\n  getRows: <TRowState extends TableRowData<TItem> = TableRowData<TItem>>(\n    rowEnhancer?: RowEnhancer<TItem, TRowState>,\n  ) => TRowState[];\n  /**\n   * State and actions to manage row selection\n   */\n  selection: TableSelectionState;\n  /**\n   * State and actions to manage row sorting\n   */\n  sort: TableSortState<TItem>;\n  /**\n   * Table columns\n   */\n  columns: TableColumnDefinition<TItem>[];\n  /**\n   * State and actions to manage column resizing\n   */\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  columnSizing_unstable: TableColumnSizingState;\n  /**\n   * A React.Ref object to be set as a ref for the table.\n   * Used with column resizing.\n   */\n  tableRef: React.Ref<HTMLDivElement>;\n}\n\nexport interface UseTableSortOptions {\n  /**\n   * Used to control sorting\n   */\n  sortState?: SortState;\n  /**\n   * Used in uncontrolled mode to set initial sort column and direction on mount\n   */\n  defaultSortState?: SortState;\n  /**\n   * Called when sort changes\n   */\n  onSortChange?(e: React.SyntheticEvent, state: SortState): void;\n}\n\nexport interface UseTableSelectionOptions {\n  /**\n   * Can be multi or single select\n   */\n  selectionMode: SelectionMode;\n  /**\n   * Used in uncontrolled mode to set initial selected rows on mount\n   */\n  defaultSelectedItems?: Set<TableRowId>;\n  /**\n   * Used to control row selection\n   */\n  selectedItems?: Set<TableRowId>;\n  /**\n   * Called when selection changes\n   */\n  onSelectionChange?(e: React.SyntheticEvent, data: OnSelectionChangeData): void;\n}\n\nexport interface UseTableFeaturesOptions<TItem> {\n  columns: TableColumnDefinition<TItem>[];\n  items: TItem[];\n  getRowId?: (item: TItem) => TableRowId;\n}\n\nexport type TableFeaturePlugin = <TItem>(tableState: TableFeaturesState<TItem>) => TableFeaturesState<TItem>;\n\nexport interface ColumnWidthState {\n  columnId: TableColumnId;\n  width: number;\n  minWidth: number;\n  idealWidth: number;\n  padding: number;\n}\n\nexport type ColumnSizingTableHeaderCellProps = Pick<TableHeaderCellProps, 'style' | 'aside'>;\nexport type ColumnSizingTableCellProps = Pick<TableHeaderCellProps, 'style'>;\n\nexport interface TableColumnSizingState {\n  getOnMouseDown: (columnId: TableColumnId) => (e: React.MouseEvent<HTMLElement>) => void;\n  setColumnWidth: (columnId: TableColumnId, newSize: number) => void;\n  getColumnWidths: () => ColumnWidthState[];\n  getTableHeaderCellProps: (columnId: TableColumnId) => ColumnSizingTableHeaderCellProps;\n  getTableCellProps: (columnId: TableColumnId) => ColumnSizingTableCellProps;\n}\n\nexport type ColumnResizeState = {\n  getColumnWidth: (columnId: TableColumnId) => number;\n  setColumnWidth: (e: MouseEvent | undefined, data: { columnId: TableColumnId; width: number }) => void;\n  getColumnById: (columnId: TableColumnId) => ColumnWidthState | undefined;\n  getColumns: () => ColumnWidthState[];\n};\n\nexport type TableColumnSizingOptions = Record<\n  TableColumnId,\n  Partial<Pick<ColumnWidthState, 'minWidth' | 'idealWidth' | 'padding'>> & { defaultWidth?: number }\n>;\n\nexport type UseTableColumnSizingParams = {\n  columnSizingOptions?: TableColumnSizingOptions;\n  onColumnResize?: (e: MouseEvent | undefined, data: { columnId: TableColumnId; width: number }) => void;\n  containerWidthOffset?: number;\n};\n"]}

package/lib-amd/hooks/useMeasureElement.js

@@ -0,0 +1,46 @@
+define(["require", "exports", "@fluentui/react-utilities", "react", "@fluentui/react-shared-contexts"], function (require, exports, react_utilities_1, React, react_shared_contexts_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useMeasureElement = void 0;
+    /**
+     * Provides a way of reporting element width.
+     * Returns
+     * `width` - current element width (0 by default),
+     * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure
+     */
+    function useMeasureElement() {
+        var _a = React.useState(0), width = _a[0], setWidth = _a[1];
+        var container = React.useRef(undefined);
+        var targetDocument = react_shared_contexts_1.useFluent_unstable().targetDocument;
+        // the handler for resize observer
+        var handleResize = React.useCallback(function () {
+            var _a;
+            var containerWidth = (_a = container.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width;
+            setWidth(containerWidth || 0);
+        }, []);
+        // Keep the reference of ResizeObserver in the state, as it should live through renders
+        var resizeObserver = React.useState(react_utilities_1.canUseDOM() ? new ResizeObserver(handleResize) : undefined)[0];
+        var measureElementRef = React.useCallback(function (el) {
+            if (!targetDocument || !resizeObserver) {
+                return;
+            }
+            // cleanup previous container
+            if (container.current) {
+                resizeObserver.unobserve(container.current);
+                container.current.remove();
+            }
+            if (el) {
+                container.current = targetDocument.createElement('div');
+                el.insertAdjacentElement('beforebegin', container.current);
+                resizeObserver.observe(container.current);
+                handleResize();
+            }
+        }, [targetDocument, resizeObserver, handleResize]);
+        React.useEffect(function () {
+            return function () { return resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect(); };
+        }, [resizeObserver]);
+        return { width: width, measureElementRef: measureElementRef };
+    }
+    exports.useMeasureElement = useMeasureElement;
+});
+//# sourceMappingURL=useMeasureElement.js.map

package/lib-amd/hooks/useMeasureElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMeasureElement.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useMeasureElement.ts"],"names":[],"mappings":";;;;IAIA;;;;;OAKG;IACH,SAAgB,iBAAiB;QACzB,IAAA,KAAoB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAApC,KAAK,QAAA,EAAE,QAAQ,QAAqB,CAAC;QAC5C,IAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAA0B,SAAS,CAAC,CAAC;QAE3D,IAAA,cAAc,GAAK,0CAAS,EAAE,eAAhB,CAAiB;QAEvC,kCAAkC;QAClC,IAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC;;YACrC,IAAM,cAAc,GAAG,MAAA,SAAS,CAAC,OAAO,0CAAE,qBAAqB,GAAG,KAAK,CAAC;YACxE,QAAQ,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC;QAChC,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,uFAAuF;QAChF,IAAA,cAAc,GAAI,KAAK,CAAC,QAAQ,CAAC,2BAAS,EAAE,CAAC,CAAC,CAAC,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAA9E,CAA+E;QACpG,IAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CACzC,UAAC,EAAmB;YAClB,IAAI,CAAC,cAAc,IAAI,CAAC,cAAc,EAAE;gBACtC,OAAO;aACR;YAED,6BAA6B;YAC7B,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,cAAc,CAAC,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC5C,SAAS,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;aAC5B;YAED,IAAI,EAAE,EAAE;gBACN,SAAS,CAAC,OAAO,GAAG,cAAc,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBACxD,EAAE,CAAC,qBAAqB,CAAC,aAAa,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC3D,cAAc,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1C,YAAY,EAAE,CAAC;aAChB;QACH,CAAC,EACD,CAAC,cAAc,EAAE,cAAc,EAAE,YAAY,CAAC,CAC/C,CAAC;QAEF,KAAK,CAAC,SAAS,CAAC;YACd,OAAO,cAAM,OAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,UAAU,EAAE,EAA5B,CAA4B,CAAC;QAC5C,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;QAErB,OAAO,EAAE,KAAK,OAAA,EAAE,iBAAiB,mBAAA,EAAE,CAAC;IACtC,CAAC;IAzCD,8CAyCC","sourcesContent":["import { canUseDOM } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\n/**\n * Provides a way of reporting element width.\n * Returns\n * `width` - current element width (0 by default),\n * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure\n */\nexport function useMeasureElement<TElement extends HTMLElement = HTMLElement>() {\n  const [width, setWidth] = React.useState(0);\n  const container = React.useRef<HTMLElement | undefined>(undefined);\n\n  const { targetDocument } = useFluent();\n\n  // the handler for resize observer\n  const handleResize = React.useCallback(() => {\n    const containerWidth = container.current?.getBoundingClientRect().width;\n    setWidth(containerWidth || 0);\n  }, []);\n\n  // Keep the reference of ResizeObserver in the state, as it should live through renders\n  const [resizeObserver] = React.useState(canUseDOM() ? new ResizeObserver(handleResize) : undefined);\n  const measureElementRef = React.useCallback(\n    (el: TElement | null) => {\n      if (!targetDocument || !resizeObserver) {\n        return;\n      }\n\n      // cleanup previous container\n      if (container.current) {\n        resizeObserver.unobserve(container.current);\n        container.current.remove();\n      }\n\n      if (el) {\n        container.current = targetDocument.createElement('div');\n        el.insertAdjacentElement('beforebegin', container.current);\n        resizeObserver.observe(container.current);\n        handleResize();\n      }\n    },\n    [targetDocument, resizeObserver, handleResize],\n  );\n\n  React.useEffect(() => {\n    return () => resizeObserver?.disconnect();\n  }, [resizeObserver]);\n\n  return { width, measureElementRef };\n}\n"]}

package/lib-amd/hooks/useTableColumnResizeMouseHandler.js

@@ -0,0 +1,50 @@
+define(["require", "exports", "react", "@fluentui/react-shared-contexts"], function (require, exports, React, react_shared_contexts_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useTableColumnResizeMouseHandler = void 0;
+    function useTableColumnResizeMouseHandler(columnResizeState) {
+        var mouseX = React.useRef(0);
+        var currentWidth = React.useRef(0);
+        var colId = React.useRef(undefined);
+        var targetDocument = react_shared_contexts_1.useFluent_unstable().targetDocument;
+        var globalWin = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
+        var handleMouseMove = React.useCallback(function (e) {
+            var dx = e.clientX - mouseX.current;
+            // Update the local width for the column and set it
+            currentWidth.current += dx;
+            colId.current && columnResizeState.setColumnWidth(e, { columnId: colId.current, width: currentWidth.current });
+            mouseX.current = e.clientX;
+        }, [columnResizeState]);
+        var onMouseMove = React.useCallback(function (e) {
+            // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs
+            if (typeof (globalWin === null || globalWin === void 0 ? void 0 : globalWin.requestAnimationFrame) === 'function') {
+                requestAnimationFrame(function () { return handleMouseMove(e); });
+            }
+            else {
+                handleMouseMove(e);
+            }
+        }, [globalWin === null || globalWin === void 0 ? void 0 : globalWin.requestAnimationFrame, handleMouseMove]);
+        var onMouseUp = React.useCallback(function (e) {
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', onMouseUp);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mousemove', onMouseMove);
+        }, [onMouseMove, targetDocument]);
+        var getOnMouseDown = function (columnId) { return function (mouseDownEvent) {
+            // ignore other buttons than primary mouse button
+            if (mouseDownEvent.target !== mouseDownEvent.currentTarget || mouseDownEvent.button !== 0) {
+                return;
+            }
+            // Keep the width locally so that we decouple the calculation of the next with from rendering.
+            // This makes the whole experience much faster and more precise
+            currentWidth.current = columnResizeState.getColumnWidth(columnId);
+            mouseX.current = mouseDownEvent.clientX;
+            colId.current = columnId;
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', onMouseUp);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mousemove', onMouseMove);
+        }; };
+        return {
+            getOnMouseDown: function (columnId) { return getOnMouseDown(columnId); },
+        };
+    }
+    exports.useTableColumnResizeMouseHandler = useTableColumnResizeMouseHandler;
+});
+//# sourceMappingURL=useTableColumnResizeMouseHandler.js.map

package/lib-amd/hooks/useTableColumnResizeMouseHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableColumnResizeMouseHandler.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useTableColumnResizeMouseHandler.ts"],"names":[],"mappings":";;;;IAIA,SAAgB,gCAAgC,CAAC,iBAAoC;QACnF,IAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;QAC/B,IAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;QACrC,IAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAA4B,SAAS,CAAC,CAAC;QAEzD,IAAA,cAAc,GAAK,0CAAS,EAAE,eAAhB,CAAiB;QACvC,IAAM,SAAS,GAAG,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,CAAC;QAE9C,IAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACvC,UAAC,CAAa;YACZ,IAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;YAEtC,mDAAmD;YACnD,YAAY,CAAC,OAAO,IAAI,EAAE,CAAC;YAC3B,KAAK,CAAC,OAAO,IAAI,iBAAiB,CAAC,cAAc,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,YAAY,CAAC,OAAO,EAAE,CAAC,CAAC;YAC/G,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC;QAC7B,CAAC,EACD,CAAC,iBAAiB,CAAC,CACpB,CAAC;QAEF,IAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CACnC,UAAC,CAAa;YACZ,2FAA2F;YAC3F,IAAI,OAAO,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,qBAAqB,CAAA,KAAK,UAAU,EAAE;gBAC1D,qBAAqB,CAAC,cAAM,OAAA,eAAe,CAAC,CAAC,CAAC,EAAlB,CAAkB,CAAC,CAAC;aACjD;iBAAM;gBACL,eAAe,CAAC,CAAC,CAAC,CAAC;aACpB;QACH,CAAC,EACD,CAAC,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,qBAAqB,EAAE,eAAe,CAAC,CACpD,CAAC;QAEF,IAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CACjC,UAAC,CAAa;YACZ,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;YAC1D,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,mBAAmB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QAChE,CAAC,EACD,CAAC,WAAW,EAAE,cAAc,CAAC,CAC9B,CAAC;QAEF,IAAM,cAAc,GAAG,UAAC,QAAuB,IAAK,OAAA,UAAC,cAA6C;YAChG,iDAAiD;YACjD,IAAI,cAAc,CAAC,MAAM,KAAK,cAAc,CAAC,aAAa,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;gBACzF,OAAO;aACR;YACD,8FAA8F;YAC9F,+DAA+D;YAC/D,YAAY,CAAC,OAAO,GAAG,iBAAiB,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;YAClE,MAAM,CAAC,OAAO,GAAG,cAAc,CAAC,OAAO,CAAC;YACxC,KAAK,CAAC,OAAO,GAAG,QAAQ,CAAC;YAEzB,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;YACvD,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QAC7D,CAAC,EAbmD,CAanD,CAAC;QAEF,OAAO;YACL,cAAc,EAAE,UAAC,QAAuB,IAAK,OAAA,cAAc,CAAC,QAAQ,CAAC,EAAxB,CAAwB;SACtE,CAAC;IACJ,CAAC;IA1DD,4EA0DC","sourcesContent":["import * as React from 'react';\nimport { TableColumnId, ColumnResizeState } from './types';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\nexport function useTableColumnResizeMouseHandler(columnResizeState: ColumnResizeState) {\n  const mouseX = React.useRef(0);\n  const currentWidth = React.useRef(0);\n  const colId = React.useRef<TableColumnId | undefined>(undefined);\n\n  const { targetDocument } = useFluent();\n  const globalWin = targetDocument?.defaultView;\n\n  const handleMouseMove = React.useCallback(\n    (e: MouseEvent) => {\n      const dx = e.clientX - mouseX.current;\n\n      // Update the local width for the column and set it\n      currentWidth.current += dx;\n      colId.current && columnResizeState.setColumnWidth(e, { columnId: colId.current, width: currentWidth.current });\n      mouseX.current = e.clientX;\n    },\n    [columnResizeState],\n  );\n\n  const onMouseMove = React.useCallback(\n    (e: MouseEvent) => {\n      // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs\n      if (typeof globalWin?.requestAnimationFrame === 'function') {\n        requestAnimationFrame(() => handleMouseMove(e));\n      } else {\n        handleMouseMove(e);\n      }\n    },\n    [globalWin?.requestAnimationFrame, handleMouseMove],\n  );\n\n  const onMouseUp = React.useCallback(\n    (e: MouseEvent) => {\n      targetDocument?.removeEventListener('mouseup', onMouseUp);\n      targetDocument?.removeEventListener('mousemove', onMouseMove);\n    },\n    [onMouseMove, targetDocument],\n  );\n\n  const getOnMouseDown = (columnId: TableColumnId) => (mouseDownEvent: React.MouseEvent<HTMLElement>) => {\n    // ignore other buttons than primary mouse button\n    if (mouseDownEvent.target !== mouseDownEvent.currentTarget || mouseDownEvent.button !== 0) {\n      return;\n    }\n    // Keep the width locally so that we decouple the calculation of the next with from rendering.\n    // This makes the whole experience much faster and more precise\n    currentWidth.current = columnResizeState.getColumnWidth(columnId);\n    mouseX.current = mouseDownEvent.clientX;\n    colId.current = columnId;\n\n    targetDocument?.addEventListener('mouseup', onMouseUp);\n    targetDocument?.addEventListener('mousemove', onMouseMove);\n  };\n\n  return {\n    getOnMouseDown: (columnId: TableColumnId) => getOnMouseDown(columnId),\n  };\n}\n"]}

package/lib-amd/hooks/useTableColumnResizeState.js

@@ -0,0 +1,73 @@
+define(["require", "exports", "tslib", "@fluentui/react-utilities", "react", "../utils/columnResizeUtils"], function (require, exports, tslib_1, react_utilities_1, React, columnResizeUtils_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useTableColumnResizeState = void 0;
+    var createReducer = function () { return function (state, action) {
+        switch (action.type) {
+            case 'CONTAINER_WIDTH_UPDATED':
+                return tslib_1.__assign(tslib_1.__assign({}, state), { containerWidth: action.containerWidth, columnWidthState: columnResizeUtils_1.adjustColumnWidthsToFitContainer(state.columnWidthState, action.containerWidth) });
+            case 'COLUMNS_UPDATED':
+                var newS = columnResizeUtils_1.columnDefinitionsToState(action.columns, state.columnWidthState, state.columnSizingOptions);
+                return tslib_1.__assign(tslib_1.__assign({}, state), { columns: action.columns, columnWidthState: columnResizeUtils_1.adjustColumnWidthsToFitContainer(newS, state.containerWidth) });
+            case 'COLUMN_SIZING_OPTIONS_UPDATED':
+                var newState = columnResizeUtils_1.columnDefinitionsToState(state.columns, state.columnWidthState, action.columnSizingOptions);
+                return tslib_1.__assign(tslib_1.__assign({}, state), { columnSizingOptions: action.columnSizingOptions, columnWidthState: columnResizeUtils_1.adjustColumnWidthsToFitContainer(newState, state.containerWidth) });
+            case 'SET_COLUMN_WIDTH':
+                var columnId = action.columnId, width = action.width;
+                var containerWidth = state.containerWidth;
+                var column = columnResizeUtils_1.getColumnById(state.columnWidthState, columnId);
+                var newColumnWidthState = tslib_1.__spreadArray([], state.columnWidthState);
+                if (!column) {
+                    return state;
+                }
+                // Adjust the column width and measure the new total width
+                newColumnWidthState = columnResizeUtils_1.setColumnProperty(newColumnWidthState, columnId, 'width', width);
+                // Set this width as idealWidth, because its a deliberate change, not a recalculation because of container
+                newColumnWidthState = columnResizeUtils_1.setColumnProperty(newColumnWidthState, columnId, 'idealWidth', width);
+                // Adjust the widths to the container size
+                newColumnWidthState = columnResizeUtils_1.adjustColumnWidthsToFitContainer(newColumnWidthState, containerWidth);
+                return tslib_1.__assign(tslib_1.__assign({}, state), { columnWidthState: newColumnWidthState });
+        }
+    }; };
+    function useTableColumnResizeState(columns, containerWidth, params) {
+        if (params === void 0) { params = {}; }
+        var onColumnResize = params.onColumnResize, columnSizingOptions = params.columnSizingOptions;
+        var reducer = React.useMemo(function () { return createReducer(); }, []);
+        var _a = React.useReducer(reducer, {
+            columns: columns,
+            containerWidth: 0,
+            columnWidthState: columnResizeUtils_1.columnDefinitionsToState(columns, undefined, columnSizingOptions),
+            columnSizingOptions: columnSizingOptions,
+        }), state = _a[0], dispatch = _a[1];
+        react_utilities_1.useIsomorphicLayoutEffect(function () {
+            dispatch({ type: 'CONTAINER_WIDTH_UPDATED', containerWidth: containerWidth });
+        }, [containerWidth]);
+        react_utilities_1.useIsomorphicLayoutEffect(function () {
+            dispatch({ type: 'COLUMNS_UPDATED', columns: columns });
+        }, [columns]);
+        react_utilities_1.useIsomorphicLayoutEffect(function () {
+            dispatch({ type: 'COLUMN_SIZING_OPTIONS_UPDATED', columnSizingOptions: columnSizingOptions });
+        }, [columnSizingOptions]);
+        var setColumnWidth = react_utilities_1.useEventCallback(function (event, data) {
+            var width = data.width;
+            var columnId = data.columnId;
+            var col = columnResizeUtils_1.getColumnById(state.columnWidthState, columnId);
+            if (!col) {
+                return;
+            }
+            width = Math.max(col.minWidth || 0, width);
+            if (onColumnResize) {
+                onColumnResize(event, { columnId: columnId, width: width });
+            }
+            dispatch({ type: 'SET_COLUMN_WIDTH', columnId: columnId, width: width });
+        });
+        return {
+            getColumnById: function (colId) { return columnResizeUtils_1.getColumnById(state.columnWidthState, colId); },
+            getColumns: function () { return state.columnWidthState; },
+            getColumnWidth: function (colId) { return columnResizeUtils_1.getColumnWidth(state.columnWidthState, colId); },
+            setColumnWidth: setColumnWidth,
+        };
+    }
+    exports.useTableColumnResizeState = useTableColumnResizeState;
+});
+//# sourceMappingURL=useTableColumnResizeState.js.map

package/lib-amd/hooks/useTableColumnResizeState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableColumnResizeState.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useTableColumnResizeState.ts"],"names":[],"mappings":";;;;IA4CA,IAAM,aAAa,GAAG,cAAS,OAAA,UAAC,KAAwB,EAAE,MAAkC;QAC1F,QAAQ,MAAM,CAAC,IAAI,EAAE;YACnB,KAAK,yBAAyB;gBAC5B,6CACK,KAAK,KACR,cAAc,EAAE,MAAM,CAAC,cAAc,EACrC,gBAAgB,EAAE,oDAAgC,CAAC,KAAK,CAAC,gBAAgB,EAAE,MAAM,CAAC,cAAc,CAAC,IACjG;YAEJ,KAAK,iBAAiB;gBACpB,IAAM,IAAI,GAAG,4CAAwB,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,mBAAmB,CAAC,CAAC;gBACzG,6CACK,KAAK,KACR,OAAO,EAAE,MAAM,CAAC,OAAO,EACvB,gBAAgB,EAAE,oDAAgC,CAAC,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,IAC9E;YAEJ,KAAK,+BAA+B;gBAClC,IAAM,QAAQ,GAAG,4CAAwB,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,gBAAgB,EAAE,MAAM,CAAC,mBAAmB,CAAC,CAAC;gBAC7G,6CACK,KAAK,KACR,mBAAmB,EAAE,MAAM,CAAC,mBAAmB,EAC/C,gBAAgB,EAAE,oDAAgC,CAAC,QAAQ,EAAE,KAAK,CAAC,cAAc,CAAC,IAClF;YAEJ,KAAK,kBAAkB;gBACb,IAAA,QAAQ,GAAY,MAAM,SAAlB,EAAE,KAAK,GAAK,MAAM,MAAX,CAAY;gBAC3B,IAAA,cAAc,GAAK,KAAK,eAAV,CAAW;gBAEjC,IAAM,MAAM,GAAG,iCAAa,CAAC,KAAK,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;gBAC/D,IAAI,mBAAmB,6BAAO,KAAK,CAAC,gBAAgB,CAAC,CAAC;gBAEtD,IAAI,CAAC,MAAM,EAAE;oBACX,OAAO,KAAK,CAAC;iBACd;gBAED,0DAA0D;gBAC1D,mBAAmB,GAAG,qCAAiB,CAAC,mBAAmB,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;gBACvF,0GAA0G;gBAC1G,mBAAmB,GAAG,qCAAiB,CAAC,mBAAmB,EAAE,QAAQ,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;gBAC5F,0CAA0C;gBAC1C,mBAAmB,GAAG,oDAAgC,CAAC,mBAAmB,EAAE,cAAc,CAAC,CAAC;gBAE5F,6CAAY,KAAK,KAAE,gBAAgB,EAAE,mBAAmB,IAAG;SAC9D;IACH,CAAC,EA7C8B,CA6C9B,CAAC;IAEF,SAAgB,yBAAyB,CACvC,OAAmC,EACnC,cAAsB,EACtB,MAAuC;QAAvC,uBAAA,EAAA,WAAuC;QAE/B,IAAA,cAAc,GAA0B,MAAM,eAAhC,EAAE,mBAAmB,GAAK,MAAM,oBAAX,CAAY;QAEvD,IAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,cAAM,OAAA,aAAa,EAAK,EAAlB,CAAkB,EAAE,EAAE,CAAC,CAAC;QAEtD,IAAA,KAAoB,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE;YAClD,OAAO,SAAA;YACP,cAAc,EAAE,CAAC;YACjB,gBAAgB,EAAE,4CAAwB,CAAC,OAAO,EAAE,SAAS,EAAE,mBAAmB,CAAC;YACnF,mBAAmB,qBAAA;SACpB,CAAC,EALK,KAAK,QAAA,EAAE,QAAQ,QAKpB,CAAC;QAEH,2CAAyB,CAAC;YACxB,QAAQ,CAAC,EAAE,IAAI,EAAE,yBAAyB,EAAE,cAAc,gBAAA,EAAE,CAAC,CAAC;QAChE,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;QAErB,2CAAyB,CAAC;YACxB,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,OAAO,SAAA,EAAE,CAAC,CAAC;QACjD,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;QAEd,2CAAyB,CAAC;YACxB,QAAQ,CAAC,EAAE,IAAI,EAAE,+BAA+B,EAAE,mBAAmB,qBAAA,EAAE,CAAC,CAAC;QAC3E,CAAC,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAC;QAE1B,IAAM,cAAc,GAAG,kCAAgB,CACrC,UAAC,KAA6B,EAAE,IAAgD;YACxE,IAAA,KAAK,GAAK,IAAI,MAAT,CAAU;YACb,IAAA,QAAQ,GAAK,IAAI,SAAT,CAAU;YAC1B,IAAM,GAAG,GAAG,iCAAa,CAAC,KAAK,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;YAC5D,IAAI,CAAC,GAAG,EAAE;gBACR,OAAO;aACR;YAED,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC;YAE3C,IAAI,cAAc,EAAE;gBAClB,cAAc,CAAC,KAAK,EAAE,EAAE,QAAQ,UAAA,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;aAC5C;YACD,QAAQ,CAAC,EAAE,IAAI,EAAE,kBAAkB,EAAE,QAAQ,UAAA,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;QAC1D,CAAC,CACF,CAAC;QAEF,OAAO;YACL,aAAa,EAAE,UAAC,KAAoB,IAAK,OAAA,iCAAa,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAA5C,CAA4C;YACrF,UAAU,EAAE,cAAM,OAAA,KAAK,CAAC,gBAAgB,EAAtB,CAAsB;YACxC,cAAc,EAAE,UAAC,KAAoB,IAAK,OAAA,kCAAc,CAAC,KAAK,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAA7C,CAA6C;YACvF,cAAc,gBAAA;SACf,CAAC;IACJ,CAAC;IApDD,8DAoDC","sourcesContent":["import { useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport {\n  TableColumnDefinition,\n  TableColumnId,\n  ColumnResizeState,\n  ColumnWidthState,\n  UseTableColumnSizingParams,\n  TableColumnSizingOptions,\n} from './types';\nimport {\n  columnDefinitionsToState,\n  adjustColumnWidthsToFitContainer,\n  getColumnById,\n  setColumnProperty,\n  getColumnWidth,\n} from '../utils/columnResizeUtils';\n\ntype ComponentState<T> = {\n  columns: TableColumnDefinition<T>[];\n  containerWidth: number;\n  columnWidthState: ColumnWidthState[];\n  columnSizingOptions: TableColumnSizingOptions | undefined;\n};\n\ntype ColumnResizeStateAction<T> =\n  | {\n      type: 'CONTAINER_WIDTH_UPDATED';\n      containerWidth: number;\n    }\n  | {\n      type: 'COLUMNS_UPDATED';\n      columns: TableColumnDefinition<T>[];\n    }\n  | {\n      type: 'COLUMN_SIZING_OPTIONS_UPDATED';\n      columnSizingOptions: TableColumnSizingOptions | undefined;\n    }\n  | {\n      type: 'SET_COLUMN_WIDTH';\n      columnId: TableColumnId;\n      width: number;\n    };\n\nconst createReducer = <T>() => (state: ComponentState<T>, action: ColumnResizeStateAction<T>): ComponentState<T> => {\n  switch (action.type) {\n    case 'CONTAINER_WIDTH_UPDATED':\n      return {\n        ...state,\n        containerWidth: action.containerWidth,\n        columnWidthState: adjustColumnWidthsToFitContainer(state.columnWidthState, action.containerWidth),\n      };\n\n    case 'COLUMNS_UPDATED':\n      const newS = columnDefinitionsToState(action.columns, state.columnWidthState, state.columnSizingOptions);\n      return {\n        ...state,\n        columns: action.columns,\n        columnWidthState: adjustColumnWidthsToFitContainer(newS, state.containerWidth),\n      };\n\n    case 'COLUMN_SIZING_OPTIONS_UPDATED':\n      const newState = columnDefinitionsToState(state.columns, state.columnWidthState, action.columnSizingOptions);\n      return {\n        ...state,\n        columnSizingOptions: action.columnSizingOptions,\n        columnWidthState: adjustColumnWidthsToFitContainer(newState, state.containerWidth),\n      };\n\n    case 'SET_COLUMN_WIDTH':\n      const { columnId, width } = action;\n      const { containerWidth } = state;\n\n      const column = getColumnById(state.columnWidthState, columnId);\n      let newColumnWidthState = [...state.columnWidthState];\n\n      if (!column) {\n        return state;\n      }\n\n      // Adjust the column width and measure the new total width\n      newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'width', width);\n      // Set this width as idealWidth, because its a deliberate change, not a recalculation because of container\n      newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'idealWidth', width);\n      // Adjust the widths to the container size\n      newColumnWidthState = adjustColumnWidthsToFitContainer(newColumnWidthState, containerWidth);\n\n      return { ...state, columnWidthState: newColumnWidthState };\n  }\n};\n\nexport function useTableColumnResizeState<T>(\n  columns: TableColumnDefinition<T>[],\n  containerWidth: number,\n  params: UseTableColumnSizingParams = {},\n): ColumnResizeState {\n  const { onColumnResize, columnSizingOptions } = params;\n\n  const reducer = React.useMemo(() => createReducer<T>(), []);\n\n  const [state, dispatch] = React.useReducer(reducer, {\n    columns,\n    containerWidth: 0,\n    columnWidthState: columnDefinitionsToState(columns, undefined, columnSizingOptions),\n    columnSizingOptions,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'CONTAINER_WIDTH_UPDATED', containerWidth });\n  }, [containerWidth]);\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'COLUMNS_UPDATED', columns });\n  }, [columns]);\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'COLUMN_SIZING_OPTIONS_UPDATED', columnSizingOptions });\n  }, [columnSizingOptions]);\n\n  const setColumnWidth = useEventCallback(\n    (event: MouseEvent | undefined, data: { columnId: TableColumnId; width: number }) => {\n      let { width } = data;\n      const { columnId } = data;\n      const col = getColumnById(state.columnWidthState, columnId);\n      if (!col) {\n        return;\n      }\n\n      width = Math.max(col.minWidth || 0, width);\n\n      if (onColumnResize) {\n        onColumnResize(event, { columnId, width });\n      }\n      dispatch({ type: 'SET_COLUMN_WIDTH', columnId, width });\n    },\n  );\n\n  return {\n    getColumnById: (colId: TableColumnId) => getColumnById(state.columnWidthState, colId),\n    getColumns: () => state.columnWidthState,\n    getColumnWidth: (colId: TableColumnId) => getColumnWidth(state.columnWidthState, colId),\n    setColumnWidth,\n  };\n}\n"]}

package/lib-amd/hooks/useTableColumnSizing.js

@@ -0,0 +1,56 @@
+define(["require", "exports", "tslib", "react", "./useTableColumnResizeState", "./useTableColumnResizeMouseHandler", "./useMeasureElement", "../TableResizeHandle"], function (require, exports, tslib_1, React, useTableColumnResizeState_1, useTableColumnResizeMouseHandler_1, useMeasureElement_1, TableResizeHandle_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useTableColumnSizing_unstable = exports.defaultColumnSizingState = void 0;
+    exports.defaultColumnSizingState = {
+        getColumnWidths: function () { return []; },
+        getOnMouseDown: function () { return function () { return null; }; },
+        setColumnWidth: function () { return null; },
+        getTableHeaderCellProps: function () { return ({ style: {}, columnId: '' }); },
+        getTableCellProps: function () { return ({ style: {}, columnId: '' }); },
+    };
+    function useTableColumnSizing_unstable(params) {
+        // False positive, these plugin hooks are intended to be run on every render
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        return function (tableState) { return useTableColumnSizingState(tableState, params); };
+    }
+    exports.useTableColumnSizing_unstable = useTableColumnSizing_unstable;
+    function getColumnStyles(column) {
+        var width = column.width;
+        return {
+            // native styles
+            width: width,
+            // non-native element styles (flex layout)
+            minWidth: width,
+            maxWidth: width,
+        };
+    }
+    function useTableColumnSizingState(tableState, params) {
+        var columns = tableState.columns;
+        // Gets the container width
+        var _a = useMeasureElement_1.useMeasureElement(), width = _a.width, measureElementRef = _a.measureElementRef;
+        // Creates the state based on columns and available containerWidth
+        var columnResizeState = useTableColumnResizeState_1.useTableColumnResizeState(columns, width + ((params === null || params === void 0 ? void 0 : params.containerWidthOffset) || 0), params);
+        // Creates the mouse handler and attaches the state to it
+        var mouseHandler = useTableColumnResizeMouseHandler_1.useTableColumnResizeMouseHandler(columnResizeState);
+        return tslib_1.__assign(tslib_1.__assign({}, tableState), { tableRef: measureElementRef, 
+            // eslint-disable-next-line @typescript-eslint/naming-convention
+            columnSizing_unstable: {
+                getOnMouseDown: mouseHandler.getOnMouseDown,
+                setColumnWidth: function (columnId, w) {
+                    return columnResizeState.setColumnWidth(undefined, { columnId: columnId, width: w });
+                },
+                getColumnWidths: columnResizeState.getColumns,
+                getTableHeaderCellProps: function (columnId) {
+                    var col = columnResizeState.getColumnById(columnId);
+                    var aside = React.createElement(TableResizeHandle_1.TableResizeHandle, { onMouseDown: mouseHandler.getOnMouseDown(columnId) });
+                    return col ? { style: getColumnStyles(col), aside: aside } : {};
+                },
+                getTableCellProps: function (columnId) {
+                    var col = columnResizeState.getColumnById(columnId);
+                    return col ? { style: getColumnStyles(col) } : {};
+                },
+            } });
+    }
+});
+//# sourceMappingURL=useTableColumnSizing.js.map

package/lib-amd/hooks/useTableColumnSizing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableColumnSizing.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useTableColumnSizing.tsx"],"names":[],"mappings":";;;;IAaa,QAAA,wBAAwB,GAA2B;QAC9D,eAAe,EAAE,cAAM,OAAA,EAAE,EAAF,CAAE;QACzB,cAAc,EAAE,cAAM,OAAA,cAAM,OAAA,IAAI,EAAJ,CAAI,EAAV,CAAU;QAChC,cAAc,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;QAC1B,uBAAuB,EAAE,cAAM,OAAA,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,EAA7B,CAA6B;QAC5D,iBAAiB,EAAE,cAAM,OAAA,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,EAA7B,CAA6B;KACvD,CAAC;IAEF,SAAgB,6BAA6B,CAAQ,MAAmC;QACtF,4EAA4E;QAC5E,sDAAsD;QACtD,OAAO,UAAC,UAAqC,IAAK,OAAA,yBAAyB,CAAC,UAAU,EAAE,MAAM,CAAC,EAA7C,CAA6C,CAAC;IAClG,CAAC;IAJD,sEAIC;IAED,SAAS,eAAe,CAAC,MAAwB;QAC/C,IAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;QAE3B,OAAO;YACL,gBAAgB;YAChB,KAAK,OAAA;YACL,0CAA0C;YAC1C,QAAQ,EAAE,KAAK;YACf,QAAQ,EAAE,KAAK;SAChB,CAAC;IACJ,CAAC;IAED,SAAS,yBAAyB,CAChC,UAAqC,EACrC,MAAmC;QAE3B,IAAA,OAAO,GAAK,UAAU,QAAf,CAAgB;QAE/B,2BAA2B;QACrB,IAAA,KAA+B,qCAAiB,EAAE,EAAhD,KAAK,WAAA,EAAE,iBAAiB,uBAAwB,CAAC;QACzD,kEAAkE;QAClE,IAAM,iBAAiB,GAAG,qDAAyB,CAAC,OAAO,EAAE,KAAK,GAAG,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,oBAAoB,KAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;QAClH,yDAAyD;QACzD,IAAM,YAAY,GAAG,mEAAgC,CAAC,iBAAiB,CAAC,CAAC;QAEzE,6CACK,UAAU,KACb,QAAQ,EAAE,iBAAiB;YAC3B,gEAAgE;YAChE,qBAAqB,EAAE;gBACrB,cAAc,EAAE,YAAY,CAAC,cAAc;gBAC3C,cAAc,EAAE,UAAC,QAAuB,EAAE,CAAS;oBACjD,OAAA,iBAAiB,CAAC,cAAc,CAAC,SAAS,EAAE,EAAE,QAAQ,UAAA,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;gBAAnE,CAAmE;gBACrE,eAAe,EAAE,iBAAiB,CAAC,UAAU;gBAC7C,uBAAuB,EAAE,UAAC,QAAuB;oBAC/C,IAAM,GAAG,GAAG,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;oBACtD,IAAM,KAAK,GAAG,oBAAC,qCAAiB,IAAC,WAAW,EAAE,YAAY,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAI,CAAC;oBACxF,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,eAAe,CAAC,GAAG,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC3D,CAAC;gBACD,iBAAiB,EAAE,UAAC,QAAuB;oBACzC,IAAM,GAAG,GAAG,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;oBACtD,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;gBACpD,CAAC;aACF,IACD;IACJ,CAAC","sourcesContent":["import * as React from 'react';\nimport {\n  TableColumnId,\n  ColumnWidthState,\n  TableColumnSizingState,\n  TableFeaturesState,\n  UseTableColumnSizingParams,\n} from './types';\nimport { useTableColumnResizeState } from './useTableColumnResizeState';\nimport { useTableColumnResizeMouseHandler } from './useTableColumnResizeMouseHandler';\nimport { useMeasureElement } from './useMeasureElement';\nimport { TableResizeHandle } from '../TableResizeHandle';\n\nexport const defaultColumnSizingState: TableColumnSizingState = {\n  getColumnWidths: () => [],\n  getOnMouseDown: () => () => null,\n  setColumnWidth: () => null,\n  getTableHeaderCellProps: () => ({ style: {}, columnId: '' }),\n  getTableCellProps: () => ({ style: {}, columnId: '' }),\n};\n\nexport function useTableColumnSizing_unstable<TItem>(params?: UseTableColumnSizingParams) {\n  // False positive, these plugin hooks are intended to be run on every render\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  return (tableState: TableFeaturesState<TItem>) => useTableColumnSizingState(tableState, params);\n}\n\nfunction getColumnStyles(column: ColumnWidthState): React.CSSProperties {\n  const width = column.width;\n\n  return {\n    // native styles\n    width,\n    // non-native element styles (flex layout)\n    minWidth: width,\n    maxWidth: width,\n  };\n}\n\nfunction useTableColumnSizingState<TItem>(\n  tableState: TableFeaturesState<TItem>,\n  params?: UseTableColumnSizingParams,\n): TableFeaturesState<TItem> {\n  const { columns } = tableState;\n\n  // Gets the container width\n  const { width, measureElementRef } = useMeasureElement();\n  // Creates the state based on columns and available containerWidth\n  const columnResizeState = useTableColumnResizeState(columns, width + (params?.containerWidthOffset || 0), params);\n  // Creates the mouse handler and attaches the state to it\n  const mouseHandler = useTableColumnResizeMouseHandler(columnResizeState);\n\n  return {\n    ...tableState,\n    tableRef: measureElementRef,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    columnSizing_unstable: {\n      getOnMouseDown: mouseHandler.getOnMouseDown,\n      setColumnWidth: (columnId: TableColumnId, w: number) =>\n        columnResizeState.setColumnWidth(undefined, { columnId, width: w }),\n      getColumnWidths: columnResizeState.getColumns,\n      getTableHeaderCellProps: (columnId: TableColumnId) => {\n        const col = columnResizeState.getColumnById(columnId);\n        const aside = <TableResizeHandle onMouseDown={mouseHandler.getOnMouseDown(columnId)} />;\n        return col ? { style: getColumnStyles(col), aside } : {};\n      },\n      getTableCellProps: (columnId: TableColumnId) => {\n        const col = columnResizeState.getColumnById(columnId);\n        return col ? { style: getColumnStyles(col) } : {};\n      },\n    },\n  };\n}\n"]}

package/lib-amd/hooks/useTableFeatures.js

@@ -0,0 +1,39 @@
+define(["require", "exports", "react", "./useTableSelection", "./useTableSort", "./useTableColumnSizing"], function (require, exports, React, useTableSelection_1, useTableSort_1, useTableColumnSizing_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useTableFeatures = exports.defaultTableState = void 0;
+    var defaultRowEnhancer = function (row) { return row; };
+    exports.defaultTableState = {
+        selection: useTableSelection_1.defaultTableSelectionState,
+        sort: useTableSort_1.defaultTableSortState,
+        getRows: function () { return []; },
+        getRowId: function () { return ''; },
+        items: [],
+        columns: [],
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        columnSizing_unstable: useTableColumnSizing_1.defaultColumnSizingState,
+        tableRef: React.createRef(),
+    };
+    function useTableFeatures(options, plugins) {
+        if (plugins === void 0) { plugins = []; }
+        var items = options.items, getRowId = options.getRowId, columns = options.columns;
+        var getRows = function (rowEnhancer) {
+            if (rowEnhancer === void 0) { rowEnhancer = defaultRowEnhancer; }
+            return items.map(function (item, i) { var _a; return rowEnhancer({ item: item, rowId: (_a = getRowId === null || getRowId === void 0 ? void 0 : getRowId(item)) !== null && _a !== void 0 ? _a : i }); });
+        };
+        var initialState = {
+            getRowId: getRowId,
+            items: items,
+            columns: columns,
+            getRows: getRows,
+            selection: useTableSelection_1.defaultTableSelectionState,
+            sort: useTableSort_1.defaultTableSortState,
+            // eslint-disable-next-line @typescript-eslint/naming-convention
+            columnSizing_unstable: useTableColumnSizing_1.defaultColumnSizingState,
+            tableRef: React.createRef(),
+        };
+        return plugins.reduce(function (state, plugin) { return plugin(state); }, initialState);
+    }
+    exports.useTableFeatures = useTableFeatures;
+});
+//# sourceMappingURL=useTableFeatures.js.map

package/lib-amd/hooks/useTableFeatures.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableFeatures.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useTableFeatures.ts"],"names":[],"mappings":";;;;IAaA,IAAM,kBAAkB,GAAgD,UAAA,GAAG,IAAI,OAAA,GAAG,EAAH,CAAG,CAAC;IAEtE,QAAA,iBAAiB,GAAgC;QAC5D,SAAS,EAAE,8CAA0B;QACrC,IAAI,EAAE,oCAAqB;QAC3B,OAAO,EAAE,cAAM,OAAA,EAAE,EAAF,CAAE;QACjB,QAAQ,EAAE,cAAM,OAAA,EAAE,EAAF,CAAE;QAClB,KAAK,EAAE,EAAE;QACT,OAAO,EAAE,EAAE;QACX,gEAAgE;QAChE,qBAAqB,EAAE,+CAAwB;QAC/C,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAkB;KAC5C,CAAC;IAEF,SAAgB,gBAAgB,CAC9B,OAAuC,EACvC,OAAkC;QAAlC,wBAAA,EAAA,YAAkC;QAE1B,IAAA,KAAK,GAAwB,OAAO,MAA/B,EAAE,QAAQ,GAAc,OAAO,SAArB,EAAE,OAAO,GAAK,OAAO,QAAZ,CAAa;QAE7C,IAAM,OAAO,GAAG,UACd,WAAiE;YAAjE,4BAAA,EAAA,cAAc,kBAAmD;YAC9D,OAAA,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,CAAC,YAAK,OAAA,WAAW,CAAC,EAAE,IAAI,MAAA,EAAE,KAAK,EAAE,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,IAAI,CAAC,mCAAI,CAAC,EAAE,CAAC,CAAA,EAAA,CAAC;QAA3E,CAA2E,CAAC;QAEjF,IAAM,YAAY,GAA8B;YAC9C,QAAQ,UAAA;YACR,KAAK,OAAA;YACL,OAAO,SAAA;YACP,OAAO,SAAA;YACP,SAAS,EAAE,8CAA0B;YACrC,IAAI,EAAE,oCAA8C;YACpD,gEAAgE;YAChE,qBAAqB,EAAE,+CAAwB;YAC/C,QAAQ,EAAE,KAAK,CAAC,SAAS,EAAE;SAC5B,CAAC;QAEF,OAAO,OAAO,CAAC,MAAM,CAAC,UAAC,KAAK,EAAE,MAAM,IAAK,OAAA,MAAM,CAAC,KAAK,CAAC,EAAb,CAAa,EAAE,YAAY,CAAC,CAAC;IACxE,CAAC;IAvBD,4CAuBC","sourcesContent":["import * as React from 'react';\nimport type {\n  UseTableFeaturesOptions,\n  TableFeaturesState,\n  TableRowData,\n  RowEnhancer,\n  TableFeaturePlugin,\n  TableSortState,\n} from './types';\nimport { defaultTableSelectionState } from './useTableSelection';\nimport { defaultTableSortState } from './useTableSort';\nimport { defaultColumnSizingState } from './useTableColumnSizing';\n\nconst defaultRowEnhancer: RowEnhancer<unknown, TableRowData<unknown>> = row => row;\n\nexport const defaultTableState: TableFeaturesState<unknown> = {\n  selection: defaultTableSelectionState,\n  sort: defaultTableSortState,\n  getRows: () => [],\n  getRowId: () => '',\n  items: [],\n  columns: [],\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  columnSizing_unstable: defaultColumnSizingState,\n  tableRef: React.createRef<HTMLDivElement>(),\n};\n\nexport function useTableFeatures<TItem>(\n  options: UseTableFeaturesOptions<TItem>,\n  plugins: TableFeaturePlugin[] = [],\n): TableFeaturesState<TItem> {\n  const { items, getRowId, columns } = options;\n\n  const getRows = <TRowState extends TableRowData<TItem>>(\n    rowEnhancer = defaultRowEnhancer as RowEnhancer<TItem, TRowState>,\n  ) => items.map((item, i) => rowEnhancer({ item, rowId: getRowId?.(item) ?? i }));\n\n  const initialState: TableFeaturesState<TItem> = {\n    getRowId,\n    items,\n    columns,\n    getRows,\n    selection: defaultTableSelectionState,\n    sort: defaultTableSortState as TableSortState<TItem>,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    columnSizing_unstable: defaultColumnSizingState,\n    tableRef: React.createRef(),\n  };\n\n  return plugins.reduce((state, plugin) => plugin(state), initialState);\n}\n"]}

package/lib-amd/hooks/useTableSelection.js

@@ -0,0 +1,70 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "./selectionManager"], function (require, exports, tslib_1, React, react_utilities_1, selectionManager_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useTableSelectionState = exports.useTableSelection = exports.defaultTableSelectionState = void 0;
+    var noop = function () { return undefined; };
+    exports.defaultTableSelectionState = {
+        allRowsSelected: false,
+        clearRows: noop,
+        deselectRow: noop,
+        isRowSelected: function () { return false; },
+        selectRow: noop,
+        selectedRows: new Set(),
+        someRowsSelected: false,
+        toggleAllRows: noop,
+        toggleRow: noop,
+        selectionMode: 'multiselect',
+    };
+    function useTableSelection(options) {
+        // False positive, these plugin hooks are intended to be run on every render
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        return function (tableState) { return useTableSelectionState(tableState, options); };
+    }
+    exports.useTableSelection = useTableSelection;
+    function useTableSelectionState(tableState, options) {
+        var items = tableState.items, getRowId = tableState.getRowId;
+        var selectionMode = options.selectionMode, defaultSelectedItems = options.defaultSelectedItems, selectedItems = options.selectedItems, onSelectionChange = options.onSelectionChange;
+        var _a = react_utilities_1.useControllableState({
+            initialState: new Set(),
+            defaultState: defaultSelectedItems,
+            state: selectedItems,
+        }), selected = _a[0], setSelected = _a[1];
+        var selectionManager = React.useMemo(function () {
+            return selectionManager_1.createSelectionManager(selectionMode, function (e, newSelectedItems) {
+                setSelected(function () {
+                    onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(e, { selectedItems: newSelectedItems });
+                    return newSelectedItems;
+                });
+            });
+        }, [onSelectionChange, selectionMode, setSelected]);
+        var toggleAllRows = react_utilities_1.useEventCallback(function (e) {
+            selectionManager.toggleAllItems(e, items.map(function (item, i) { var _a; return (_a = getRowId === null || getRowId === void 0 ? void 0 : getRowId(item)) !== null && _a !== void 0 ? _a : i; }), selected);
+        });
+        var toggleRow = react_utilities_1.useEventCallback(function (e, rowId) {
+            return selectionManager.toggleItem(e, rowId, selected);
+        });
+        var deselectRow = react_utilities_1.useEventCallback(function (e, rowId) {
+            return selectionManager.deselectItem(e, rowId, selected);
+        });
+        var selectRow = react_utilities_1.useEventCallback(function (e, rowId) {
+            return selectionManager.selectItem(e, rowId, selected);
+        });
+        var isRowSelected = function (rowId) {
+            return selectionManager.isSelected(rowId, selected);
+        };
+        return tslib_1.__assign(tslib_1.__assign({}, tableState), { selection: {
+                selectionMode: selectionMode,
+                someRowsSelected: selected.size > 0,
+                allRowsSelected: selectionMode === 'single' ? selected.size > 0 : selected.size === items.length,
+                selectedRows: selected,
+                toggleRow: toggleRow,
+                toggleAllRows: toggleAllRows,
+                clearRows: selectionManager.clearItems,
+                deselectRow: deselectRow,
+                selectRow: selectRow,
+                isRowSelected: isRowSelected,
+            } });
+    }
+    exports.useTableSelectionState = useTableSelectionState;
+});
+//# sourceMappingURL=useTableSelection.js.map

package/lib-amd/hooks/useTableSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableSelection.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-table/src/hooks/useTableSelection.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { createSelectionManager } from './selectionManager';\nimport type { TableRowId, TableSelectionState, TableFeaturesState, UseTableSelectionOptions } from './types';\n\nconst noop = () => undefined;\n\nexport const defaultTableSelectionState: TableSelectionState = {\n  allRowsSelected: false,\n  clearRows: noop,\n  deselectRow: noop,\n  isRowSelected: () => false,\n  selectRow: noop,\n  selectedRows: new Set(),\n  someRowsSelected: false,\n  toggleAllRows: noop,\n  toggleRow: noop,\n  selectionMode: 'multiselect',\n};\n\nexport function useTableSelection<TItem>(options: UseTableSelectionOptions) {\n  // False positive, these plugin hooks are intended to be run on every render\n  // eslint-disable-next-line react-hooks/rules-of-hooks\n  return (tableState: TableFeaturesState<TItem>) => useTableSelectionState(tableState, options);\n}\n\nexport function useTableSelectionState<TItem>(\n  tableState: TableFeaturesState<TItem>,\n  options: UseTableSelectionOptions,\n): TableFeaturesState<TItem> {\n  const { items, getRowId } = tableState;\n  const { selectionMode, defaultSelectedItems, selectedItems, onSelectionChange } = options;\n\n  const [selected, setSelected] = useControllableState({\n    initialState: new Set<TableRowId>(),\n    defaultState: defaultSelectedItems,\n    state: selectedItems,\n  });\n\n  const selectionManager = React.useMemo(() => {\n    return createSelectionManager(selectionMode, (e, newSelectedItems) => {\n      setSelected(() => {\n        onSelectionChange?.(e as React.SyntheticEvent, { selectedItems: newSelectedItems });\n        return newSelectedItems;\n      });\n    });\n  }, [onSelectionChange, selectionMode, setSelected]);\n\n  const toggleAllRows: TableSelectionState['toggleAllRows'] = useEventCallback(e => {\n    selectionManager.toggleAllItems(\n      e,\n      items.map((item, i) => getRowId?.(item) ?? i),\n      selected,\n    );\n  });\n\n  const toggleRow: TableSelectionState['toggleRow'] = useEventCallback((e, rowId: TableRowId) =>\n    selectionManager.toggleItem(e, rowId, selected),\n  );\n\n  const deselectRow: TableSelectionState['deselectRow'] = useEventCallback((e, rowId: TableRowId) =>\n    selectionManager.deselectItem(e, rowId, selected),\n  );\n\n  const selectRow: TableSelectionState['selectRow'] = useEventCallback((e, rowId: TableRowId) =>\n    selectionManager.selectItem(e, rowId, selected),\n  );\n\n  const isRowSelected: TableSelectionState['isRowSelected'] = (rowId: TableRowId) =>\n    selectionManager.isSelected(rowId, selected);\n\n  return {\n    ...tableState,\n    selection: {\n      selectionMode,\n      someRowsSelected: selected.size > 0,\n      allRowsSelected: selectionMode === 'single' ? selected.size > 0 : selected.size === items.length,\n      selectedRows: selected,\n      toggleRow,\n      toggleAllRows,\n      clearRows: selectionManager.clearItems,\n      deselectRow,\n      selectRow,\n      isRowSelected,\n    },\n  };\n}\n"]}