@fluentui/react-table 9.0.0-rc.4 → 9.0.0

package/lib/utils/columnResizeUtils.js

@@ -0,0 +1,158 @@
+const DEFAULT_WIDTH = 150;
+const DEFAULT_MIN_WIDTH = 100;
+/**
+ * This function takes the column definitions and the curent ColumnWidthState and returns new state.
+ *  - It uses existing state for existing columns.
+ *  - It removes any state for columns no longer present.
+ *  - It checks if any column has been replaced and returns updated state if so
+ *  - It returns old state if no changes in the state have been made (so that react doesn't call effects)
+ * @param columns
+ * @param state
+ * @returns
+ */
+export function columnDefinitionsToState(columns, state = [], columnSizingOptions = {}) {
+  let updated = false;
+  const stateMap = new Map(state.map(s => [s.columnId, s]));
+  const updatedState = columns.map(column => {
+    var _a, _b;
+    const existingColumnState = stateMap.get(column.columnId);
+    if (existingColumnState) {
+      const {
+        idealWidth = existingColumnState.idealWidth,
+        minWidth = existingColumnState.minWidth,
+        padding = existingColumnState.padding
+      } = (_a = columnSizingOptions[column.columnId]) !== null && _a !== void 0 ? _a : {};
+      if (idealWidth !== existingColumnState.idealWidth || minWidth !== existingColumnState.minWidth || padding !== existingColumnState.padding) {
+        updated = true;
+        return {
+          ...existingColumnState,
+          idealWidth,
+          width: idealWidth,
+          minWidth,
+          padding
+        };
+      }
+      return existingColumnState;
+    }
+    const {
+      defaultWidth,
+      idealWidth = DEFAULT_WIDTH,
+      minWidth = DEFAULT_MIN_WIDTH,
+      padding
+    } = (_b = columnSizingOptions[column.columnId]) !== null && _b !== void 0 ? _b : {};
+    updated = true;
+    return {
+      columnId: column.columnId,
+      width: Math.max(defaultWidth !== null && defaultWidth !== void 0 ? defaultWidth : idealWidth, minWidth),
+      minWidth,
+      idealWidth: Math.max(defaultWidth !== null && defaultWidth !== void 0 ? defaultWidth : idealWidth, minWidth),
+      padding: padding !== null && padding !== void 0 ? padding : 16
+    };
+  });
+  // If the length of the new state changed (column was added or removed) or any of
+  // the individual states has a new reference (column was replaced),
+  // we have to reset the column widths to their ideal width (because the column which was last may not be last now).
+  // Then the adjustColumnWidthsToFitContainer can do its job and properly stretch the last column.
+  if (updatedState.length !== state.length || updated) {
+    const column = updatedState.find(col => col.width > col.idealWidth);
+    if (column) {
+      column.width = column.idealWidth;
+    }
+    updated = true;
+  }
+  return updated ? updatedState : state;
+}
+export function getColumnById(state, columnId) {
+  return state.find(c => c.columnId === columnId);
+}
+export function getColumnByIndex(state, index) {
+  return state[index];
+}
+export function getTotalWidth(state) {
+  return state.reduce((sum, column) => sum + column.width + column.padding, 0);
+}
+export function getLength(state) {
+  return state.length;
+}
+export function getColumnWidth(state, columnId) {
+  var _a;
+  const column = getColumnById(state, columnId);
+  return (_a = column === null || column === void 0 ? void 0 : column.width) !== null && _a !== void 0 ? _a : 0;
+}
+/**
+ * This function takes the current state and returns an updated state, so that it can be set.
+ * The reason for this is that we can update the state multiple times before commiting to render.
+ * This is an optimization and also prevents flickering.
+ * It also returns new copy of the state only if the value is different than the one currently in
+ * the state, further preventing unnecessary updates.
+ * @param localState
+ * @param columnId
+ * @param property
+ * @param value
+ * @returns
+ */
+export function setColumnProperty(localState, columnId, property, value) {
+  const currentColumn = getColumnById(localState, columnId);
+  if (!currentColumn || (currentColumn === null || currentColumn === void 0 ? void 0 : currentColumn[property]) === value) {
+    return localState;
+  }
+  const updatedColumn = {
+    ...currentColumn,
+    [property]: value
+  };
+  const newState = localState.reduce((acc, current) => {
+    if (current.columnId === updatedColumn.columnId) {
+      return [...acc, updatedColumn];
+    }
+    return [...acc, current];
+  }, []);
+  return newState;
+}
+/**
+ * This function takes the state and container width and makes sure the each column in the state
+ * is its optimal width, and that the columns
+ * a) fit to the container
+ * b) always fill the whole container
+ * @param state
+ * @param containerWidth
+ * @returns
+ */
+export function adjustColumnWidthsToFitContainer(state, containerWidth) {
+  let newState = state;
+  const totalWidth = getTotalWidth(newState);
+  // The total width is smaller, we are expanding columns
+  if (totalWidth < containerWidth) {
+    let difference = containerWidth - totalWidth;
+    let i = 0;
+    // We start at the beginning and assign the columns their ideal width
+    while (i < newState.length && difference > 0) {
+      const currentCol = getColumnByIndex(newState, i);
+      const colAdjustment = Math.min(currentCol.idealWidth - currentCol.width, difference);
+      newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width + colAdjustment);
+      difference -= colAdjustment;
+      // if there is still empty space, after all columns are their ideal sizes, assign it to the last column
+      if (i === newState.length - 1 && difference !== 0) {
+        const lastCol = getColumnByIndex(newState, i);
+        newState = setColumnProperty(newState, lastCol.columnId, 'width', lastCol.width + difference);
+      }
+      i++;
+    }
+  }
+  // The total width is larger than container, we need to squash the columns
+  else if (totalWidth >= containerWidth) {
+    let difference = totalWidth - containerWidth;
+    // We start with the last column
+    let j = newState.length - 1;
+    while (j >= 0 && difference > 0) {
+      const currentCol = getColumnByIndex(newState, j);
+      if (currentCol.width > currentCol.minWidth) {
+        const colAdjustment = Math.min(currentCol.width - currentCol.minWidth, difference);
+        difference -= colAdjustment;
+        newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width - colAdjustment);
+      }
+      j--;
+    }
+  }
+  return newState;
+}
+//# sourceMappingURL=columnResizeUtils.js.map

package/lib/utils/columnResizeUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"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","names":["DEFAULT_WIDTH","DEFAULT_MIN_WIDTH","columnDefinitionsToState","columns","state","columnSizingOptions","updated","stateMap","Map","map","s","columnId","updatedState","column","existingColumnState","get","idealWidth","minWidth","padding","width","defaultWidth","Math","max","length","find","col","getColumnById","c","getColumnByIndex","index","getTotalWidth","reduce","sum","getLength","getColumnWidth","setColumnProperty","localState","property","value","currentColumn","updatedColumn","newState","acc","current","adjustColumnWidthsToFitContainer","containerWidth","totalWidth","difference","i","currentCol","colAdjustment","min","lastCol","j"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/utils/columnResizeUtils.ts"],"sourcesContent":["import { TableColumnDefinition, ColumnWidthState, TableColumnId, TableColumnSizingOptions } from '../hooks';\n\nconst DEFAULT_WIDTH = 150;\nconst DEFAULT_MIN_WIDTH = 100;\n\n/**\n * This function takes the column definitions and the curent ColumnWidthState and returns new state.\n *  - It uses existing state for existing columns.\n *  - It removes any state for columns no longer present.\n *  - It checks if any column has been replaced and returns updated state if so\n *  - It returns old state if no changes in the state have been made (so that react doesn't call effects)\n * @param columns\n * @param state\n * @returns\n */\n\nexport function columnDefinitionsToState<T>(\n  columns: TableColumnDefinition<T>[],\n  state: ColumnWidthState[] = [],\n  columnSizingOptions: TableColumnSizingOptions = {},\n): ColumnWidthState[] {\n  let updated = false;\n  const stateMap = new Map(state.map(s => [s.columnId, s]));\n\n  const updatedState = columns.map(column => {\n    const existingColumnState = stateMap.get(column.columnId);\n\n    if (existingColumnState) {\n      const {\n        idealWidth = existingColumnState.idealWidth,\n        minWidth = existingColumnState.minWidth,\n        padding = existingColumnState.padding,\n      } = columnSizingOptions[column.columnId] ?? {};\n\n      if (\n        idealWidth !== existingColumnState.idealWidth ||\n        minWidth !== existingColumnState.minWidth ||\n        padding !== existingColumnState.padding\n      ) {\n        updated = true;\n        return {\n          ...existingColumnState,\n          idealWidth,\n          width: idealWidth,\n          minWidth,\n          padding,\n        };\n      }\n      return existingColumnState;\n    }\n\n    const { defaultWidth, idealWidth = DEFAULT_WIDTH, minWidth = DEFAULT_MIN_WIDTH, padding } =\n      columnSizingOptions[column.columnId] ?? {};\n\n    updated = true;\n    return {\n      columnId: column.columnId,\n      width: Math.max(defaultWidth ?? idealWidth, minWidth),\n      minWidth,\n      idealWidth: Math.max(defaultWidth ?? idealWidth, minWidth),\n      padding: padding ?? 16,\n    };\n  });\n\n  // If the length of the new state changed (column was added or removed) or any of\n  // the individual states has a new reference (column was replaced),\n  // we have to reset the column widths to their ideal width (because the column which was last may not be last now).\n  // Then the adjustColumnWidthsToFitContainer can do its job and properly stretch the last column.\n  if (updatedState.length !== state.length || updated) {\n    const column = updatedState.find(col => col.width > col.idealWidth);\n    if (column) {\n      column.width = column.idealWidth;\n    }\n\n    updated = true;\n  }\n\n  return updated ? updatedState : state;\n}\n\nexport function getColumnById(state: ColumnWidthState[], columnId: TableColumnId) {\n  return state.find(c => c.columnId === columnId);\n}\n\nexport function getColumnByIndex(state: ColumnWidthState[], index: number) {\n  return state[index];\n}\n\nexport function getTotalWidth(state: ColumnWidthState[]): number {\n  return state.reduce((sum, column) => sum + column.width + column.padding, 0);\n}\n\nexport function getLength(state: ColumnWidthState[]) {\n  return state.length;\n}\n\nexport function getColumnWidth(state: ColumnWidthState[], columnId: TableColumnId): number {\n  const column = getColumnById(state, columnId);\n  return column?.width ?? 0;\n}\n\n/**\n * This function takes the current state and returns an updated state, so that it can be set.\n * The reason for this is that we can update the state multiple times before commiting to render.\n * This is an optimization and also prevents flickering.\n * It also returns new copy of the state only if the value is different than the one currently in\n * the state, further preventing unnecessary updates.\n * @param localState\n * @param columnId\n * @param property\n * @param value\n * @returns\n */\nexport function setColumnProperty(\n  localState: ColumnWidthState[],\n  columnId: TableColumnId,\n  property: keyof ColumnWidthState,\n  value: number,\n) {\n  const currentColumn = getColumnById(localState, columnId);\n\n  if (!currentColumn || currentColumn?.[property] === value) {\n    return localState;\n  }\n\n  const updatedColumn = { ...currentColumn, [property]: value };\n\n  const newState = localState.reduce((acc, current) => {\n    if (current.columnId === updatedColumn.columnId) {\n      return [...acc, updatedColumn];\n    }\n    return [...acc, current];\n  }, [] as ColumnWidthState[]);\n\n  return newState;\n}\n\n/**\n * This function takes the state and container width and makes sure the each column in the state\n * is its optimal width, and that the columns\n * a) fit to the container\n * b) always fill the whole container\n * @param state\n * @param containerWidth\n * @returns\n */\nexport function adjustColumnWidthsToFitContainer(state: ColumnWidthState[], containerWidth: number) {\n  let newState = state;\n  const totalWidth = getTotalWidth(newState);\n\n  // The total width is smaller, we are expanding columns\n  if (totalWidth < containerWidth) {\n    let difference = containerWidth - totalWidth;\n    let i = 0;\n    // We start at the beginning and assign the columns their ideal width\n    while (i < newState.length && difference > 0) {\n      const currentCol = getColumnByIndex(newState, i);\n      const colAdjustment = Math.min(currentCol.idealWidth - currentCol.width, difference);\n      newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width + colAdjustment);\n      difference -= colAdjustment;\n\n      // if there is still empty space, after all columns are their ideal sizes, assign it to the last column\n      if (i === newState.length - 1 && difference !== 0) {\n        const lastCol = getColumnByIndex(newState, i);\n        newState = setColumnProperty(newState, lastCol.columnId, 'width', lastCol.width + difference);\n      }\n\n      i++;\n    }\n  }\n\n  // The total width is larger than container, we need to squash the columns\n  else if (totalWidth >= containerWidth) {\n    let difference = totalWidth - containerWidth;\n    // We start with the last column\n    let j = newState.length - 1;\n    while (j >= 0 && difference > 0) {\n      const currentCol = getColumnByIndex(newState, j);\n      if (currentCol.width > currentCol.minWidth) {\n        const colAdjustment = Math.min(currentCol.width - currentCol.minWidth, difference);\n        difference -= colAdjustment;\n        newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width - colAdjustment);\n      }\n      j--;\n    }\n  }\n\n  return newState;\n}\n"]}

package/lib-amd/DataGrid.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGrid/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGrid.js.map

package/lib-amd/DataGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGrid.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGrid.ts"],"names":[],"mappings":";;;IAAA,uCAA4C","sourcesContent":["export * from './components/DataGrid/index';\n"]}

package/lib-amd/DataGridBody.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridBody/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridBody.js.map

package/lib-amd/DataGridBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridBody.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridBody.ts"],"names":[],"mappings":";;;IAAA,uCAAgD","sourcesContent":["export * from './components/DataGridBody/index';\n"]}

package/lib-amd/DataGridCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridCell.js.map

package/lib-amd/DataGridCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridCell.ts"],"names":[],"mappings":";;;IAAA,uCAAgD","sourcesContent":["export * from './components/DataGridCell/index';\n"]}

package/lib-amd/DataGridHeader.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridHeader/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridHeader.js.map

package/lib-amd/DataGridHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridHeader.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridHeader.ts"],"names":[],"mappings":";;;IAAA,uCAAkD","sourcesContent":["export * from './components/DataGridHeader/index';\n"]}

package/lib-amd/DataGridHeaderCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridHeaderCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridHeaderCell.js.map

package/lib-amd/DataGridHeaderCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridHeaderCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridHeaderCell.ts"],"names":[],"mappings":";;;IAAA,uCAAsD","sourcesContent":["export * from './components/DataGridHeaderCell/index';\n"]}

package/lib-amd/DataGridRow.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridRow/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridRow.js.map

package/lib-amd/DataGridRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridRow.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridRow.ts"],"names":[],"mappings":";;;IAAA,uCAA+C","sourcesContent":["export * from './components/DataGridRow/index';\n"]}

package/lib-amd/DataGridSelectionCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/DataGridSelectionCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=DataGridSelectionCell.js.map

package/lib-amd/DataGridSelectionCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridSelectionCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/DataGridSelectionCell.ts"],"names":[],"mappings":";;;IAAA,uCAAyD","sourcesContent":["export * from './components/DataGridSelectionCell/index';\n"]}

package/lib-amd/Table.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/Table/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=Table.js.map

package/lib-amd/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/Table.ts"],"names":[],"mappings":";;;IAAA,uCAAyC","sourcesContent":["export * from './components/Table/index';\n"]}

package/lib-amd/TableBody.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableBody/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableBody.js.map

package/lib-amd/TableBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableBody.ts"],"names":[],"mappings":";;;IAAA,uCAA6C","sourcesContent":["export * from './components/TableBody/index';\n"]}

package/lib-amd/TableCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableCell.js.map

package/lib-amd/TableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableCell.ts"],"names":[],"mappings":";;;IAAA,uCAA6C","sourcesContent":["export * from './components/TableCell/index';\n"]}

package/lib-amd/TableCellActions.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableCellActions/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableCellActions.js.map

package/lib-amd/TableCellActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCellActions.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableCellActions.ts"],"names":[],"mappings":";;;IAAA,uCAAoD","sourcesContent":["export * from './components/TableCellActions/index';\n"]}

package/lib-amd/TableCellLayout.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableCellLayout/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableCellLayout.js.map

package/lib-amd/TableCellLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCellLayout.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableCellLayout.ts"],"names":[],"mappings":";;;IAAA,uCAAmD","sourcesContent":["export * from './components/TableCellLayout/index';\n"]}

package/lib-amd/TableHeader.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableHeader/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableHeader.js.map

package/lib-amd/TableHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeader.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableHeader.ts"],"names":[],"mappings":";;;IAAA,uCAA+C","sourcesContent":["export * from './components/TableHeader/index';\n"]}

package/lib-amd/TableHeaderCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableHeaderCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableHeaderCell.js.map

package/lib-amd/TableHeaderCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeaderCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableHeaderCell.ts"],"names":[],"mappings":";;;IAAA,uCAAmD","sourcesContent":["export * from './components/TableHeaderCell/index';\n"]}

package/lib-amd/TableResizeHandle.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableResizeHandle/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableResizeHandle.js.map

package/lib-amd/TableResizeHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableResizeHandle.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableResizeHandle.ts"],"names":[],"mappings":";;;IAAA,uCAAqD","sourcesContent":["export * from './components/TableResizeHandle/index';\n"]}

package/lib-amd/TableRow.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableRow/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableRow.js.map

package/lib-amd/TableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableRow.ts"],"names":[],"mappings":";;;IAAA,uCAA4C","sourcesContent":["export * from './components/TableRow/index';\n"]}

package/lib-amd/TableSelectionCell.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/TableSelectionCell/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=TableSelectionCell.js.map

package/lib-amd/TableSelectionCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSelectionCell.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-table/src/TableSelectionCell.ts"],"names":[],"mappings":";;;IAAA,uCAAsD","sourcesContent":["export * from './components/TableSelectionCell/index';\n"]}

package/lib-amd/components/DataGrid/DataGrid.js

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useDataGrid", "./renderDataGrid", "./useDataGridStyles", "./useDataGridContextValues"], function (require, exports, React, useDataGrid_1, renderDataGrid_1, useDataGridStyles_1, useDataGridContextValues_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.DataGrid = void 0;
+    /**
+     * DataGrid component
+     */
+    exports.DataGrid = React.forwardRef(function (props, ref) {
+        var state = useDataGrid_1.useDataGrid_unstable(props, ref);
+        useDataGridStyles_1.useDataGridStyles_unstable(state);
+        return renderDataGrid_1.renderDataGrid_unstable(state, useDataGridContextValues_1.useDataGridContextValues_unstable(state));
+    });
+    exports.DataGrid.displayName = 'DataGrid';
+});
+//# sourceMappingURL=DataGrid.js.map

package/lib-amd/components/DataGrid/DataGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGrid.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/DataGrid.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,QAAQ,GAAuC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACtF,IAAM,KAAK,GAAG,kCAAoB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE/C,8CAA0B,CAAC,KAAK,CAAC,CAAC;QAClC,OAAO,wCAAuB,CAAC,KAAK,EAAE,4DAAiC,CAAC,KAAK,CAAC,CAAC,CAAC;IAClF,CAAC,CAAC,CAAC;IAEH,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDataGrid_unstable } from './useDataGrid';\nimport { renderDataGrid_unstable } from './renderDataGrid';\nimport { useDataGridStyles_unstable } from './useDataGridStyles';\nimport type { DataGridProps } from './DataGrid.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDataGridContextValues_unstable } from './useDataGridContextValues';\n\n/**\n * DataGrid component\n */\nexport const DataGrid: ForwardRefComponent<DataGridProps> = React.forwardRef((props, ref) => {\n  const state = useDataGrid_unstable(props, ref);\n\n  useDataGridStyles_unstable(state);\n  return renderDataGrid_unstable(state, useDataGridContextValues_unstable(state));\n});\n\nDataGrid.displayName = 'DataGrid';\n"]}

package/lib-amd/components/DataGrid/DataGrid.types.js

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

package/lib-amd/components/DataGrid/DataGrid.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGrid.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/DataGrid.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { TableContextValues, TableProps, TableSlots, TableState } from '../Table/Table.types';\nimport type {\n  SortState,\n  TableFeaturesState,\n  UseTableSortOptions,\n  SelectionMode,\n  UseTableSelectionOptions,\n  OnSelectionChangeData,\n  TableColumnSizingOptions,\n  TableColumnId,\n} from '../../hooks';\nimport { TableRowProps } from '../TableRow/TableRow.types';\n\nexport type DataGridSlots = TableSlots;\n\nexport type DataGridFocusMode = 'none' | 'cell' | 'row_unstable';\n\nexport type DataGridContextValues = TableContextValues & {\n  dataGrid: DataGridContextValue;\n};\n\n// Use any here since we can't know the user types\n// The user is responsible for narrowing the type downstream\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type DataGridContextValue = TableFeaturesState<any> & {\n  /**\n   * How focus navigation will work in the datagrid\n   * @default cell\n   */\n  focusMode: DataGridFocusMode;\n\n  /**\n   * Lets child components know if rows selection is enabled\n   * @see selectionMode prop enables row selection on the component\n   */\n  selectableRows: boolean;\n\n  /**\n   * Enables subtle selection style\n   * @default false\n   */\n  subtleSelection: boolean;\n\n  /**\n   * Row appearance when selected\n   * @default brand\n   */\n  selectionAppearance: TableRowProps['appearance'];\n\n  /**\n   * Enables column resizing\n   */\n  resizableColumns?: boolean;\n};\n\n/**\n * DataGrid Props\n */\nexport type DataGridProps = TableProps &\n  Pick<DataGridContextValue, 'items' | 'columns' | 'getRowId'> &\n  Pick<Partial<DataGridContextValue>, 'focusMode' | 'subtleSelection' | 'selectionAppearance' | 'resizableColumns'> &\n  Pick<UseTableSortOptions, 'sortState' | 'defaultSortState'> &\n  Pick<UseTableSelectionOptions, 'defaultSelectedItems' | 'selectedItems'> & {\n    onSortChange?: (e: React.MouseEvent, sortState: SortState) => void;\n    onSelectionChange?: (e: React.MouseEvent | React.KeyboardEvent, data: OnSelectionChangeData) => void;\n    /**\n     * Enables row selection and sets the selection mode\n     * @default false\n     */\n    selectionMode?: SelectionMode;\n    /**\n     * Options for column resizing\n     */\n    columnSizingOptions?: TableColumnSizingOptions;\n    /**\n     * A callback triggered when a column is resized.\n     */\n    onColumnResize?: (event: MouseEvent | undefined, data: { columnId: TableColumnId; width: number }) => void;\n  };\n\n/**\n * State used in rendering DataGrid\n */\nexport type DataGridState = TableState & { tableState: TableFeaturesState<unknown> } & Pick<\n    DataGridContextValue,\n    'focusMode' | 'selectableRows' | 'subtleSelection' | 'selectionAppearance' | 'getRowId' | 'resizableColumns'\n  >;\n"]}

package/lib-amd/components/DataGrid/index.js

@@ -0,0 +1,11 @@
+define(["require", "exports", "tslib", "./DataGrid", "./DataGrid.types", "./renderDataGrid", "./useDataGrid", "./useDataGridStyles", "./useDataGridContextValues"], function (require, exports, tslib_1, DataGrid_1, DataGrid_types_1, renderDataGrid_1, useDataGrid_1, useDataGridStyles_1, useDataGridContextValues_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(DataGrid_1, exports);
+    tslib_1.__exportStar(DataGrid_types_1, exports);
+    tslib_1.__exportStar(renderDataGrid_1, exports);
+    tslib_1.__exportStar(useDataGrid_1, exports);
+    tslib_1.__exportStar(useDataGridStyles_1, exports);
+    tslib_1.__exportStar(useDataGridContextValues_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/DataGrid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/index.ts"],"names":[],"mappings":";;;IAAA,0CAA2B;IAC3B,gDAAiC;IACjC,gDAAiC;IACjC,6CAA8B;IAC9B,mDAAoC;IACpC,0DAA2C","sourcesContent":["export * from './DataGrid';\nexport * from './DataGrid.types';\nexport * from './renderDataGrid';\nexport * from './useDataGrid';\nexport * from './useDataGridStyles';\nexport * from './useDataGridContextValues';\n"]}

package/lib-amd/components/DataGrid/renderDataGrid.js

@@ -0,0 +1,13 @@
+define(["require", "exports", "react", "../Table/renderTable", "../../contexts/dataGridContext"], function (require, exports, React, renderTable_1, dataGridContext_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderDataGrid_unstable = void 0;
+    /**
+     * Render the final JSX of DataGrid
+     */
+    var renderDataGrid_unstable = function (state, contextValues) {
+        return (React.createElement(dataGridContext_1.DataGridContextProvider, { value: contextValues.dataGrid }, renderTable_1.renderTable_unstable(state, contextValues)));
+    };
+    exports.renderDataGrid_unstable = renderDataGrid_unstable;
+});
+//# sourceMappingURL=renderDataGrid.js.map

package/lib-amd/components/DataGrid/renderDataGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderDataGrid.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/renderDataGrid.tsx"],"names":[],"mappings":";;;;IAKA;;OAEG;IACI,IAAM,uBAAuB,GAAG,UAAC,KAAoB,EAAE,aAAoC;QAChG,OAAO,CACL,oBAAC,yCAAuB,IAAC,KAAK,EAAE,aAAa,CAAC,QAAQ,IACnD,kCAAoB,CAAC,KAAK,EAAE,aAAa,CAAC,CACnB,CAC3B,CAAC;IACJ,CAAC,CAAC;IANW,QAAA,uBAAuB,2BAMlC","sourcesContent":["import * as React from 'react';\nimport type { DataGridContextValues, DataGridState } from './DataGrid.types';\nimport { renderTable_unstable } from '../Table/renderTable';\nimport { DataGridContextProvider } from '../../contexts/dataGridContext';\n\n/**\n * Render the final JSX of DataGrid\n */\nexport const renderDataGrid_unstable = (state: DataGridState, contextValues: DataGridContextValues) => {\n  return (\n    <DataGridContextProvider value={contextValues.dataGrid}>\n      {renderTable_unstable(state, contextValues)}\n    </DataGridContextProvider>\n  );\n};\n"]}

package/lib-amd/components/DataGrid/useDataGrid.js

@@ -0,0 +1,43 @@
+define(["require", "exports", "tslib", "@fluentui/react-tabster", "../Table/useTable", "../../hooks", "../TableSelectionCell", "@fluentui/react-utilities"], function (require, exports, tslib_1, react_tabster_1, useTable_1, hooks_1, TableSelectionCell_1, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useDataGrid_unstable = void 0;
+    /**
+     * Create the state required to render DataGrid.
+     *
+     * The returned state can be modified with hooks such as useDataGridStyles_unstable,
+     * before being passed to renderDataGrid_unstable.
+     *
+     * @param props - props from this instance of DataGrid
+     * @param ref - reference to root HTMLElement of DataGrid
+     */
+    var useDataGrid_unstable = function (props, ref) {
+        var items = props.items, columns = props.columns, _a = props.focusMode, focusMode = _a === void 0 ? 'cell' : _a, selectionMode = props.selectionMode, onSortChange = props.onSortChange, onSelectionChange = props.onSelectionChange, defaultSortState = props.defaultSortState, sortState = props.sortState, selectedItems = props.selectedItems, defaultSelectedItems = props.defaultSelectedItems, _b = props.subtleSelection, subtleSelection = _b === void 0 ? false : _b, _c = props.selectionAppearance, selectionAppearance = _c === void 0 ? 'brand' : _c, getRowId = props.getRowId, resizableColumns = props.resizableColumns, columnSizingOptions = props.columnSizingOptions, onColumnResize = props.onColumnResize;
+        var navigable = focusMode !== 'none';
+        var keyboardNavAttr = react_tabster_1.useArrowNavigationGroup({ axis: 'grid' });
+        var tableState = hooks_1.useTableFeatures({ items: items, columns: columns, getRowId: getRowId }, [
+            hooks_1.useTableSort({
+                defaultSortState: defaultSortState,
+                sortState: sortState,
+                onSortChange: onSortChange,
+            }),
+            hooks_1.useTableSelection({
+                defaultSelectedItems: defaultSelectedItems,
+                selectedItems: selectedItems,
+                onSelectionChange: onSelectionChange,
+                selectionMode: selectionMode !== null && selectionMode !== void 0 ? selectionMode : 'multiselect',
+            }),
+            hooks_1.useTableColumnSizing_unstable({
+                onColumnResize: onColumnResize,
+                columnSizingOptions: columnSizingOptions,
+                // The selection cell is not part of the columns, therefore its width needs to be subtracted
+                // from the container to make sure the columns don't overflow the table.
+                containerWidthOffset: selectionMode ? -TableSelectionCell_1.CELL_WIDTH : 0,
+            }),
+        ]);
+        var baseTableState = useTable_1.useTable_unstable(tslib_1.__assign(tslib_1.__assign({ role: 'grid', as: 'div', noNativeElements: true }, (navigable && keyboardNavAttr)), props), react_utilities_1.useMergedRefs(ref, tableState.tableRef));
+        return tslib_1.__assign(tslib_1.__assign({}, baseTableState), { focusMode: focusMode, tableState: tableState, selectableRows: !!selectionMode, subtleSelection: subtleSelection, selectionAppearance: selectionAppearance, resizableColumns: resizableColumns });
+    };
+    exports.useDataGrid_unstable = useDataGrid_unstable;
+});
+//# sourceMappingURL=useDataGrid.js.map

package/lib-amd/components/DataGrid/useDataGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataGrid.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/useDataGrid.ts"],"names":[],"mappings":";;;;IAQA;;;;;;;;OAQG;IACI,IAAM,oBAAoB,GAAG,UAAC,KAAoB,EAAE,GAA2B;QAElF,IAAA,KAAK,GAgBH,KAAK,MAhBF,EACL,OAAO,GAeL,KAAK,QAfA,EACP,KAcE,KAAK,UAdW,EAAlB,SAAS,mBAAG,MAAM,KAAA,EAClB,aAAa,GAaX,KAAK,cAbM,EACb,YAAY,GAYV,KAAK,aAZK,EACZ,iBAAiB,GAWf,KAAK,kBAXU,EACjB,gBAAgB,GAUd,KAAK,iBAVS,EAChB,SAAS,GASP,KAAK,UATE,EACT,aAAa,GAQX,KAAK,cARM,EACb,oBAAoB,GAOlB,KAAK,qBAPa,EACpB,KAME,KAAK,gBANgB,EAAvB,eAAe,mBAAG,KAAK,KAAA,EACvB,KAKE,KAAK,oBALsB,EAA7B,mBAAmB,mBAAG,OAAO,KAAA,EAC7B,QAAQ,GAIN,KAAK,SAJC,EACR,gBAAgB,GAGd,KAAK,iBAHS,EAChB,mBAAmB,GAEjB,KAAK,oBAFY,EACnB,cAAc,GACZ,KAAK,eADO,CACN;QAEV,IAAM,SAAS,GAAG,SAAS,KAAK,MAAM,CAAC;QACvC,IAAM,eAAe,GAAG,uCAAuB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;QAElE,IAAM,UAAU,GAAG,wBAAgB,CAAC,EAAE,KAAK,OAAA,EAAE,OAAO,SAAA,EAAE,QAAQ,UAAA,EAAE,EAAE;YAChE,oBAAY,CAAC;gBACX,gBAAgB,kBAAA;gBAChB,SAAS,WAAA;gBACT,YAAY,cAAA;aACb,CAAC;YACF,yBAAiB,CAAC;gBAChB,oBAAoB,sBAAA;gBACpB,aAAa,eAAA;gBACb,iBAAiB,mBAAA;gBACjB,aAAa,EAAE,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,aAAa;aAC9C,CAAC;YACF,qCAA6B,CAAC;gBAC5B,cAAc,gBAAA;gBACd,mBAAmB,qBAAA;gBACnB,4FAA4F;gBAC5F,wEAAwE;gBACxE,oBAAoB,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,+BAAU,CAAC,CAAC,CAAC,CAAC;aACtD,CAAC;SACH,CAAC,CAAC;QAEH,IAAM,cAAc,GAAG,4BAAiB,qCAEpC,IAAI,EAAE,MAAM,EACZ,EAAE,EAAE,KAAK,EACT,gBAAgB,EAAE,IAAI,IACnB,CAAC,SAAS,IAAI,eAAe,CAAC,GAC9B,KAAK,GAEV,+BAAa,CAAC,GAAG,EAAE,UAAU,CAAC,QAAQ,CAAC,CACxC,CAAC;QAEF,6CACK,cAAc,KACjB,SAAS,WAAA,EACT,UAAU,YAAA,EACV,cAAc,EAAE,CAAC,CAAC,aAAa,EAC/B,eAAe,iBAAA,EACf,mBAAmB,qBAAA,EACnB,gBAAgB,kBAAA,IAChB;IACJ,CAAC,CAAC;IAhEW,QAAA,oBAAoB,wBAgE/B","sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport type { DataGridProps, DataGridState } from './DataGrid.types';\nimport { useTable_unstable } from '../Table/useTable';\nimport { useTableFeatures, useTableSort, useTableSelection, useTableColumnSizing_unstable } from '../../hooks';\nimport { CELL_WIDTH } from '../TableSelectionCell';\nimport { useMergedRefs } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render DataGrid.\n *\n * The returned state can be modified with hooks such as useDataGridStyles_unstable,\n * before being passed to renderDataGrid_unstable.\n *\n * @param props - props from this instance of DataGrid\n * @param ref - reference to root HTMLElement of DataGrid\n */\nexport const useDataGrid_unstable = (props: DataGridProps, ref: React.Ref<HTMLElement>): DataGridState => {\n  const {\n    items,\n    columns,\n    focusMode = 'cell',\n    selectionMode,\n    onSortChange,\n    onSelectionChange,\n    defaultSortState,\n    sortState,\n    selectedItems,\n    defaultSelectedItems,\n    subtleSelection = false,\n    selectionAppearance = 'brand',\n    getRowId,\n    resizableColumns,\n    columnSizingOptions,\n    onColumnResize,\n  } = props;\n\n  const navigable = focusMode !== 'none';\n  const keyboardNavAttr = useArrowNavigationGroup({ axis: 'grid' });\n\n  const tableState = useTableFeatures({ items, columns, getRowId }, [\n    useTableSort({\n      defaultSortState,\n      sortState,\n      onSortChange,\n    }),\n    useTableSelection({\n      defaultSelectedItems,\n      selectedItems,\n      onSelectionChange,\n      selectionMode: selectionMode ?? 'multiselect',\n    }),\n    useTableColumnSizing_unstable({\n      onColumnResize,\n      columnSizingOptions,\n      // The selection cell is not part of the columns, therefore its width needs to be subtracted\n      // from the container to make sure the columns don't overflow the table.\n      containerWidthOffset: selectionMode ? -CELL_WIDTH : 0,\n    }),\n  ]);\n\n  const baseTableState = useTable_unstable(\n    {\n      role: 'grid',\n      as: 'div',\n      noNativeElements: true,\n      ...(navigable && keyboardNavAttr),\n      ...props,\n    },\n    useMergedRefs(ref, tableState.tableRef),\n  );\n\n  return {\n    ...baseTableState,\n    focusMode,\n    tableState,\n    selectableRows: !!selectionMode,\n    subtleSelection,\n    selectionAppearance,\n    resizableColumns,\n  };\n};\n"]}

package/lib-amd/components/DataGrid/useDataGridContextValues.js

@@ -0,0 +1,11 @@
+define(["require", "exports", "tslib", "../Table/useTableContextValues"], function (require, exports, tslib_1, useTableContextValues_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useDataGridContextValues_unstable = void 0;
+    function useDataGridContextValues_unstable(state) {
+        var tableContextValues = useTableContextValues_1.useTableContextValues_unstable(state);
+        return tslib_1.__assign(tslib_1.__assign({}, tableContextValues), { dataGrid: tslib_1.__assign(tslib_1.__assign({}, state.tableState), { focusMode: state.focusMode, selectableRows: state.selectableRows, subtleSelection: state.subtleSelection, selectionAppearance: state.selectionAppearance, resizableColumns: state.resizableColumns }) });
+    }
+    exports.useDataGridContextValues_unstable = useDataGridContextValues_unstable;
+});
+//# sourceMappingURL=useDataGridContextValues.js.map

package/lib-amd/components/DataGrid/useDataGridContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataGridContextValues.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/useDataGridContextValues.ts"],"names":[],"mappings":";;;;IAGA,SAAgB,iCAAiC,CAAC,KAAoB;QACpE,IAAM,kBAAkB,GAAG,sDAA8B,CAAC,KAAK,CAAC,CAAC;QACjE,6CACK,kBAAkB,KACrB,QAAQ,wCACH,KAAK,CAAC,UAAU,KACnB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,mBAAmB,EAAE,KAAK,CAAC,mBAAmB,EAC9C,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,OAE1C;IACJ,CAAC;IAbD,8EAaC","sourcesContent":["import { useTableContextValues_unstable } from '../Table/useTableContextValues';\nimport { DataGridContextValues, DataGridState } from './DataGrid.types';\n\nexport function useDataGridContextValues_unstable(state: DataGridState): DataGridContextValues {\n  const tableContextValues = useTableContextValues_unstable(state);\n  return {\n    ...tableContextValues,\n    dataGrid: {\n      ...state.tableState,\n      focusMode: state.focusMode,\n      selectableRows: state.selectableRows,\n      subtleSelection: state.subtleSelection,\n      selectionAppearance: state.selectionAppearance,\n      resizableColumns: state.resizableColumns,\n    },\n  };\n}\n"]}

package/lib-amd/components/DataGrid/useDataGridStyles.js

@@ -0,0 +1,18 @@
+define(["require", "exports", "@griffel/react", "../Table/useTableStyles"], function (require, exports, react_1, useTableStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useDataGridStyles_unstable = exports.dataGridClassNames = void 0;
+    exports.dataGridClassNames = {
+        root: 'fui-DataGrid',
+    };
+    /**
+     * Apply styling to the DataGrid slots based on the state
+     */
+    var useDataGridStyles_unstable = function (state) {
+        useTableStyles_1.useTableStyles_unstable(state);
+        state.root.className = react_1.mergeClasses(exports.dataGridClassNames.root, state.root.className);
+        return state;
+    };
+    exports.useDataGridStyles_unstable = useDataGridStyles_unstable;
+});
+//# sourceMappingURL=useDataGridStyles.js.map

package/lib-amd/components/DataGrid/useDataGridStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataGridStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGrid/useDataGridStyles.ts"],"names":[],"mappings":";;;;IAKa,QAAA,kBAAkB,GAAkC;QAC/D,IAAI,EAAE,cAAc;KACrB,CAAC;IAEF;;OAEG;IACI,IAAM,0BAA0B,GAAG,UAAC,KAAoB;QAC7D,wCAAuB,CAAC,KAAK,CAAC,CAAC;QAC/B,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CAAC,0BAAkB,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAEnF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IALW,QAAA,0BAA0B,8BAKrC","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridSlots, DataGridState } from './DataGrid.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableStyles_unstable } from '../Table/useTableStyles';\n\nexport const dataGridClassNames: SlotClassNames<DataGridSlots> = {\n  root: 'fui-DataGrid',\n};\n\n/**\n * Apply styling to the DataGrid slots based on the state\n */\nexport const useDataGridStyles_unstable = (state: DataGridState): DataGridState => {\n  useTableStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridClassNames.root, state.root.className);\n\n  return state;\n};\n"]}

package/lib-amd/components/DataGridBody/DataGridBody.js

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useDataGridBody", "./renderDataGridBody", "./useDataGridBodyStyles"], function (require, exports, React, useDataGridBody_1, renderDataGridBody_1, useDataGridBodyStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.DataGridBody = void 0;
+    /**
+     * DataGridBody component
+     */
+    exports.DataGridBody = React.forwardRef(function (props, ref) {
+        var state = useDataGridBody_1.useDataGridBody_unstable(props, ref);
+        useDataGridBodyStyles_1.useDataGridBodyStyles_unstable(state);
+        return renderDataGridBody_1.renderDataGridBody_unstable(state);
+    });
+    exports.DataGridBody.displayName = 'DataGridBody';
+});
+//# sourceMappingURL=DataGridBody.js.map

package/lib-amd/components/DataGridBody/DataGridBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridBody.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGridBody/DataGridBody.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,YAAY,GACqC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACxF,IAAM,KAAK,GAAG,0CAAwB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEnD,sDAA8B,CAAC,KAAK,CAAC,CAAC;QACtC,OAAO,gDAA2B,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC,CAAuG,CAAC;IAEzG,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDataGridBody_unstable } from './useDataGridBody';\nimport { renderDataGridBody_unstable } from './renderDataGridBody';\nimport { useDataGridBodyStyles_unstable } from './useDataGridBodyStyles';\nimport type { DataGridBodyProps } from './DataGridBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridBody component\n */\nexport const DataGridBody: ForwardRefComponent<DataGridBodyProps> &\n  (<TItem>(props: DataGridBodyProps<TItem>) => JSX.Element) = React.forwardRef((props, ref) => {\n  const state = useDataGridBody_unstable(props, ref);\n\n  useDataGridBodyStyles_unstable(state);\n  return renderDataGridBody_unstable(state);\n}) as ForwardRefComponent<DataGridBodyProps> & (<TItem>(props: DataGridBodyProps<TItem>) => JSX.Element);\n\nDataGridBody.displayName = 'DataGridBody';\n"]}

package/lib-amd/components/DataGridBody/DataGridBody.types.js

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

package/lib-amd/components/DataGridBody/DataGridBody.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataGridBody.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-table/src/components/DataGridBody/DataGridBody.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { TableRowData } from '../../hooks';\nimport type { TableBodySlots, TableBodyProps, TableBodyState } from '../TableBody/TableBody.types';\n\nexport type DataGridBodySlots = TableBodySlots;\n\nexport type RowRenderFunction<TItem = unknown> = (row: TableRowData<TItem>, ...rest: unknown[]) => React.ReactNode;\n\n/**\n * DataGridBody Props\n */\nexport type DataGridBodyProps<TItem = unknown> = Omit<TableBodyProps, 'children'> & {\n  /**\n   * Render function for rows\n   */\n  children: RowRenderFunction<TItem>;\n};\n\n/**\n * State used in rendering DataGridBody\n */\nexport type DataGridBodyState = TableBodyState & {\n  rows: TableRowData<unknown>[];\n\n  renderRow: RowRenderFunction;\n};\n"]}