@fluentui/react-table 9.8.1 → 9.8.3

package/CHANGELOG.json

@@ -2,7 +2,151 @@
   "name": "@fluentui/react-table",
   "entries": [
     {
-      "date": "Tue, 29 Aug 2023 12:53:35 GMT",
+      "date": "Tue, 05 Sep 2023 15:35:07 GMT",
+      "tag": "@fluentui/react-table_v9.8.3",
+      "version": "9.8.3",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-aria to v9.3.35",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-avatar to v9.5.27",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-checkbox to v9.1.37",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.33",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-radio to v9.1.37",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-tabster to v9.12.7",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-utilities to v9.13.2",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.5",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 05 Sep 2023 13:29:05 GMT",
+      "tag": "@fluentui/react-table_v9.8.2",
+      "version": "9.8.2",
+      "comments": {
+        "patch": [
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-table",
+            "commit": "eea6d93a62249ba4fba3347fb291c67ee1a3fb24",
+            "comment": "chore: migrate package to use JSX importSource"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-table",
+            "commit": "b93c2ac22355b6cb6f33dd509c6cd9c21f4fffc8",
+            "comment": "bumps @swc/helpers version to 0.5.1"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/keyboard-keys to v9.0.4",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-aria to v9.3.34",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-avatar to v9.5.26",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-checkbox to v9.1.36",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.32",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-radio to v9.1.36",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.7.3",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-tabster to v9.12.6",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-theme to v9.1.12",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-utilities to v9.13.1",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-table",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.4",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 29 Aug 2023 12:57:35 GMT",
       "tag": "@fluentui/react-table_v9.8.1",
       "version": "9.8.1",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,49 @@
 # Change Log - @fluentui/react-table
 
-This log was last generated on Tue, 29 Aug 2023 12:53:35 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Sep 2023 15:35:07 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.8.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-table_v9.8.3)
+
+Tue, 05 Sep 2023 15:35:07 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-table_v9.8.2..@fluentui/react-table_v9.8.3)
+
+### Patches
+
+- Bump @fluentui/react-aria to v9.3.35 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-avatar to v9.5.27 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-checkbox to v9.1.37 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.33 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-radio to v9.1.37 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-tabster to v9.12.7 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-utilities to v9.13.2 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.5 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+
+## [9.8.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-table_v9.8.2)
+
+Tue, 05 Sep 2023 13:29:05 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-table_v9.8.1..@fluentui/react-table_v9.8.2)
+
+### Patches
+
+- chore: migrate package to use JSX importSource ([PR #28959](https://github.com/microsoft/fluentui/pull/28959) by bernardo.sunderhus@gmail.com)
+- bumps @swc/helpers version to 0.5.1 ([PR #28989](https://github.com/microsoft/fluentui/pull/28989) by bernardo.sunderhus@gmail.com)
+- Bump @fluentui/keyboard-keys to v9.0.4 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-aria to v9.3.34 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-avatar to v9.5.26 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-checkbox to v9.1.36 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.32 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-radio to v9.1.36 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.7.3 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-tabster to v9.12.6 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-theme to v9.1.12 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-utilities to v9.13.1 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.4 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+
 ## [9.8.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-table_v9.8.1)
 
-Tue, 29 Aug 2023 12:53:35 GMT 
+Tue, 29 Aug 2023 12:57:35 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-table_v9.8.0..@fluentui/react-table_v9.8.1)
 
 ### Patches

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

@@ -1 +1 @@
-{"version":3,"sources":["DataGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGrid_unstable } from './useDataGrid';\nimport { renderDataGrid_unstable } from './renderDataGrid';\nimport { useDataGridStyles_unstable } from './useDataGridStyles.styles';\nimport type { DataGridProps } from './DataGrid.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDataGridContextValues_unstable } from './useDataGridContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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\n  useCustomStyleHook_unstable('useDataGridStyles_unstable')(state);\n\n  return renderDataGrid_unstable(state, useDataGridContextValues_unstable(state));\n});\n\nDataGrid.displayName = 'DataGrid';\n"],"names":["React","useDataGrid_unstable","renderDataGrid_unstable","useDataGridStyles_unstable","useDataGridContextValues_unstable","useCustomStyleHook_unstable","DataGrid","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC3F,MAAMC,QAAQT,qBAAqBO,OAAOC;IAE1CN,2BAA2BO;IAE3BL,4BAA4B,8BAA8BK;IAE1D,OAAOR,wBAAwBQ,OAAON,kCAAkCM;AAC1E,GAAG;AAEHJ,SAASK,WAAW,GAAG"}
+{"version":3,"sources":["DataGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGrid_unstable } from './useDataGrid';\nimport { renderDataGrid_unstable } from './renderDataGrid';\nimport { useDataGridStyles_unstable } from './useDataGridStyles.styles';\nimport type { DataGridProps } from './DataGrid.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDataGridContextValues_unstable } from './useDataGridContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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\n  useCustomStyleHook_unstable('useDataGridStyles_unstable')(state);\n\n  return renderDataGrid_unstable(state, useDataGridContextValues_unstable(state));\n});\n\nDataGrid.displayName = 'DataGrid';\n"],"names":["React","useDataGrid_unstable","renderDataGrid_unstable","useDataGridStyles_unstable","useDataGridContextValues_unstable","useCustomStyleHook_unstable","DataGrid","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQT,qBAAqBO,OAAOC;IAE1CN,2BAA2BO;IAE3BL,4BAA4B,8BAA8BK;IAE1D,OAAOR,wBAAwBQ,OAAON,kCAAkCM;AAC1E,GAAG;AAEHJ,SAASK,WAAW,GAAG"}

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGrid.tsx"],"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"],"names":["React","renderTable_unstable","DataGridContextProvider","renderDataGrid_unstable","state","contextValues","value","dataGrid"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,oBAAoB,QAAQ,uBAAuB;AAC5D,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC,gBAAyC;IACrG,qBACE,oBAACH;QAAwBI,OAAOD,cAAcE,QAAQ;OACnDN,qBAAqBG,OAAOC;AAGnC,EAAE"}
+{"version":3,"sources":["renderDataGrid.tsx"],"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"],"names":["React","renderTable_unstable","DataGridContextProvider","renderDataGrid_unstable","state","contextValues","value","dataGrid"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,oBAAoB,QAAQ,uBAAuB;AAC5D,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5D,qBACE,oBAACH;QAAwBI,OAAOD,cAAcE,QAAQ;OACnDN,qBAAqBG,OAAOC;AAGnC,EAAE"}

package/lib/components/DataGrid/useDataGrid.js

@@ -14,12 +14,12 @@ import { CELL_WIDTH } from '../TableSelectionCell';
  * @param props - props from this instance of DataGrid
  * @param ref - reference to root HTMLElement of DataGrid
  */ export const useDataGrid_unstable = (props, ref)=>{
-    const { items , columns , focusMode ='cell' , selectionMode , onSortChange , onSelectionChange , defaultSortState , sortState , selectedItems , defaultSelectedItems , subtleSelection =false , selectionAppearance ='brand' , getRowId , resizableColumns , columnSizingOptions , onColumnResize , containerWidthOffset  } = props;
+    const { items, columns, focusMode = 'cell', selectionMode, onSortChange, onSelectionChange, defaultSortState, sortState, selectedItems, defaultSelectedItems, subtleSelection = false, selectionAppearance = 'brand', getRowId, resizableColumns, columnSizingOptions, onColumnResize, containerWidthOffset } = props;
     const widthOffset = containerWidthOffset !== null && containerWidthOffset !== void 0 ? containerWidthOffset : selectionMode ? -CELL_WIDTH : 0;
     const gridTabsterAttribute = useArrowNavigationGroup({
         axis: 'grid'
     });
-    const { onTableKeyDown: onCompositeKeyDown , tableTabsterAttribute: compositeTabsterAttribute , tableRowTabsterAttribute: compositeRowTabsterAttribute  } = useTableCompositeNavigation();
+    const { onTableKeyDown: onCompositeKeyDown, tableTabsterAttribute: compositeTabsterAttribute, tableRowTabsterAttribute: compositeRowTabsterAttribute } = useTableCompositeNavigation();
     const tableState = useTableFeatures({
         items,
         columns,
@@ -45,10 +45,10 @@ import { CELL_WIDTH } from '../TableSelectionCell';
         })
     ]);
     const innerRef = React.useRef(null);
-    const { findFirstFocusable , findLastFocusable  } = useFocusFinders();
+    const { findFirstFocusable, findLastFocusable } = useFocusFinders();
     const onKeyDown = useEventCallback((e)=>{
-        var _props_onKeyDown;
-        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);
+        var _props_onKeyDown, _props;
+        (_props_onKeyDown = (_props = props).onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(_props, e);
         focusMode === 'composite' && onCompositeKeyDown(e);
         // handle ctrl+home and ctrl+end
         if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {

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

@@ -1 +1 @@
-{"version":3,"sources":["useDataGrid.ts"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport type { DataGridProps, DataGridState } from './DataGrid.types';\nimport { useTable_unstable } from '../Table/useTable';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { End, Home } from '@fluentui/keyboard-keys';\nimport {\n  useTableFeatures,\n  useTableSort,\n  useTableSelection,\n  useTableColumnSizing_unstable,\n  useTableCompositeNavigation,\n} from '../../hooks';\nimport { CELL_WIDTH } from '../TableSelectionCell';\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    containerWidthOffset,\n  } = props;\n\n  const widthOffset = containerWidthOffset ?? (selectionMode ? -CELL_WIDTH : 0);\n\n  const gridTabsterAttribute = useArrowNavigationGroup({\n    axis: 'grid',\n  });\n\n  const {\n    onTableKeyDown: onCompositeKeyDown,\n    tableTabsterAttribute: compositeTabsterAttribute,\n    tableRowTabsterAttribute: compositeRowTabsterAttribute,\n  } = useTableCompositeNavigation();\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: widthOffset,\n    }),\n  ]);\n\n  const innerRef = React.useRef<HTMLDivElement>(null);\n  const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLTableElement>) => {\n    props.onKeyDown?.(e);\n    focusMode === 'composite' && onCompositeKeyDown(e);\n\n    // handle ctrl+home and ctrl+end\n    if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {\n      return;\n    }\n\n    if (e.key === Home) {\n      const firstRow = innerRef.current.querySelector('[role=\"row\"]') as HTMLElement | null;\n      if (firstRow) {\n        findFirstFocusable(firstRow)?.focus();\n      }\n    }\n\n    if (e.key === End) {\n      const rows = innerRef.current.querySelectorAll('[role=\"row\"]');\n      if (rows.length) {\n        const lastRow = rows.item(rows.length - 1);\n        findLastFocusable(lastRow as HTMLElement)?.focus();\n      }\n    }\n  });\n\n  const baseTableState = useTable_unstable(\n    {\n      role: 'grid',\n      as: 'div',\n      noNativeElements: true,\n      ...(focusMode === 'cell' && gridTabsterAttribute),\n      ...(focusMode === 'composite' && compositeTabsterAttribute),\n      ...props,\n      onKeyDown,\n      ...(resizableColumns ? tableState.columnSizing_unstable.getTableProps(props) : {}),\n    },\n    useMergedRefs(ref, tableState.tableRef, innerRef),\n  );\n\n  return {\n    ...baseTableState,\n    focusMode,\n    tableState,\n    selectableRows: !!selectionMode,\n    subtleSelection,\n    selectionAppearance,\n    resizableColumns,\n    compositeRowTabsterAttribute,\n  };\n};\n"],"names":["React","useArrowNavigationGroup","useFocusFinders","useTable_unstable","useEventCallback","useMergedRefs","End","Home","useTableFeatures","useTableSort","useTableSelection","useTableColumnSizing_unstable","useTableCompositeNavigation","CELL_WIDTH","useDataGrid_unstable","props","ref","items","columns","focusMode","selectionMode","onSortChange","onSelectionChange","defaultSortState","sortState","selectedItems","defaultSelectedItems","subtleSelection","selectionAppearance","getRowId","resizableColumns","columnSizingOptions","onColumnResize","containerWidthOffset","widthOffset","gridTabsterAttribute","axis","onTableKeyDown","onCompositeKeyDown","tableTabsterAttribute","compositeTabsterAttribute","tableRowTabsterAttribute","compositeRowTabsterAttribute","tableState","innerRef","useRef","findFirstFocusable","findLastFocusable","onKeyDown","e","current","ctrlKey","defaultPrevented","key","firstRow","querySelector","focus","rows","querySelectorAll","length","lastRow","item","baseTableState","role","as","noNativeElements","columnSizing_unstable","getTableProps","tableRef","selectableRows"],"mappings":"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"}
+{"version":3,"sources":["useDataGrid.ts"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport type { DataGridProps, DataGridState } from './DataGrid.types';\nimport { useTable_unstable } from '../Table/useTable';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { End, Home } from '@fluentui/keyboard-keys';\nimport {\n  useTableFeatures,\n  useTableSort,\n  useTableSelection,\n  useTableColumnSizing_unstable,\n  useTableCompositeNavigation,\n} from '../../hooks';\nimport { CELL_WIDTH } from '../TableSelectionCell';\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    containerWidthOffset,\n  } = props;\n\n  const widthOffset = containerWidthOffset ?? (selectionMode ? -CELL_WIDTH : 0);\n\n  const gridTabsterAttribute = useArrowNavigationGroup({\n    axis: 'grid',\n  });\n\n  const {\n    onTableKeyDown: onCompositeKeyDown,\n    tableTabsterAttribute: compositeTabsterAttribute,\n    tableRowTabsterAttribute: compositeRowTabsterAttribute,\n  } = useTableCompositeNavigation();\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: widthOffset,\n    }),\n  ]);\n\n  const innerRef = React.useRef<HTMLDivElement>(null);\n  const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLTableElement>) => {\n    props.onKeyDown?.(e);\n    focusMode === 'composite' && onCompositeKeyDown(e);\n\n    // handle ctrl+home and ctrl+end\n    if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {\n      return;\n    }\n\n    if (e.key === Home) {\n      const firstRow = innerRef.current.querySelector('[role=\"row\"]') as HTMLElement | null;\n      if (firstRow) {\n        findFirstFocusable(firstRow)?.focus();\n      }\n    }\n\n    if (e.key === End) {\n      const rows = innerRef.current.querySelectorAll('[role=\"row\"]');\n      if (rows.length) {\n        const lastRow = rows.item(rows.length - 1);\n        findLastFocusable(lastRow as HTMLElement)?.focus();\n      }\n    }\n  });\n\n  const baseTableState = useTable_unstable(\n    {\n      role: 'grid',\n      as: 'div',\n      noNativeElements: true,\n      ...(focusMode === 'cell' && gridTabsterAttribute),\n      ...(focusMode === 'composite' && compositeTabsterAttribute),\n      ...props,\n      onKeyDown,\n      ...(resizableColumns ? tableState.columnSizing_unstable.getTableProps(props) : {}),\n    },\n    useMergedRefs(ref, tableState.tableRef, innerRef),\n  );\n\n  return {\n    ...baseTableState,\n    focusMode,\n    tableState,\n    selectableRows: !!selectionMode,\n    subtleSelection,\n    selectionAppearance,\n    resizableColumns,\n    compositeRowTabsterAttribute,\n  };\n};\n"],"names":["React","useArrowNavigationGroup","useFocusFinders","useTable_unstable","useEventCallback","useMergedRefs","End","Home","useTableFeatures","useTableSort","useTableSelection","useTableColumnSizing_unstable","useTableCompositeNavigation","CELL_WIDTH","useDataGrid_unstable","props","ref","items","columns","focusMode","selectionMode","onSortChange","onSelectionChange","defaultSortState","sortState","selectedItems","defaultSelectedItems","subtleSelection","selectionAppearance","getRowId","resizableColumns","columnSizingOptions","onColumnResize","containerWidthOffset","widthOffset","gridTabsterAttribute","axis","onTableKeyDown","onCompositeKeyDown","tableTabsterAttribute","compositeTabsterAttribute","tableRowTabsterAttribute","compositeRowTabsterAttribute","tableState","innerRef","useRef","findFirstFocusable","findLastFocusable","onKeyDown","e","current","ctrlKey","defaultPrevented","key","firstRow","querySelector","focus","rows","querySelectorAll","length","lastRow","item","baseTableState","role","as","noNativeElements","columnSizing_unstable","getTableProps","tableRef","selectableRows"],"mappings":"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"}

package/lib/components/DataGrid/useDataGridContextValues.js

@@ -1,7 +1,7 @@
 import { useTableContextValues_unstable } from '../Table/useTableContextValues';
 export function useDataGridContextValues_unstable(state) {
     const tableContextValues = useTableContextValues_unstable(state);
-    const { tableState , focusMode , selectableRows , subtleSelection , selectionAppearance , resizableColumns , compositeRowTabsterAttribute  } = state;
+    const { tableState, focusMode, selectableRows, subtleSelection, selectionAppearance, resizableColumns, compositeRowTabsterAttribute } = state;
     return {
         ...tableContextValues,
         dataGrid: {

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

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridContextValues.ts"],"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  const {\n    tableState,\n    focusMode,\n    selectableRows,\n    subtleSelection,\n    selectionAppearance,\n    resizableColumns,\n    compositeRowTabsterAttribute,\n  } = state;\n  return {\n    ...tableContextValues,\n    dataGrid: {\n      ...tableState,\n      focusMode,\n      selectableRows,\n      subtleSelection,\n      selectionAppearance,\n      resizableColumns,\n      compositeRowTabsterAttribute,\n    },\n  };\n}\n"],"names":["useTableContextValues_unstable","useDataGridContextValues_unstable","state","tableContextValues","tableState","focusMode","selectableRows","subtleSelection","selectionAppearance","resizableColumns","compositeRowTabsterAttribute","dataGrid"],"mappings":"AAAA,SAASA,8BAA8B,QAAQ,iCAAiC;AAGhF,OAAO,SAASC,kCAAkCC,KAAoB,EAAyB;IAC7F,MAAMC,qBAAqBH,+BAA+BE;IAC1D,MAAM,EACJE,WAAU,EACVC,UAAS,EACTC,eAAc,EACdC,gBAAe,EACfC,oBAAmB,EACnBC,iBAAgB,EAChBC,6BAA4B,EAC7B,GAAGR;IACJ,OAAO;QACL,GAAGC,kBAAkB;QACrBQ,UAAU;YACR,GAAGP,UAAU;YACbC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;IACF;AACF,CAAC"}
+{"version":3,"sources":["useDataGridContextValues.ts"],"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  const {\n    tableState,\n    focusMode,\n    selectableRows,\n    subtleSelection,\n    selectionAppearance,\n    resizableColumns,\n    compositeRowTabsterAttribute,\n  } = state;\n  return {\n    ...tableContextValues,\n    dataGrid: {\n      ...tableState,\n      focusMode,\n      selectableRows,\n      subtleSelection,\n      selectionAppearance,\n      resizableColumns,\n      compositeRowTabsterAttribute,\n    },\n  };\n}\n"],"names":["useTableContextValues_unstable","useDataGridContextValues_unstable","state","tableContextValues","tableState","focusMode","selectableRows","subtleSelection","selectionAppearance","resizableColumns","compositeRowTabsterAttribute","dataGrid"],"mappings":"AAAA,SAASA,8BAA8B,QAAQ,iCAAiC;AAGhF,OAAO,SAASC,kCAAkCC,KAAoB;IACpE,MAAMC,qBAAqBH,+BAA+BE;IAC1D,MAAM,EACJE,UAAU,EACVC,SAAS,EACTC,cAAc,EACdC,eAAe,EACfC,mBAAmB,EACnBC,gBAAgB,EAChBC,4BAA4B,EAC7B,GAAGR;IACJ,OAAO;QACL,GAAGC,kBAAkB;QACrBQ,UAAU;YACR,GAAGP,UAAU;YACbC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;IACF;AACF"}

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

@@ -1 +1 @@
-{"version":3,"sources":["DataGridBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridBody_unstable } from './useDataGridBody';\nimport { renderDataGridBody_unstable } from './renderDataGridBody';\nimport { useDataGridBodyStyles_unstable } from './useDataGridBodyStyles.styles';\nimport type { DataGridBodyProps } from './DataGridBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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\n  useCustomStyleHook_unstable('useDataGridBodyStyles_unstable')(state);\n\n  return renderDataGridBody_unstable(state);\n}) as ForwardRefComponent<DataGridBodyProps> & (<TItem>(props: DataGridBodyProps<TItem>) => JSX.Element);\n\nDataGridBody.displayName = 'DataGridBody';\n"],"names":["React","useDataGridBody_unstable","renderDataGridBody_unstable","useDataGridBodyStyles_unstable","useCustomStyleHook_unstable","DataGridBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BACiDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC7F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAyG;AAEzGJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["DataGridBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridBody_unstable } from './useDataGridBody';\nimport { renderDataGridBody_unstable } from './renderDataGridBody';\nimport { useDataGridBodyStyles_unstable } from './useDataGridBodyStyles.styles';\nimport type { DataGridBodyProps } from './DataGridBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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\n  useCustomStyleHook_unstable('useDataGridBodyStyles_unstable')(state);\n\n  return renderDataGridBody_unstable(state);\n}) as ForwardRefComponent<DataGridBodyProps> & (<TItem>(props: DataGridBodyProps<TItem>) => JSX.Element);\n\nDataGridBody.displayName = 'DataGridBody';\n"],"names":["React","useDataGridBody_unstable","renderDataGridBody_unstable","useDataGridBodyStyles_unstable","useCustomStyleHook_unstable","DataGridBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BACiDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAyG;AAEzGJ,aAAaK,WAAW,GAAG"}

package/lib/components/DataGridBody/renderDataGridBody.js

@@ -1,12 +1,14 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 import { TableRowIdContextProvider } from '../../contexts/rowIdContext';
 /**
  * Render the final JSX of DataGridBody
  */ export const renderDataGridBody_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null, state.rows.map((row)=>/*#__PURE__*/ createElement(TableRowIdContextProvider, {
-            key: row.rowId,
-            value: row.rowId
-        }, state.renderRow(row))));
+    return /*#__PURE__*/ _jsx(state.root, {
+        children: state.rows.map((row)=>/*#__PURE__*/ _jsx(TableRowIdContextProvider, {
+                value: row.rowId,
+                children: state.renderRow(row)
+            }, row.rowId))
+    });
 };

package/lib/components/DataGridBody/renderDataGridBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGridBody.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DataGridBodyState, DataGridBodySlots } from './DataGridBody.types';\nimport { TableRowIdContextProvider } from '../../contexts/rowIdContext';\n\n/**\n * Render the final JSX of DataGridBody\n */\nexport const renderDataGridBody_unstable = (state: DataGridBodyState) => {\n  assertSlots<DataGridBodySlots>(state);\n\n  return (\n    <state.root>\n      {state.rows.map(row => (\n        <TableRowIdContextProvider key={row.rowId} value={row.rowId}>\n          {state.renderRow(row)}\n        </TableRowIdContextProvider>\n      ))}\n    </state.root>\n  );\n};\n"],"names":["createElement","assertSlots","TableRowIdContextProvider","renderDataGridBody_unstable","state","root","rows","map","row","key","rowId","value","renderRow"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAExD,SAASC,yBAAyB,QAAQ,8BAA8B;AAExE;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC,QAA6B;IACvEH,YAA+BG;IAE/B,qBACE,AAdJ,cAcKA,MAAMC,IAAI,QACRD,MAAME,IAAI,CAACC,GAAG,CAACC,CAAAA,oBACd,AAhBR,cAgBSN;YAA0BO,KAAKD,IAAIE,KAAK;YAAEC,OAAOH,IAAIE,KAAK;WACxDN,MAAMQ,SAAS,CAACJ;AAK3B,EAAE"}
+{"version":3,"sources":["renderDataGridBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DataGridBodyState, DataGridBodySlots } from './DataGridBody.types';\nimport { TableRowIdContextProvider } from '../../contexts/rowIdContext';\n\n/**\n * Render the final JSX of DataGridBody\n */\nexport const renderDataGridBody_unstable = (state: DataGridBodyState) => {\n  assertSlots<DataGridBodySlots>(state);\n\n  return (\n    <state.root>\n      {state.rows.map(row => (\n        <TableRowIdContextProvider key={row.rowId} value={row.rowId}>\n          {state.renderRow(row)}\n        </TableRowIdContextProvider>\n      ))}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","TableRowIdContextProvider","renderDataGridBody_unstable","state","root","rows","map","row","value","rowId","renderRow"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,yBAAyB,QAAQ,8BAA8B;AAExE;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CH,YAA+BG;IAE/B,qBACE,KAACA,MAAMC,IAAI;kBACRD,MAAME,IAAI,CAACC,GAAG,CAACC,CAAAA,oBACd,KAACN;gBAA0CO,OAAOD,IAAIE,KAAK;0BACxDN,MAAMO,SAAS,CAACH;eADaA,IAAIE,KAAK;;AAMjD,EAAE"}

package/lib/components/DataGridBody/useDataGridBody.js

@@ -11,7 +11,7 @@ import { useTableContext } from '../../contexts/tableContext';
  * @param props - props from this instance of DataGridBody
  * @param ref - reference to root HTMLElement of DataGridBody
  */ export const useDataGridBody_unstable = (props, ref)=>{
-    const { sortable  } = useTableContext();
+    const { sortable } = useTableContext();
     const getRows = useDataGridContext_unstable((ctx)=>ctx.getRows);
     const sort = useDataGridContext_unstable((ctx)=>ctx.sort.sort);
     const rows = sortable ? sort(getRows()) : getRows();

package/lib/components/DataGridBody/useDataGridBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { DataGridBodyProps, DataGridBodyState } from './DataGridBody.types';\nimport { useTableBody_unstable } from '../TableBody/useTableBody';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render DataGridBody.\n *\n * The returned state can be modified with hooks such as useDataGridBodyStyles_unstable,\n * before being passed to renderDataGridBody_unstable.\n *\n * @param props - props from this instance of DataGridBody\n * @param ref - reference to root HTMLElement of DataGridBody\n */\nexport const useDataGridBody_unstable = (props: DataGridBodyProps, ref: React.Ref<HTMLElement>): DataGridBodyState => {\n  const { sortable } = useTableContext();\n  const getRows = useDataGridContext_unstable(ctx => ctx.getRows);\n  const sort = useDataGridContext_unstable(ctx => ctx.sort.sort);\n  const rows = sortable ? sort(getRows()) : getRows();\n\n  const baseState = useTableBody_unstable({ ...props, children: null, as: 'div' }, ref);\n  return {\n    ...baseState,\n    rows,\n    renderRow: props.children,\n  };\n};\n"],"names":["React","useTableBody_unstable","useDataGridContext_unstable","useTableContext","useDataGridBody_unstable","props","ref","sortable","getRows","ctx","sort","rows","baseState","children","as","renderRow"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,eAAe,QAAQ,8BAA8B;AAE9D;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC,MAAmD;IACpH,MAAM,EAAEC,SAAQ,EAAE,GAAGJ;IACrB,MAAMK,UAAUN,4BAA4BO,CAAAA,MAAOA,IAAID,OAAO;IAC9D,MAAME,OAAOR,4BAA4BO,CAAAA,MAAOA,IAAIC,IAAI,CAACA,IAAI;IAC7D,MAAMC,OAAOJ,WAAWG,KAAKF,aAAaA,SAAS;IAEnD,MAAMI,YAAYX,sBAAsB;QAAE,GAAGI,KAAK;QAAEQ,UAAU,IAAI;QAAEC,IAAI;IAAM,GAAGR;IACjF,OAAO;QACL,GAAGM,SAAS;QACZD;QACAI,WAAWV,MAAMQ,QAAQ;IAC3B;AACF,EAAE"}
+{"version":3,"sources":["useDataGridBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { DataGridBodyProps, DataGridBodyState } from './DataGridBody.types';\nimport { useTableBody_unstable } from '../TableBody/useTableBody';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render DataGridBody.\n *\n * The returned state can be modified with hooks such as useDataGridBodyStyles_unstable,\n * before being passed to renderDataGridBody_unstable.\n *\n * @param props - props from this instance of DataGridBody\n * @param ref - reference to root HTMLElement of DataGridBody\n */\nexport const useDataGridBody_unstable = (props: DataGridBodyProps, ref: React.Ref<HTMLElement>): DataGridBodyState => {\n  const { sortable } = useTableContext();\n  const getRows = useDataGridContext_unstable(ctx => ctx.getRows);\n  const sort = useDataGridContext_unstable(ctx => ctx.sort.sort);\n  const rows = sortable ? sort(getRows()) : getRows();\n\n  const baseState = useTableBody_unstable({ ...props, children: null, as: 'div' }, ref);\n  return {\n    ...baseState,\n    rows,\n    renderRow: props.children,\n  };\n};\n"],"names":["React","useTableBody_unstable","useDataGridContext_unstable","useTableContext","useDataGridBody_unstable","props","ref","sortable","getRows","ctx","sort","rows","baseState","children","as","renderRow"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,eAAe,QAAQ,8BAA8B;AAE9D;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EAAEC,QAAQ,EAAE,GAAGJ;IACrB,MAAMK,UAAUN,4BAA4BO,CAAAA,MAAOA,IAAID,OAAO;IAC9D,MAAME,OAAOR,4BAA4BO,CAAAA,MAAOA,IAAIC,IAAI,CAACA,IAAI;IAC7D,MAAMC,OAAOJ,WAAWG,KAAKF,aAAaA;IAE1C,MAAMI,YAAYX,sBAAsB;QAAE,GAAGI,KAAK;QAAEQ,UAAU;QAAMC,IAAI;IAAM,GAAGR;IACjF,OAAO;QACL,GAAGM,SAAS;QACZD;QACAI,WAAWV,MAAMQ,QAAQ;IAC3B;AACF,EAAE"}

package/lib/components/DataGridCell/DataGridCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DataGridCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridCell_unstable } from './useDataGridCell';\nimport { renderDataGridCell_unstable } from './renderDataGridCell';\nimport { useDataGridCellStyles_unstable } from './useDataGridCellStyles.styles';\nimport type { DataGridCellProps } from './DataGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridCell component\n */\nexport const DataGridCell: ForwardRefComponent<DataGridCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridCell_unstable(props, ref);\n\n  useDataGridCellStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridCellStyles_unstable')(state);\n\n  return renderDataGridCell_unstable(state);\n});\n\nDataGridCell.displayName = 'DataGridCell';\n"],"names":["React","useDataGridCell_unstable","renderDataGridCell_unstable","useDataGridCellStyles_unstable","useCustomStyleHook_unstable","DataGridCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnG,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["DataGridCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridCell_unstable } from './useDataGridCell';\nimport { renderDataGridCell_unstable } from './renderDataGridCell';\nimport { useDataGridCellStyles_unstable } from './useDataGridCellStyles.styles';\nimport type { DataGridCellProps } from './DataGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridCell component\n */\nexport const DataGridCell: ForwardRefComponent<DataGridCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridCell_unstable(props, ref);\n\n  useDataGridCellStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridCellStyles_unstable')(state);\n\n  return renderDataGridCell_unstable(state);\n});\n\nDataGridCell.displayName = 'DataGridCell';\n"],"names":["React","useDataGridCell_unstable","renderDataGridCell_unstable","useDataGridCellStyles_unstable","useCustomStyleHook_unstable","DataGridCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/DataGridCell/renderDataGridCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGridCell.tsx"],"sourcesContent":["import type { DataGridCellState } from './DataGridCell.types';\nimport { renderTableCell_unstable } from '../TableCell/renderTableCell';\n\n/**\n * Render the final JSX of DataGridCell\n */\nexport const renderDataGridCell_unstable = (state: DataGridCellState) => {\n  return renderTableCell_unstable(state);\n};\n"],"names":["renderTableCell_unstable","renderDataGridCell_unstable","state"],"mappings":"AACA,SAASA,wBAAwB,QAAQ,+BAA+B;AAExE;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC,QAA6B;IACvE,OAAOF,yBAAyBE;AAClC,EAAE"}
+{"version":3,"sources":["renderDataGridCell.tsx"],"sourcesContent":["import type { DataGridCellState } from './DataGridCell.types';\nimport { renderTableCell_unstable } from '../TableCell/renderTableCell';\n\n/**\n * Render the final JSX of DataGridCell\n */\nexport const renderDataGridCell_unstable = (state: DataGridCellState) => {\n  return renderTableCell_unstable(state);\n};\n"],"names":["renderTableCell_unstable","renderDataGridCell_unstable","state"],"mappings":"AACA,SAASA,wBAAwB,QAAQ,+BAA+B;AAExE;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1C,OAAOF,yBAAyBE;AAClC,EAAE"}

package/lib/components/DataGridCell/useDataGridCell.js

@@ -12,7 +12,7 @@ import { useColumnIdContext } from '../../contexts/columnIdContext';
  * @param props - props from this instance of DataGridCell
  * @param ref - reference to root HTMLElement of DataGridCell
  */ export const useDataGridCell_unstable = (props, ref)=>{
-    const { focusMode ='cell'  } = props;
+    const { focusMode = 'cell' } = props;
     const columnId = useColumnIdContext();
     const tabbable = useDataGridContext_unstable((ctx)=>(ctx.focusMode === 'cell' || ctx.focusMode === 'composite') && focusMode !== 'none');
     const resizableColumns = useDataGridContext_unstable((ctx)=>ctx.resizableColumns);

package/lib/components/DataGridCell/useDataGridCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridCell.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport type { DataGridCellProps, DataGridCellState } from './DataGridCell.types';\nimport { useTableCell_unstable } from '../TableCell/useTableCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\n\n/**\n * Create the state required to render DataGridCell.\n *\n * The returned state can be modified with hooks such as useDataGridCellStyles_unstable,\n * before being passed to renderDataGridCell_unstable.\n *\n * @param props - props from this instance of DataGridCell\n * @param ref - reference to root HTMLElement of DataGridCell\n */\nexport const useDataGridCell_unstable = (props: DataGridCellProps, ref: React.Ref<HTMLElement>): DataGridCellState => {\n  const { focusMode = 'cell' } = props;\n  const columnId = useColumnIdContext();\n  const tabbable = useDataGridContext_unstable(\n    ctx => (ctx.focusMode === 'cell' || ctx.focusMode === 'composite') && focusMode !== 'none',\n  );\n  const resizableColumns = useDataGridContext_unstable(ctx => ctx.resizableColumns);\n  const columnSizing = useDataGridContext_unstable(ctx => ctx.columnSizing_unstable);\n  const focusableGroupAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  return useTableCell_unstable(\n    {\n      as: 'div',\n      role: 'gridcell',\n      ...(focusMode === 'group' && focusableGroupAttr),\n      tabIndex: tabbable ? 0 : undefined,\n      ...(resizableColumns ? columnSizing.getTableCellProps(columnId) : {}),\n      ...props,\n    },\n    ref,\n  );\n};\n"],"names":["React","useFocusableGroup","useTableCell_unstable","useDataGridContext_unstable","useColumnIdContext","useDataGridCell_unstable","props","ref","focusMode","columnId","tabbable","ctx","resizableColumns","columnSizing","columnSizing_unstable","focusableGroupAttr","tabBehavior","as","role","tabIndex","undefined","getTableCellProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ,0BAA0B;AAE5D,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC,MAAmD;IACpH,MAAM,EAAEC,WAAY,OAAM,EAAE,GAAGF;IAC/B,MAAMG,WAAWL;IACjB,MAAMM,WAAWP,4BACfQ,CAAAA,MAAO,AAACA,CAAAA,IAAIH,SAAS,KAAK,UAAUG,IAAIH,SAAS,KAAK,WAAU,KAAMA,cAAc;IAEtF,MAAMI,mBAAmBT,4BAA4BQ,CAAAA,MAAOA,IAAIC,gBAAgB;IAChF,MAAMC,eAAeV,4BAA4BQ,CAAAA,MAAOA,IAAIG,qBAAqB;IACjF,MAAMC,qBAAqBd,kBAAkB;QAAEe,aAAa;IAAqB;IACjF,OAAOd,sBACL;QACEe,IAAI;QACJC,MAAM;QACN,GAAIV,cAAc,WAAWO,kBAAkB;QAC/CI,UAAUT,WAAW,IAAIU,SAAS;QAClC,GAAIR,mBAAmBC,aAAaQ,iBAAiB,CAACZ,YAAY,CAAC,CAAC;QACpE,GAAGH,KAAK;IACV,GACAC;AAEJ,EAAE"}
+{"version":3,"sources":["useDataGridCell.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport type { DataGridCellProps, DataGridCellState } from './DataGridCell.types';\nimport { useTableCell_unstable } from '../TableCell/useTableCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\n\n/**\n * Create the state required to render DataGridCell.\n *\n * The returned state can be modified with hooks such as useDataGridCellStyles_unstable,\n * before being passed to renderDataGridCell_unstable.\n *\n * @param props - props from this instance of DataGridCell\n * @param ref - reference to root HTMLElement of DataGridCell\n */\nexport const useDataGridCell_unstable = (props: DataGridCellProps, ref: React.Ref<HTMLElement>): DataGridCellState => {\n  const { focusMode = 'cell' } = props;\n  const columnId = useColumnIdContext();\n  const tabbable = useDataGridContext_unstable(\n    ctx => (ctx.focusMode === 'cell' || ctx.focusMode === 'composite') && focusMode !== 'none',\n  );\n  const resizableColumns = useDataGridContext_unstable(ctx => ctx.resizableColumns);\n  const columnSizing = useDataGridContext_unstable(ctx => ctx.columnSizing_unstable);\n  const focusableGroupAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  return useTableCell_unstable(\n    {\n      as: 'div',\n      role: 'gridcell',\n      ...(focusMode === 'group' && focusableGroupAttr),\n      tabIndex: tabbable ? 0 : undefined,\n      ...(resizableColumns ? columnSizing.getTableCellProps(columnId) : {}),\n      ...props,\n    },\n    ref,\n  );\n};\n"],"names":["React","useFocusableGroup","useTableCell_unstable","useDataGridContext_unstable","useColumnIdContext","useDataGridCell_unstable","props","ref","focusMode","columnId","tabbable","ctx","resizableColumns","columnSizing","columnSizing_unstable","focusableGroupAttr","tabBehavior","as","role","tabIndex","undefined","getTableCellProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ,0BAA0B;AAE5D,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EAAEC,YAAY,MAAM,EAAE,GAAGF;IAC/B,MAAMG,WAAWL;IACjB,MAAMM,WAAWP,4BACfQ,CAAAA,MAAO,AAACA,CAAAA,IAAIH,SAAS,KAAK,UAAUG,IAAIH,SAAS,KAAK,WAAU,KAAMA,cAAc;IAEtF,MAAMI,mBAAmBT,4BAA4BQ,CAAAA,MAAOA,IAAIC,gBAAgB;IAChF,MAAMC,eAAeV,4BAA4BQ,CAAAA,MAAOA,IAAIG,qBAAqB;IACjF,MAAMC,qBAAqBd,kBAAkB;QAAEe,aAAa;IAAqB;IACjF,OAAOd,sBACL;QACEe,IAAI;QACJC,MAAM;QACN,GAAIV,cAAc,WAAWO,kBAAkB;QAC/CI,UAAUT,WAAW,IAAIU;QACzB,GAAIR,mBAAmBC,aAAaQ,iBAAiB,CAACZ,YAAY,CAAC,CAAC;QACpE,GAAGH,KAAK;IACV,GACAC;AAEJ,EAAE"}

package/lib/components/DataGridHeader/DataGridHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DataGridHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeader_unstable } from './useDataGridHeader';\nimport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nimport { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles.styles';\nimport type { DataGridHeaderProps } from './DataGridHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeader component\n */\nexport const DataGridHeader: ForwardRefComponent<DataGridHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeader_unstable(props, ref);\n\n  useDataGridHeaderStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridHeaderStyles_unstable')(state);\n\n  return renderDataGridHeader_unstable(state);\n});\n\nDataGridHeader.displayName = 'DataGridHeader';\n"],"names":["React","useDataGridHeader_unstable","renderDataGridHeader_unstable","useDataGridHeaderStyles_unstable","useCustomStyleHook_unstable","DataGridHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACvG,MAAMC,QAAQR,2BAA2BM,OAAOC;IAEhDL,iCAAiCM;IAEjCL,4BAA4B,oCAAoCK;IAEhE,OAAOP,8BAA8BO;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
+{"version":3,"sources":["DataGridHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeader_unstable } from './useDataGridHeader';\nimport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nimport { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles.styles';\nimport type { DataGridHeaderProps } from './DataGridHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeader component\n */\nexport const DataGridHeader: ForwardRefComponent<DataGridHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeader_unstable(props, ref);\n\n  useDataGridHeaderStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridHeaderStyles_unstable')(state);\n\n  return renderDataGridHeader_unstable(state);\n});\n\nDataGridHeader.displayName = 'DataGridHeader';\n"],"names":["React","useDataGridHeader_unstable","renderDataGridHeader_unstable","useDataGridHeaderStyles_unstable","useCustomStyleHook_unstable","DataGridHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQR,2BAA2BM,OAAOC;IAEhDL,iCAAiCM;IAEjCL,4BAA4B,oCAAoCK;IAEhE,OAAOP,8BAA8BO;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

package/lib/components/DataGridHeader/renderDataGridHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGridHeader.tsx"],"sourcesContent":["import { renderTableHeader_unstable } from '../TableHeader/renderTableHeader';\nimport type { DataGridHeaderState } from './DataGridHeader.types';\n\n/**\n * Render the final JSX of DataGridHeader\n */\nexport const renderDataGridHeader_unstable = (state: DataGridHeaderState) => {\n  return renderTableHeader_unstable(state);\n};\n"],"names":["renderTableHeader_unstable","renderDataGridHeader_unstable","state"],"mappings":"AAAA,SAASA,0BAA0B,QAAQ,mCAAmC;AAG9E;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC,QAA+B;IAC3E,OAAOF,2BAA2BE;AACpC,EAAE"}
+{"version":3,"sources":["renderDataGridHeader.tsx"],"sourcesContent":["import { renderTableHeader_unstable } from '../TableHeader/renderTableHeader';\nimport type { DataGridHeaderState } from './DataGridHeader.types';\n\n/**\n * Render the final JSX of DataGridHeader\n */\nexport const renderDataGridHeader_unstable = (state: DataGridHeaderState) => {\n  return renderTableHeader_unstable(state);\n};\n"],"names":["renderTableHeader_unstable","renderDataGridHeader_unstable","state"],"mappings":"AAAA,SAASA,0BAA0B,QAAQ,mCAAmC;AAG9E;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C,OAAOF,2BAA2BE;AACpC,EAAE"}

package/lib/components/DataGridHeader/useDataGridHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport type { DataGridHeaderProps, DataGridHeaderState } from './DataGridHeader.types';\nimport { useTableHeader_unstable } from '../TableHeader/useTableHeader';\n\n/**\n * Create the state required to render DataGridHeader.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderStyles_unstable,\n * before being passed to renderDataGridHeader_unstable.\n *\n * @param props - props from this instance of DataGridHeader\n * @param ref - reference to root HTMLElement of DataGridHeader\n */\nexport const useDataGridHeader_unstable = (\n  props: DataGridHeaderProps,\n  ref: React.Ref<HTMLElement>,\n): DataGridHeaderState => {\n  return useTableHeader_unstable({ ...props, as: 'div' }, ref);\n};\n"],"names":["React","useTableHeader_unstable","useDataGridHeader_unstable","props","ref","as"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,QAAQ,gCAAgC;AAExE;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC,MACwB;IACxB,OAAOH,wBAAwB;QAAE,GAAGE,KAAK;QAAEE,IAAI;IAAM,GAAGD;AAC1D,EAAE"}
+{"version":3,"sources":["useDataGridHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport type { DataGridHeaderProps, DataGridHeaderState } from './DataGridHeader.types';\nimport { useTableHeader_unstable } from '../TableHeader/useTableHeader';\n\n/**\n * Create the state required to render DataGridHeader.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderStyles_unstable,\n * before being passed to renderDataGridHeader_unstable.\n *\n * @param props - props from this instance of DataGridHeader\n * @param ref - reference to root HTMLElement of DataGridHeader\n */\nexport const useDataGridHeader_unstable = (\n  props: DataGridHeaderProps,\n  ref: React.Ref<HTMLElement>,\n): DataGridHeaderState => {\n  return useTableHeader_unstable({ ...props, as: 'div' }, ref);\n};\n"],"names":["React","useTableHeader_unstable","useDataGridHeader_unstable","props","ref","as"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,QAAQ,gCAAgC;AAExE;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,OAAOH,wBAAwB;QAAE,GAAGE,KAAK;QAAEE,IAAI;IAAM,GAAGD;AAC1D,EAAE"}

package/lib/components/DataGridHeaderCell/DataGridHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DataGridHeaderCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';\nimport { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';\nimport { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles.styles';\nimport type { DataGridHeaderCellProps } from './DataGridHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeaderCell component\n */\nexport const DataGridHeaderCell: ForwardRefComponent<DataGridHeaderCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeaderCell_unstable(props, ref);\n\n  useDataGridHeaderCellStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridHeaderCellStyles_unstable')(state);\n\n  return renderDataGridHeaderCell_unstable(state);\n});\n\nDataGridHeaderCell.displayName = 'DataGridHeaderCell';\n"],"names":["React","useDataGridHeaderCell_unstable","renderDataGridHeaderCell_unstable","useDataGridHeaderCellStyles_unstable","useCustomStyleHook_unstable","DataGridHeaderCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,oCAAoC,QAAQ,uCAAuC;AAG5F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,mCAAmEL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC/G,MAAMC,QAAQR,+BAA+BM,OAAOC;IAEpDL,qCAAqCM;IAErCL,4BAA4B,wCAAwCK;IAEpE,OAAOP,kCAAkCO;AAC3C,GAAG;AAEHJ,mBAAmBK,WAAW,GAAG"}
+{"version":3,"sources":["DataGridHeaderCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';\nimport { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';\nimport { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles.styles';\nimport type { DataGridHeaderCellProps } from './DataGridHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeaderCell component\n */\nexport const DataGridHeaderCell: ForwardRefComponent<DataGridHeaderCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeaderCell_unstable(props, ref);\n\n  useDataGridHeaderCellStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridHeaderCellStyles_unstable')(state);\n\n  return renderDataGridHeaderCell_unstable(state);\n});\n\nDataGridHeaderCell.displayName = 'DataGridHeaderCell';\n"],"names":["React","useDataGridHeaderCell_unstable","renderDataGridHeaderCell_unstable","useDataGridHeaderCellStyles_unstable","useCustomStyleHook_unstable","DataGridHeaderCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,oCAAoC,QAAQ,uCAAuC;AAG5F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,mCAAmEL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvG,MAAMC,QAAQR,+BAA+BM,OAAOC;IAEpDL,qCAAqCM;IAErCL,4BAA4B,wCAAwCK;IAEpE,OAAOP,kCAAkCO;AAC3C,GAAG;AAEHJ,mBAAmBK,WAAW,GAAG"}

package/lib/components/DataGridHeaderCell/renderDataGridHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGridHeaderCell.tsx"],"sourcesContent":["import type { DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport { renderTableHeaderCell_unstable } from '../TableHeaderCell/renderTableHeaderCell';\n\n/**\n * Render the final JSX of DataGridHeaderCell\n */\nexport const renderDataGridHeaderCell_unstable = (state: DataGridHeaderCellState) => {\n  return renderTableHeaderCell_unstable(state);\n};\n"],"names":["renderTableHeaderCell_unstable","renderDataGridHeaderCell_unstable","state"],"mappings":"AACA,SAASA,8BAA8B,QAAQ,2CAA2C;AAE1F;;CAEC,GACD,OAAO,MAAMC,oCAAoC,CAACC,QAAmC;IACnF,OAAOF,+BAA+BE;AACxC,EAAE"}
+{"version":3,"sources":["renderDataGridHeaderCell.tsx"],"sourcesContent":["import type { DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport { renderTableHeaderCell_unstable } from '../TableHeaderCell/renderTableHeaderCell';\n\n/**\n * Render the final JSX of DataGridHeaderCell\n */\nexport const renderDataGridHeaderCell_unstable = (state: DataGridHeaderCellState) => {\n  return renderTableHeaderCell_unstable(state);\n};\n"],"names":["renderTableHeaderCell_unstable","renderDataGridHeaderCell_unstable","state"],"mappings":"AACA,SAASA,8BAA8B,QAAQ,2CAA2C;AAE1F;;CAEC,GACD,OAAO,MAAMC,oCAAoC,CAACC;IAChD,OAAOF,+BAA+BE;AACxC,EAAE"}

package/lib/components/DataGridHeaderCell/useDataGridHeaderCell.js

@@ -14,18 +14,18 @@ import { useTableContext } from '../../contexts/tableContext';
  * @param ref - reference to root HTMLElement of DataGridHeaderCell
  */ export const useDataGridHeaderCell_unstable = (props, ref)=>{
     const columnId = useColumnIdContext();
-    const { sortable  } = useTableContext();
+    const { sortable } = useTableContext();
     const toggleColumnSort = useDataGridContext_unstable((ctx)=>ctx.sort.toggleColumnSort);
     const sortDirection = useDataGridContext_unstable((ctx)=>sortable ? ctx.sort.getSortDirection(columnId) : undefined);
     const resizableColumns = useDataGridContext_unstable((ctx)=>ctx.resizableColumns);
     const columnSizing = useDataGridContext_unstable((ctx)=>ctx.columnSizing_unstable);
     // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement
     const onClick = useEventCallback((e)=>{
-        var _props_onClick;
+        var _props_onClick, _props;
         if (sortable) {
             toggleColumnSort(e, columnId);
         }
-        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
+        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);
     });
     return useTableHeaderCell_unstable({
         sortDirection,

package/lib/components/DataGridHeaderCell/useDataGridHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridHeaderCell.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport type { DataGridHeaderCellProps, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport { useTableHeaderCell_unstable } from '../TableHeaderCell/useTableHeaderCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render DataGridHeaderCell.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderCellStyles_unstable,\n * before being passed to renderDataGridHeaderCell_unstable.\n *\n * @param props - props from this instance of DataGridHeaderCell\n * @param ref - reference to root HTMLElement of DataGridHeaderCell\n */\nexport const useDataGridHeaderCell_unstable = (\n  props: DataGridHeaderCellProps,\n  ref: React.Ref<HTMLElement>,\n): DataGridHeaderCellState => {\n  const columnId = useColumnIdContext();\n  const { sortable } = useTableContext();\n  const toggleColumnSort = useDataGridContext_unstable(ctx => ctx.sort.toggleColumnSort);\n  const sortDirection = useDataGridContext_unstable(ctx =>\n    sortable ? ctx.sort.getSortDirection(columnId) : undefined,\n  );\n\n  const resizableColumns = useDataGridContext_unstable(ctx => ctx.resizableColumns);\n  const columnSizing = useDataGridContext_unstable(ctx => ctx.columnSizing_unstable);\n\n  // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement\n  const onClick = useEventCallback((e: React.MouseEvent<HTMLTableHeaderCellElement>) => {\n    if (sortable) {\n      toggleColumnSort(e, columnId);\n    }\n    props.onClick?.(e);\n  });\n\n  return useTableHeaderCell_unstable(\n    {\n      sortDirection,\n      as: 'div',\n      tabIndex: sortable ? undefined : 0,\n      ...(resizableColumns ? columnSizing.getTableHeaderCellProps(columnId) : {}),\n      ...props,\n      onClick,\n    },\n    ref,\n  );\n};\n"],"names":["React","useEventCallback","useTableHeaderCell_unstable","useDataGridContext_unstable","useColumnIdContext","useTableContext","useDataGridHeaderCell_unstable","props","ref","columnId","sortable","toggleColumnSort","ctx","sort","sortDirection","getSortDirection","undefined","resizableColumns","columnSizing","columnSizing_unstable","onClick","e","as","tabIndex","getTableHeaderCellProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,SAASC,2BAA2B,QAAQ,wCAAwC;AACpF,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,iCAAiC;AACpE,SAASC,eAAe,QAAQ,8BAA8B;AAE9D;;;;;;;;CAQC,GACD,OAAO,MAAMC,iCAAiC,CAC5CC,OACAC,MAC4B;IAC5B,MAAMC,WAAWL;IACjB,MAAM,EAAEM,SAAQ,EAAE,GAAGL;IACrB,MAAMM,mBAAmBR,4BAA4BS,CAAAA,MAAOA,IAAIC,IAAI,CAACF,gBAAgB;IACrF,MAAMG,gBAAgBX,4BAA4BS,CAAAA,MAChDF,WAAWE,IAAIC,IAAI,CAACE,gBAAgB,CAACN,YAAYO,SAAS;IAG5D,MAAMC,mBAAmBd,4BAA4BS,CAAAA,MAAOA,IAAIK,gBAAgB;IAChF,MAAMC,eAAef,4BAA4BS,CAAAA,MAAOA,IAAIO,qBAAqB;IAEjF,kFAAkF;IAClF,MAAMC,UAAUnB,iBAAiB,CAACoB,IAAoD;YAIpFd;QAHA,IAAIG,UAAU;YACZC,iBAAiBU,GAAGZ;QACtB,CAAC;QACDF,CAAAA,iBAAAA,MAAMa,OAAO,cAAbb,4BAAAA,KAAAA,IAAAA,eAAAA,KAAAA,OAAgBc;IAClB;IAEA,OAAOnB,4BACL;QACEY;QACAQ,IAAI;QACJC,UAAUb,WAAWM,YAAY,CAAC;QAClC,GAAIC,mBAAmBC,aAAaM,uBAAuB,CAACf,YAAY,CAAC,CAAC;QAC1E,GAAGF,KAAK;QACRa;IACF,GACAZ;AAEJ,EAAE"}
+{"version":3,"sources":["useDataGridHeaderCell.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport type { DataGridHeaderCellProps, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport { useTableHeaderCell_unstable } from '../TableHeaderCell/useTableHeaderCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render DataGridHeaderCell.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderCellStyles_unstable,\n * before being passed to renderDataGridHeaderCell_unstable.\n *\n * @param props - props from this instance of DataGridHeaderCell\n * @param ref - reference to root HTMLElement of DataGridHeaderCell\n */\nexport const useDataGridHeaderCell_unstable = (\n  props: DataGridHeaderCellProps,\n  ref: React.Ref<HTMLElement>,\n): DataGridHeaderCellState => {\n  const columnId = useColumnIdContext();\n  const { sortable } = useTableContext();\n  const toggleColumnSort = useDataGridContext_unstable(ctx => ctx.sort.toggleColumnSort);\n  const sortDirection = useDataGridContext_unstable(ctx =>\n    sortable ? ctx.sort.getSortDirection(columnId) : undefined,\n  );\n\n  const resizableColumns = useDataGridContext_unstable(ctx => ctx.resizableColumns);\n  const columnSizing = useDataGridContext_unstable(ctx => ctx.columnSizing_unstable);\n\n  // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement\n  const onClick = useEventCallback((e: React.MouseEvent<HTMLTableHeaderCellElement>) => {\n    if (sortable) {\n      toggleColumnSort(e, columnId);\n    }\n    props.onClick?.(e);\n  });\n\n  return useTableHeaderCell_unstable(\n    {\n      sortDirection,\n      as: 'div',\n      tabIndex: sortable ? undefined : 0,\n      ...(resizableColumns ? columnSizing.getTableHeaderCellProps(columnId) : {}),\n      ...props,\n      onClick,\n    },\n    ref,\n  );\n};\n"],"names":["React","useEventCallback","useTableHeaderCell_unstable","useDataGridContext_unstable","useColumnIdContext","useTableContext","useDataGridHeaderCell_unstable","props","ref","columnId","sortable","toggleColumnSort","ctx","sort","sortDirection","getSortDirection","undefined","resizableColumns","columnSizing","columnSizing_unstable","onClick","e","as","tabIndex","getTableHeaderCellProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,SAASC,2BAA2B,QAAQ,wCAAwC;AACpF,SAASC,2BAA2B,QAAQ,iCAAiC;AAC7E,SAASC,kBAAkB,QAAQ,iCAAiC;AACpE,SAASC,eAAe,QAAQ,8BAA8B;AAE9D;;;;;;;;CAQC,GACD,OAAO,MAAMC,iCAAiC,CAC5CC,OACAC;IAEA,MAAMC,WAAWL;IACjB,MAAM,EAAEM,QAAQ,EAAE,GAAGL;IACrB,MAAMM,mBAAmBR,4BAA4BS,CAAAA,MAAOA,IAAIC,IAAI,CAACF,gBAAgB;IACrF,MAAMG,gBAAgBX,4BAA4BS,CAAAA,MAChDF,WAAWE,IAAIC,IAAI,CAACE,gBAAgB,CAACN,YAAYO;IAGnD,MAAMC,mBAAmBd,4BAA4BS,CAAAA,MAAOA,IAAIK,gBAAgB;IAChF,MAAMC,eAAef,4BAA4BS,CAAAA,MAAOA,IAAIO,qBAAqB;IAEjF,kFAAkF;IAClF,MAAMC,UAAUnB,iBAAiB,CAACoB;YAIhCd,gBAAAA;QAHA,IAAIG,UAAU;YACZC,iBAAiBU,GAAGZ;QACtB;SACAF,iBAAAA,CAAAA,SAAAA,OAAMa,OAAO,cAAbb,qCAAAA,oBAAAA,QAAgBc;IAClB;IAEA,OAAOnB,4BACL;QACEY;QACAQ,IAAI;QACJC,UAAUb,WAAWM,YAAY;QACjC,GAAIC,mBAAmBC,aAAaM,uBAAuB,CAACf,YAAY,CAAC,CAAC;QAC1E,GAAGF,KAAK;QACRa;IACF,GACAZ;AAEJ,EAAE"}

package/lib/components/DataGridRow/DataGridRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DataGridRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridRow_unstable } from './useDataGridRow';\nimport { renderDataGridRow_unstable } from './renderDataGridRow';\nimport { useDataGridRowStyles_unstable } from './useDataGridRowStyles.styles';\nimport type { DataGridRowProps } from './DataGridRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridRow component\n */\nexport const DataGridRow: ForwardRefComponent<DataGridRowProps> &\n  (<TItem>(props: DataGridRowProps<TItem>) => JSX.Element) = React.forwardRef((props, ref) => {\n  const state = useDataGridRow_unstable(props, ref);\n\n  useDataGridRowStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridRowStyles_unstable')(state);\n\n  return renderDataGridRow_unstable(state);\n}) as ForwardRefComponent<DataGridRowProps> & (<TItem>(props: DataGridRowProps<TItem>) => JSX.Element);\n\nDataGridRow.displayName = 'DataGridRow';\n"],"names":["React","useDataGridRow_unstable","renderDataGridRow_unstable","useDataGridRowStyles_unstable","useCustomStyleHook_unstable","DataGridRow","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BACgDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC5F,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAuG;AAEvGJ,YAAYK,WAAW,GAAG"}
+{"version":3,"sources":["DataGridRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridRow_unstable } from './useDataGridRow';\nimport { renderDataGridRow_unstable } from './renderDataGridRow';\nimport { useDataGridRowStyles_unstable } from './useDataGridRowStyles.styles';\nimport type { DataGridRowProps } from './DataGridRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridRow component\n */\nexport const DataGridRow: ForwardRefComponent<DataGridRowProps> &\n  (<TItem>(props: DataGridRowProps<TItem>) => JSX.Element) = React.forwardRef((props, ref) => {\n  const state = useDataGridRow_unstable(props, ref);\n\n  useDataGridRowStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDataGridRowStyles_unstable')(state);\n\n  return renderDataGridRow_unstable(state);\n}) as ForwardRefComponent<DataGridRowProps> & (<TItem>(props: DataGridRowProps<TItem>) => JSX.Element);\n\nDataGridRow.displayName = 'DataGridRow';\n"],"names":["React","useDataGridRow_unstable","renderDataGridRow_unstable","useDataGridRowStyles_unstable","useCustomStyleHook_unstable","DataGridRow","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BACgDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACpF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAuG;AAEvGJ,YAAYK,WAAW,GAAG"}

package/lib/components/DataGridRow/renderDataGridRow.js

@@ -1,12 +1,17 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 import { ColumnIdContextProvider } from '../../contexts/columnIdContext';
 /**
  * Render the final JSX of DataGridRow
  */ export const renderDataGridRow_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null, state.selectionCell && /*#__PURE__*/ createElement(state.selectionCell, null), state.columnDefs.map((columnDef)=>/*#__PURE__*/ createElement(ColumnIdContextProvider, {
-            value: columnDef.columnId,
-            key: columnDef.columnId
-        }, state.renderCell(columnDef, state.dataGridContextValue))));
+    return /*#__PURE__*/ _jsxs(state.root, {
+        children: [
+            state.selectionCell && /*#__PURE__*/ _jsx(state.selectionCell, {}),
+            state.columnDefs.map((columnDef)=>/*#__PURE__*/ _jsx(ColumnIdContextProvider, {
+                    value: columnDef.columnId,
+                    children: state.renderCell(columnDef, state.dataGridContextValue)
+                }, columnDef.columnId))
+        ]
+    });
 };

package/lib/components/DataGridRow/renderDataGridRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDataGridRow.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DataGridRowState, DataGridRowSlots } from './DataGridRow.types';\nimport { ColumnIdContextProvider } from '../../contexts/columnIdContext';\n\n/**\n * Render the final JSX of DataGridRow\n */\nexport const renderDataGridRow_unstable = (state: DataGridRowState) => {\n  assertSlots<DataGridRowSlots>(state);\n\n  return (\n    <state.root>\n      {state.selectionCell && <state.selectionCell />}\n      {state.columnDefs.map(columnDef => (\n        <ColumnIdContextProvider value={columnDef.columnId} key={columnDef.columnId}>\n          {state.renderCell(columnDef, state.dataGridContextValue)}\n        </ColumnIdContextProvider>\n      ))}\n    </state.root>\n  );\n};\n"],"names":["createElement","assertSlots","ColumnIdContextProvider","renderDataGridRow_unstable","state","root","selectionCell","columnDefs","map","columnDef","value","columnId","key","renderCell","dataGridContextValue"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC,QAA4B;IACrEH,YAA8BG;IAE9B,qBACE,AAdJ,cAcKA,MAAMC,IAAI,QACRD,MAAME,aAAa,kBAAI,AAf9B,cAe+BF,MAAME,aAAa,SAC3CF,MAAMG,UAAU,CAACC,GAAG,CAACC,CAAAA,0BACpB,AAjBR,cAiBSP;YAAwBQ,OAAOD,UAAUE,QAAQ;YAAEC,KAAKH,UAAUE,QAAQ;WACxEP,MAAMS,UAAU,CAACJ,WAAWL,MAAMU,oBAAoB;AAKjE,EAAE"}
+{"version":3,"sources":["renderDataGridRow.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DataGridRowState, DataGridRowSlots } from './DataGridRow.types';\nimport { ColumnIdContextProvider } from '../../contexts/columnIdContext';\n\n/**\n * Render the final JSX of DataGridRow\n */\nexport const renderDataGridRow_unstable = (state: DataGridRowState) => {\n  assertSlots<DataGridRowSlots>(state);\n\n  return (\n    <state.root>\n      {state.selectionCell && <state.selectionCell />}\n      {state.columnDefs.map(columnDef => (\n        <ColumnIdContextProvider value={columnDef.columnId} key={columnDef.columnId}>\n          {state.renderCell(columnDef, state.dataGridContextValue)}\n        </ColumnIdContextProvider>\n      ))}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","ColumnIdContextProvider","renderDataGridRow_unstable","state","root","selectionCell","columnDefs","map","columnDef","value","columnId","renderCell","dataGridContextValue"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCH,YAA8BG;IAE9B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,aAAa,kBAAI,KAACF,MAAME,aAAa;YAC3CF,MAAMG,UAAU,CAACC,GAAG,CAACC,CAAAA,0BACpB,KAACP;oBAAwBQ,OAAOD,UAAUE,QAAQ;8BAC/CP,MAAMQ,UAAU,CAACH,WAAWL,MAAMS,oBAAoB;mBADAJ,UAAUE,QAAQ;;;AAMnF,EAAE"}