@fluentui/react-table 9.0.0-alpha.15 → 9.0.0-alpha.17

package/lib/components/DataGridBody/useDataGridBody.js

@@ -1,8 +1,6 @@
-import * as React from 'react';
 import { useTableBody_unstable } from '../TableBody/useTableBody';
 import { useDataGridContext_unstable } from '../../contexts/dataGridContext';
 import { useTableContext } from '../../contexts/tableContext';
-import { RowIdContextProvider } from '../../contexts/rowIdContext';
 /**
  * Create the state required to render DataGridBody.
  *
@@ -12,7 +10,6 @@ import { RowIdContextProvider } from '../../contexts/rowIdContext';
  * @param props - props from this instance of DataGridBody
  * @param ref - reference to root HTMLElement of DataGridBody
  */
-
 export const useDataGridBody_unstable = (props, ref) => {
   const {
     sortable
@@ -20,16 +17,15 @@ export const useDataGridBody_unstable = (props, ref) => {
   const getRows = useDataGridContext_unstable(ctx => ctx.getRows);
   const sort = useDataGridContext_unstable(ctx => ctx.sort.sort);
   const rows = sortable ? sort(getRows()) : getRows();
-  const {
-    children: renderRow
-  } = props;
-  const children = rows.map(row => /*#__PURE__*/React.createElement(RowIdContextProvider, {
-    key: row.rowId,
-    value: row.rowId
-  }, renderRow(row)));
-  return useTableBody_unstable({ ...props,
-    children,
+  const baseState = useTableBody_unstable({
+    ...props,
+    children: null,
     as: 'div'
   }, ref);
+  return {
+    ...baseState,
+    rows,
+    renderRow: props.children
+  };
 };
 //# sourceMappingURL=useDataGridBody.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridBody/useDataGridBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,qBAAT,QAAsC,2BAAtC;AACA,SAAS,2BAAT,QAA4C,gCAA5C;AACA,SAAS,eAAT,QAAgC,6BAAhC;AACA,SAAS,oBAAT,QAAqC,6BAArC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,wBAAwB,GAAG,CAAC,KAAD,EAA2B,GAA3B,KAA6E;EACnH,MAAM;IAAE;EAAF,IAAe,eAAe,EAApC;EACA,MAAM,OAAO,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,OAAZ,CAA3C;EACA,MAAM,IAAI,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,IAAJ,CAAS,IAAjB,CAAxC;EACA,MAAM,IAAI,GAAG,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAR,CAAP,GAAqB,OAAO,EAAjD;EAEA,MAAM;IAAE,QAAQ,EAAE;EAAZ,IAA0B,KAAhC;EACA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAL,CAAS,GAAG,iBAC3B,KAAA,CAAA,aAAA,CAAC,oBAAD,EAAqB;IAAC,GAAG,EAAE,GAAG,CAAC,KAAV;IAAiB,KAAK,EAAE,GAAG,CAAC;EAA5B,CAArB,EACG,SAAS,CAAC,GAAD,CADZ,CADe,CAAjB;EAKA,OAAO,qBAAqB,CAAC,EAAE,GAAG,KAAL;IAAY,QAAZ;IAAsB,EAAE,EAAE;EAA1B,CAAD,EAAoC,GAApC,CAA5B;AACD,CAbM","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';\nimport { RowIdContextProvider } from '../../contexts/rowIdContext';\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 { children: renderRow } = props;\n  const children = rows.map(row => (\n    <RowIdContextProvider key={row.rowId} value={row.rowId}>\n      {renderRow(row)}\n    </RowIdContextProvider>\n  ));\n  return useTableBody_unstable({ ...props, children, as: 'div' }, ref);\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAEA,SAASA,qBAAqB,QAAQ,2BAA2B;AACjE,SAASC,2BAA2B,QAAQ,gCAAgC;AAC5E,SAASC,eAAe,QAAQ,6BAA6B;AAE7D;;;;;;;;;AASA,OAAO,MAAMC,wBAAwB,GAAG,CAACC,KAAwB,EAAEC,GAA2B,KAAuB;EACnH,MAAM;IAAEC;EAAQ,CAAE,GAAGJ,eAAe,EAAE;EACtC,MAAMK,OAAO,GAAGN,2BAA2B,CAACO,GAAG,IAAIA,GAAG,CAACD,OAAO,CAAC;EAC/D,MAAME,IAAI,GAAGR,2BAA2B,CAACO,GAAG,IAAIA,GAAG,CAACC,IAAI,CAACA,IAAI,CAAC;EAC9D,MAAMC,IAAI,GAAGJ,QAAQ,GAAGG,IAAI,CAACF,OAAO,EAAE,CAAC,GAAGA,OAAO,EAAE;EAEnD,MAAMI,SAAS,GAAGX,qBAAqB,CAAC;IAAE,GAAGI,KAAK;IAAEQ,QAAQ,EAAE,IAAI;IAAEC,EAAE,EAAE;EAAK,CAAE,EAAER,GAAG,CAAC;EACrF,OAAO;IACL,GAAGM,SAAS;IACZD,IAAI;IACJI,SAAS,EAAEV,KAAK,CAACQ;GAClB;AACH,CAAC","names":["useTableBody_unstable","useDataGridContext_unstable","useTableContext","useDataGridBody_unstable","props","ref","sortable","getRows","ctx","sort","rows","baseState","children","as","renderRow"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridBody/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"]}

package/lib/components/DataGridBody/useDataGridBodyStyles.js

@@ -6,7 +6,6 @@ export const dataGridBodyClassNames = {
 /**
  * Apply styling to the DataGridBody slots based on the state
  */
-
 export const useDataGridBodyStyles_unstable = state => {
   useTableBodyStyles_unstable(state);
   state.root.className = mergeClasses(dataGridBodyClassNames.root, state.root.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridBody/useDataGridBodyStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,QAA6B,gBAA7B;AAGA,SAAS,2BAAT,QAA4C,iCAA5C;AAEA,OAAO,MAAM,sBAAsB,GAAsC;EACvE,IAAI,EAAE;AADiE,CAAlE;AAIP;;AAEG;;AACH,OAAO,MAAM,8BAA8B,GAAI,KAAD,IAAgD;EAC5F,2BAA2B,CAAC,KAAD,CAA3B;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,sBAAsB,CAAC,IAAxB,EAA8B,KAAK,CAAC,IAAN,CAAW,SAAzC,CAAnC;EAEA,OAAO,KAAP;AACD,CALM","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridBodySlots, DataGridBodyState } from './DataGridBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableBodyStyles_unstable } from '../TableBody/useTableBodyStyles';\n\nexport const dataGridBodyClassNames: SlotClassNames<DataGridBodySlots> = {\n  root: 'fui-DataGridBody',\n};\n\n/**\n * Apply styling to the DataGridBody slots based on the state\n */\nexport const useDataGridBodyStyles_unstable = (state: DataGridBodyState): DataGridBodyState => {\n  useTableBodyStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridBodyClassNames.root, state.root.className);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E,OAAO,MAAMC,sBAAsB,GAAsC;EACvEC,IAAI,EAAE;CACP;AAED;;;AAGA,OAAO,MAAMC,8BAA8B,GAAIC,KAAwB,IAAuB;EAC5FJ,2BAA2B,CAACI,KAAK,CAAC;EAClCA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGN,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAEtF,OAAOD,KAAK;AACd,CAAC","names":["mergeClasses","useTableBodyStyles_unstable","dataGridBodyClassNames","root","useDataGridBodyStyles_unstable","state","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridBody/useDataGridBodyStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridBodySlots, DataGridBodyState } from './DataGridBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableBodyStyles_unstable } from '../TableBody/useTableBodyStyles';\n\nexport const dataGridBodyClassNames: SlotClassNames<DataGridBodySlots> = {\n  root: 'fui-DataGridBody',\n};\n\n/**\n * Apply styling to the DataGridBody slots based on the state\n */\nexport const useDataGridBodyStyles_unstable = (state: DataGridBodyState): DataGridBodyState => {\n  useTableBodyStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridBodyClassNames.root, state.root.className);\n\n  return state;\n};\n"]}

package/lib/components/DataGridCell/DataGridCell.js

@@ -3,9 +3,8 @@ import { useDataGridCell_unstable } from './useDataGridCell';
 import { renderDataGridCell_unstable } from './renderDataGridCell';
 import { useDataGridCellStyles_unstable } from './useDataGridCellStyles';
 /**
- * DataGridCell component - TODO: add more docs
+ * DataGridCell component
  */
-
 export const DataGridCell = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDataGridCell_unstable(props, ref);
   useDataGridCellStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridCell/DataGridCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AACA,SAAS,2BAAT,QAA4C,sBAA5C;AACA,SAAS,8BAAT,QAA+C,yBAA/C;AAIA;;AAEG;;AACH,OAAO,MAAM,YAAY,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAClG,MAAM,KAAK,GAAG,wBAAwB,CAAC,KAAD,EAAQ,GAAR,CAAtC;EAEA,8BAA8B,CAAC,KAAD,CAA9B;EACA,OAAO,2BAA2B,CAAC,KAAD,CAAlC;AACD,CALmE,CAA7D;AAOP,YAAY,CAAC,WAAb,GAA2B,cAA3B","sourcesContent":["import * as React from 'react';\nimport { useDataGridCell_unstable } from './useDataGridCell';\nimport { renderDataGridCell_unstable } from './renderDataGridCell';\nimport { useDataGridCellStyles_unstable } from './useDataGridCellStyles';\nimport type { DataGridCellProps } from './DataGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridCell component - TODO: add more docs\n */\nexport const DataGridCell: ForwardRefComponent<DataGridCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridCell_unstable(props, ref);\n\n  useDataGridCellStyles_unstable(state);\n  return renderDataGridCell_unstable(state);\n});\n\nDataGridCell.displayName = 'DataGridCell';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,8BAA8B,QAAQ,yBAAyB;AAIxE;;;AAGA,OAAO,MAAMC,YAAY,gBAA2CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGP,wBAAwB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAElDJ,8BAA8B,CAACK,KAAK,CAAC;EACrC,OAAON,2BAA2B,CAACM,KAAK,CAAC;AAC3C,CAAC,CAAC;AAEFJ,YAAY,CAACK,WAAW,GAAG,cAAc","names":["React","useDataGridCell_unstable","renderDataGridCell_unstable","useDataGridCellStyles_unstable","DataGridCell","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridCell/DataGridCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridCell_unstable } from './useDataGridCell';\nimport { renderDataGridCell_unstable } from './renderDataGridCell';\nimport { useDataGridCellStyles_unstable } from './useDataGridCellStyles';\nimport type { DataGridCellProps } from './DataGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderDataGridCell_unstable(state);\n});\n\nDataGridCell.displayName = 'DataGridCell';\n"]}

package/lib/components/DataGridCell/renderDataGridCell.js

@@ -2,7 +2,6 @@ import { renderTableCell_unstable } from '../TableCell/renderTableCell';
 /**
  * Render the final JSX of DataGridCell
  */
-
 export const renderDataGridCell_unstable = state => {
   return renderTableCell_unstable(state);
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridCell/renderDataGridCell.tsx"],"names":[],"mappings":"AACA,SAAS,wBAAT,QAAyC,8BAAzC;AAEA;;AAEG;;AACH,OAAO,MAAM,2BAA2B,GAAI,KAAD,IAA6B;EACtE,OAAO,wBAAwB,CAAC,KAAD,CAA/B;AACD,CAFM","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"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SAASA,wBAAwB,QAAQ,8BAA8B;AAEvE;;;AAGA,OAAO,MAAMC,2BAA2B,GAAIC,KAAwB,IAAI;EACtE,OAAOF,wBAAwB,CAACE,KAAK,CAAC;AACxC,CAAC","names":["renderTableCell_unstable","renderDataGridCell_unstable","state"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridCell/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"]}

package/lib/components/DataGridCell/useDataGridCell.js

@@ -9,7 +9,6 @@ import { useDataGridContext_unstable } from '../../contexts/dataGridContext';
  * @param props - props from this instance of DataGridCell
  * @param ref - reference to root HTMLElement of DataGridCell
  */
-
 export const useDataGridCell_unstable = (props, ref) => {
   const tabbable = useDataGridContext_unstable(ctx => ctx.focusMode === 'cell');
   return useTableCell_unstable({

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridCell/useDataGridCell.ts"],"names":[],"mappings":"AAEA,SAAS,qBAAT,QAAsC,2BAAtC;AACA,SAAS,2BAAT,QAA4C,gCAA5C;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,wBAAwB,GAAG,CAAC,KAAD,EAA2B,GAA3B,KAA6E;EACnH,MAAM,QAAQ,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,SAAJ,KAAkB,MAA1B,CAA5C;EACA,OAAO,qBAAqB,CAAC;IAAE,EAAE,EAAE,KAAN;IAAa,IAAI,EAAE,UAAnB;IAA+B,QAAQ,EAAE,QAAQ,GAAG,CAAH,GAAO,SAAxD;IAAmE,GAAG;EAAtE,CAAD,EAAgF,GAAhF,CAA5B;AACD,CAHM","sourcesContent":["import * as React from 'react';\nimport type { DataGridCellProps, DataGridCellState } from './DataGridCell.types';\nimport { useTableCell_unstable } from '../TableCell/useTableCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\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 tabbable = useDataGridContext_unstable(ctx => ctx.focusMode === 'cell');\n  return useTableCell_unstable({ as: 'div', role: 'gridcell', tabIndex: tabbable ? 0 : undefined, ...props }, ref);\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAEA,SAASA,qBAAqB,QAAQ,2BAA2B;AACjE,SAASC,2BAA2B,QAAQ,gCAAgC;AAE5E;;;;;;;;;AASA,OAAO,MAAMC,wBAAwB,GAAG,CAACC,KAAwB,EAAEC,GAA2B,KAAuB;EACnH,MAAMC,QAAQ,GAAGJ,2BAA2B,CAACK,GAAG,IAAIA,GAAG,CAACC,SAAS,KAAK,MAAM,CAAC;EAC7E,OAAOP,qBAAqB,CAAC;IAAEQ,EAAE,EAAE,KAAK;IAAEC,IAAI,EAAE,UAAU;IAAEC,QAAQ,EAAEL,QAAQ,GAAG,CAAC,GAAGM,SAAS;IAAE,GAAGR;EAAK,CAAE,EAAEC,GAAG,CAAC;AAClH,CAAC","names":["useTableCell_unstable","useDataGridContext_unstable","useDataGridCell_unstable","props","ref","tabbable","ctx","focusMode","as","role","tabIndex","undefined"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridCell/useDataGridCell.ts"],"sourcesContent":["import * as React from 'react';\nimport type { DataGridCellProps, DataGridCellState } from './DataGridCell.types';\nimport { useTableCell_unstable } from '../TableCell/useTableCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\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 tabbable = useDataGridContext_unstable(ctx => ctx.focusMode === 'cell');\n  return useTableCell_unstable({ as: 'div', role: 'gridcell', tabIndex: tabbable ? 0 : undefined, ...props }, ref);\n};\n"]}

package/lib/components/DataGridCell/useDataGridCellStyles.js

@@ -6,7 +6,6 @@ export const dataGridCellClassNames = {
 /**
  * Apply styling to the DataGridCell slots based on the state
  */
-
 export const useDataGridCellStyles_unstable = state => {
   useTableCellStyles_unstable(state);
   state.root.className = mergeClasses(dataGridCellClassNames.root, state.root.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridCell/useDataGridCellStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,QAA6B,gBAA7B;AAGA,SAAS,2BAAT,QAA4C,iCAA5C;AAEA,OAAO,MAAM,sBAAsB,GAAsC;EACvE,IAAI,EAAE;AADiE,CAAlE;AAIP;;AAEG;;AACH,OAAO,MAAM,8BAA8B,GAAI,KAAD,IAAgD;EAC5F,2BAA2B,CAAC,KAAD,CAA3B;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,sBAAsB,CAAC,IAAxB,EAA8B,KAAK,CAAC,IAAN,CAAW,SAAzC,CAAnC;EAEA,OAAO,KAAP;AACD,CALM","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridCellSlots, DataGridCellState } from './DataGridCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableCellStyles_unstable } from '../TableCell/useTableCellStyles';\n\nexport const dataGridCellClassNames: SlotClassNames<DataGridCellSlots> = {\n  root: 'fui-DataGridCell',\n};\n\n/**\n * Apply styling to the DataGridCell slots based on the state\n */\nexport const useDataGridCellStyles_unstable = (state: DataGridCellState): DataGridCellState => {\n  useTableCellStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridCellClassNames.root, state.root.className);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E,OAAO,MAAMC,sBAAsB,GAAsC;EACvEC,IAAI,EAAE;CACP;AAED;;;AAGA,OAAO,MAAMC,8BAA8B,GAAIC,KAAwB,IAAuB;EAC5FJ,2BAA2B,CAACI,KAAK,CAAC;EAClCA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGN,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAEtF,OAAOD,KAAK;AACd,CAAC","names":["mergeClasses","useTableCellStyles_unstable","dataGridCellClassNames","root","useDataGridCellStyles_unstable","state","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridCell/useDataGridCellStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridCellSlots, DataGridCellState } from './DataGridCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableCellStyles_unstable } from '../TableCell/useTableCellStyles';\n\nexport const dataGridCellClassNames: SlotClassNames<DataGridCellSlots> = {\n  root: 'fui-DataGridCell',\n};\n\n/**\n * Apply styling to the DataGridCell slots based on the state\n */\nexport const useDataGridCellStyles_unstable = (state: DataGridCellState): DataGridCellState => {\n  useTableCellStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridCellClassNames.root, state.root.className);\n\n  return state;\n};\n"]}

package/lib/components/DataGridHeader/DataGridHeader.js

@@ -3,9 +3,8 @@ import { useDataGridHeader_unstable } from './useDataGridHeader';
 import { renderDataGridHeader_unstable } from './renderDataGridHeader';
 import { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles';
 /**
- * DataGridHeader component - TODO: add more docs
+ * DataGridHeader component
  */
-
 export const DataGridHeader = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDataGridHeader_unstable(props, ref);
   useDataGridHeaderStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeader/DataGridHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AACA,SAAS,gCAAT,QAAiD,2BAAjD;AAIA;;AAEG;;AACH,OAAO,MAAM,cAAc,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACtG,MAAM,KAAK,GAAG,0BAA0B,CAAC,KAAD,EAAQ,GAAR,CAAxC;EAEA,gCAAgC,CAAC,KAAD,CAAhC;EACA,OAAO,6BAA6B,CAAC,KAAD,CAApC;AACD,CALuE,CAAjE;AAOP,cAAc,CAAC,WAAf,GAA6B,gBAA7B","sourcesContent":["import * as React from 'react';\nimport { useDataGridHeader_unstable } from './useDataGridHeader';\nimport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nimport { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles';\nimport type { DataGridHeaderProps } from './DataGridHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridHeader component - TODO: add more docs\n */\nexport const DataGridHeader: ForwardRefComponent<DataGridHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeader_unstable(props, ref);\n\n  useDataGridHeaderStyles_unstable(state);\n  return renderDataGridHeader_unstable(state);\n});\n\nDataGridHeader.displayName = 'DataGridHeader';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,gCAAgC,QAAQ,2BAA2B;AAI5E;;;AAGA,OAAO,MAAMC,cAAc,gBAA6CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGP,0BAA0B,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEpDJ,gCAAgC,CAACK,KAAK,CAAC;EACvC,OAAON,6BAA6B,CAACM,KAAK,CAAC;AAC7C,CAAC,CAAC;AAEFJ,cAAc,CAACK,WAAW,GAAG,gBAAgB","names":["React","useDataGridHeader_unstable","renderDataGridHeader_unstable","useDataGridHeaderStyles_unstable","DataGridHeader","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeader/DataGridHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeader_unstable } from './useDataGridHeader';\nimport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nimport { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles';\nimport type { DataGridHeaderProps } from './DataGridHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderDataGridHeader_unstable(state);\n});\n\nDataGridHeader.displayName = 'DataGridHeader';\n"]}

package/lib/components/DataGridHeader/renderDataGridHeader.js

@@ -2,7 +2,6 @@ import { renderTableHeader_unstable } from '../TableHeader/renderTableHeader';
 /**
  * Render the final JSX of DataGridHeader
  */
-
 export const renderDataGridHeader_unstable = state => {
   return renderTableHeader_unstable(state);
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeader/renderDataGridHeader.tsx"],"names":[],"mappings":"AAAA,SAAS,0BAAT,QAA2C,kCAA3C;AAGA;;AAEG;;AACH,OAAO,MAAM,6BAA6B,GAAI,KAAD,IAA+B;EAC1E,OAAO,0BAA0B,CAAC,KAAD,CAAjC;AACD,CAFM","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"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,SAASA,0BAA0B,QAAQ,kCAAkC;AAG7E;;;AAGA,OAAO,MAAMC,6BAA6B,GAAIC,KAA0B,IAAI;EAC1E,OAAOF,0BAA0B,CAACE,KAAK,CAAC;AAC1C,CAAC","names":["renderTableHeader_unstable","renderDataGridHeader_unstable","state"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeader/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"]}

package/lib/components/DataGridHeader/useDataGridHeader.js

@@ -8,9 +8,9 @@ import { useTableHeader_unstable } from '../TableHeader/useTableHeader';
  * @param props - props from this instance of DataGridHeader
  * @param ref - reference to root HTMLElement of DataGridHeader
  */
-
 export const useDataGridHeader_unstable = (props, ref) => {
-  return useTableHeader_unstable({ ...props,
+  return useTableHeader_unstable({
+    ...props,
     as: 'div'
   }, ref);
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeader/useDataGridHeader.ts"],"names":[],"mappings":"AAEA,SAAS,uBAAT,QAAwC,+BAAxC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;EACvB,OAAO,uBAAuB,CAAC,EAAE,GAAG,KAAL;IAAY,EAAE,EAAE;EAAhB,CAAD,EAA0B,GAA1B,CAA9B;AACD,CALM","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"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAEA,SAASA,uBAAuB,QAAQ,+BAA+B;AAEvE;;;;;;;;;AASA,OAAO,MAAMC,0BAA0B,GAAG,CACxCC,KAA0B,EAC1BC,GAA2B,KACJ;EACvB,OAAOH,uBAAuB,CAAC;IAAE,GAAGE,KAAK;IAAEE,EAAE,EAAE;EAAK,CAAE,EAAED,GAAG,CAAC;AAC9D,CAAC","names":["useTableHeader_unstable","useDataGridHeader_unstable","props","ref","as"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeader/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"]}

package/lib/components/DataGridHeader/useDataGridHeaderStyles.js

@@ -6,7 +6,6 @@ export const dataGridHeaderClassNames = {
 /**
  * Apply styling to the DataGridHeader slots based on the state
  */
-
 export const useDataGridHeaderStyles_unstable = state => {
   useTableHeaderStyles_unstable(state);
   state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeader/useDataGridHeaderStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,QAA6B,gBAA7B;AAGA,SAAS,6BAAT,QAA8C,qCAA9C;AAEA,OAAO,MAAM,wBAAwB,GAAwC;EAC3E,IAAI,EAAE;AADqE,CAAtE;AAIP;;AAEG;;AACH,OAAO,MAAM,gCAAgC,GAAI,KAAD,IAAoD;EAClG,6BAA6B,CAAC,KAAD,CAA7B;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,wBAAwB,CAAC,IAA1B,EAAgC,KAAK,CAAC,IAAN,CAAW,SAA3C,CAAnC;EAEA,OAAO,KAAP;AACD,CALM","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles';\n\nexport const dataGridHeaderClassNames: SlotClassNames<DataGridHeaderSlots> = {\n  root: 'fui-DataGridHeader',\n};\n\n/**\n * Apply styling to the DataGridHeader slots based on the state\n */\nexport const useDataGridHeaderStyles_unstable = (state: DataGridHeaderState): DataGridHeaderState => {\n  useTableHeaderStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,SAASC,6BAA6B,QAAQ,qCAAqC;AAEnF,OAAO,MAAMC,wBAAwB,GAAwC;EAC3EC,IAAI,EAAE;CACP;AAED;;;AAGA,OAAO,MAAMC,gCAAgC,GAAIC,KAA0B,IAAyB;EAClGJ,6BAA6B,CAACI,KAAK,CAAC;EACpCA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGN,YAAY,CAACE,wBAAwB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EAExF,OAAOD,KAAK;AACd,CAAC","names":["mergeClasses","useTableHeaderStyles_unstable","dataGridHeaderClassNames","root","useDataGridHeaderStyles_unstable","state","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeader/useDataGridHeaderStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles';\n\nexport const dataGridHeaderClassNames: SlotClassNames<DataGridHeaderSlots> = {\n  root: 'fui-DataGridHeader',\n};\n\n/**\n * Apply styling to the DataGridHeader slots based on the state\n */\nexport const useDataGridHeaderStyles_unstable = (state: DataGridHeaderState): DataGridHeaderState => {\n  useTableHeaderStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n\n  return state;\n};\n"]}

package/lib/components/DataGridHeaderCell/DataGridHeaderCell.js

@@ -3,9 +3,8 @@ import { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';
 import { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';
 import { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles';
 /**
- * DataGridHeaderCell component - TODO: add more docs
+ * DataGridHeaderCell component
  */
-
 export const DataGridHeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDataGridHeaderCell_unstable(props, ref);
   useDataGridHeaderCellStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/DataGridHeaderCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,8BAAT,QAA+C,yBAA/C;AACA,SAAS,iCAAT,QAAkD,4BAAlD;AACA,SAAS,oCAAT,QAAqD,+BAArD;AAIA;;AAEG;;AACH,OAAO,MAAM,kBAAkB,gBAAiD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAC9G,MAAM,KAAK,GAAG,8BAA8B,CAAC,KAAD,EAAQ,GAAR,CAA5C;EAEA,oCAAoC,CAAC,KAAD,CAApC;EACA,OAAO,iCAAiC,CAAC,KAAD,CAAxC;AACD,CAL+E,CAAzE;AAOP,kBAAkB,CAAC,WAAnB,GAAiC,oBAAjC","sourcesContent":["import * as React from 'react';\nimport { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';\nimport { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';\nimport { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles';\nimport type { DataGridHeaderCellProps } from './DataGridHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridHeaderCell component - TODO: add more docs\n */\nexport const DataGridHeaderCell: ForwardRefComponent<DataGridHeaderCellProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridHeaderCell_unstable(props, ref);\n\n  useDataGridHeaderCellStyles_unstable(state);\n  return renderDataGridHeaderCell_unstable(state);\n});\n\nDataGridHeaderCell.displayName = 'DataGridHeaderCell';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,8BAA8B,QAAQ,yBAAyB;AACxE,SAASC,iCAAiC,QAAQ,4BAA4B;AAC9E,SAASC,oCAAoC,QAAQ,+BAA+B;AAIpF;;;AAGA,OAAO,MAAMC,kBAAkB,gBAAiDJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9G,MAAMC,KAAK,GAAGP,8BAA8B,CAACK,KAAK,EAAEC,GAAG,CAAC;EAExDJ,oCAAoC,CAACK,KAAK,CAAC;EAC3C,OAAON,iCAAiC,CAACM,KAAK,CAAC;AACjD,CAAC,CAAC;AAEFJ,kBAAkB,CAACK,WAAW,GAAG,oBAAoB","names":["React","useDataGridHeaderCell_unstable","renderDataGridHeaderCell_unstable","useDataGridHeaderCellStyles_unstable","DataGridHeaderCell","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/DataGridHeaderCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';\nimport { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';\nimport { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles';\nimport type { DataGridHeaderCellProps } from './DataGridHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderDataGridHeaderCell_unstable(state);\n});\n\nDataGridHeaderCell.displayName = 'DataGridHeaderCell';\n"]}

package/lib/components/DataGridHeaderCell/renderDataGridHeaderCell.js

@@ -2,7 +2,6 @@ import { renderTableHeaderCell_unstable } from '../TableHeaderCell/renderTableHe
 /**
  * Render the final JSX of DataGridHeaderCell
  */
-
 export const renderDataGridHeaderCell_unstable = state => {
   return renderTableHeaderCell_unstable(state);
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/renderDataGridHeaderCell.tsx"],"names":[],"mappings":"AACA,SAAS,8BAAT,QAA+C,0CAA/C;AAEA;;AAEG;;AACH,OAAO,MAAM,iCAAiC,GAAI,KAAD,IAAmC;EAClF,OAAO,8BAA8B,CAAC,KAAD,CAArC;AACD,CAFM","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"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SAASA,8BAA8B,QAAQ,0CAA0C;AAEzF;;;AAGA,OAAO,MAAMC,iCAAiC,GAAIC,KAA8B,IAAI;EAClF,OAAOF,8BAA8B,CAACE,KAAK,CAAC;AAC9C,CAAC","names":["renderTableHeaderCell_unstable","renderDataGridHeaderCell_unstable","state"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/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"]}

package/lib/components/DataGridHeaderCell/useDataGridHeaderCell.js

@@ -12,7 +12,6 @@ import { useTableContext } from '../../contexts/tableContext';
  * @param props - props from this instance of DataGridHeaderCell
  * @param ref - reference to root HTMLElement of DataGridHeaderCell
  */
-
 export const useDataGridHeaderCell_unstable = (props, ref) => {
   const columnId = useColumnIdContext();
   const {
@@ -22,11 +21,9 @@ export const useDataGridHeaderCell_unstable = (props, ref) => {
   const sortDirection = useDataGridContext_unstable(ctx => sortable ? ctx.sort.getSortDirection(columnId) : undefined);
   const onClick = useEventCallback(e => {
     var _a;
-
     if (sortable) {
       toggleColumnSort(e, columnId);
     }
-
     (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
   });
   return useTableHeaderCell_unstable({

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/useDataGridHeaderCell.ts"],"names":[],"mappings":"AACA,SAAS,gBAAT,QAAiC,2BAAjC;AAEA,SAAS,2BAAT,QAA4C,uCAA5C;AACA,SAAS,2BAAT,QAA4C,gCAA5C;AACA,SAAS,kBAAT,QAAmC,gCAAnC;AACA,SAAS,eAAT,QAAgC,6BAAhC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,8BAA8B,GAAG,CAC5C,KAD4C,EAE5C,GAF4C,KAGjB;EAC3B,MAAM,QAAQ,GAAG,kBAAkB,EAAnC;EACA,MAAM;IAAE;EAAF,IAAe,eAAe,EAApC;EACA,MAAM,gBAAgB,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,IAAJ,CAAS,gBAAjB,CAApD;EACA,MAAM,aAAa,GAAG,2BAA2B,CAAC,GAAG,IACnD,QAAQ,GAAG,GAAG,CAAC,IAAJ,CAAS,gBAAT,CAA0B,QAA1B,CAAH,GAAyC,SADF,CAAjD;EAGA,MAAM,OAAO,GAAG,gBAAgB,CAAE,CAAD,IAAoD;;;IACnF,IAAI,QAAJ,EAAc;MACZ,gBAAgB,CAAC,CAAD,EAAI,QAAJ,CAAhB;IACD;;IACD,CAAA,EAAA,GAAA,KAAK,CAAC,OAAN,MAAa,IAAb,IAAa,EAAA,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAa,EAAA,CAAA,IAAA,CAAb,KAAa,EAAG,CAAH,CAAb;EACD,CAL+B,CAAhC;EAOA,OAAO,2BAA2B,CAChC;IAAE,aAAF;IAAiB,EAAE,EAAE,KAArB;IAA4B,QAAQ,EAAE,QAAQ,GAAG,SAAH,GAAe,CAA7D;IAAgE,GAAG,KAAnE;IAA0E;EAA1E,CADgC,EAEhC,GAFgC,CAAlC;AAID,CArBM","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  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    { sortDirection, as: 'div', tabIndex: sortable ? undefined : 0, ...props, onClick },\n    ref,\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SAASA,gBAAgB,QAAQ,2BAA2B;AAE5D,SAASC,2BAA2B,QAAQ,uCAAuC;AACnF,SAASC,2BAA2B,QAAQ,gCAAgC;AAC5E,SAASC,kBAAkB,QAAQ,gCAAgC;AACnE,SAASC,eAAe,QAAQ,6BAA6B;AAE7D;;;;;;;;;AASA,OAAO,MAAMC,8BAA8B,GAAG,CAC5CC,KAA8B,EAC9BC,GAA2B,KACA;EAC3B,MAAMC,QAAQ,GAAGL,kBAAkB,EAAE;EACrC,MAAM;IAAEM;EAAQ,CAAE,GAAGL,eAAe,EAAE;EACtC,MAAMM,gBAAgB,GAAGR,2BAA2B,CAACS,GAAG,IAAIA,GAAG,CAACC,IAAI,CAACF,gBAAgB,CAAC;EACtF,MAAMG,aAAa,GAAGX,2BAA2B,CAACS,GAAG,IACnDF,QAAQ,GAAGE,GAAG,CAACC,IAAI,CAACE,gBAAgB,CAACN,QAAQ,CAAC,GAAGO,SAAS,CAC3D;EACD,MAAMC,OAAO,GAAGhB,gBAAgB,CAAEiB,CAA+C,IAAI;;IACnF,IAAIR,QAAQ,EAAE;MACZC,gBAAgB,CAACO,CAAC,EAAET,QAAQ,CAAC;;IAE/B,WAAK,CAACQ,OAAO,+CAAbV,KAAK,EAAWW,CAAC,CAAC;EACpB,CAAC,CAAC;EAEF,OAAOhB,2BAA2B,CAChC;IAAEY,aAAa;IAAEK,EAAE,EAAE,KAAK;IAAEC,QAAQ,EAAEV,QAAQ,GAAGM,SAAS,GAAG,CAAC;IAAE,GAAGT,KAAK;IAAEU;EAAO,CAAE,EACnFT,GAAG,CACJ;AACH,CAAC","names":["useEventCallback","useTableHeaderCell_unstable","useDataGridContext_unstable","useColumnIdContext","useTableContext","useDataGridHeaderCell_unstable","props","ref","columnId","sortable","toggleColumnSort","ctx","sort","sortDirection","getSortDirection","undefined","onClick","e","as","tabIndex"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/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  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    { sortDirection, as: 'div', tabIndex: sortable ? undefined : 0, ...props, onClick },\n    ref,\n  );\n};\n"]}

package/lib/components/DataGridHeaderCell/useDataGridHeaderCellStyles.js

@@ -8,19 +8,15 @@ export const dataGridHeaderCellClassNames = {
 /**
  * Apply styling to the DataGridHeaderCell slots based on the state
  */
-
 export const useDataGridHeaderCellStyles_unstable = state => {
   useTableHeaderCellStyles_unstable(state);
   state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);
-
   if (state.button) {
     state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);
   }
-
   if (state.sortIcon) {
     state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);
   }
-
   return state;
 };
 //# sourceMappingURL=useDataGridHeaderCellStyles.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/useDataGridHeaderCellStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,QAA6B,gBAA7B;AAGA,SAAS,iCAAT,QAAkD,6CAAlD;AAEA,OAAO,MAAM,4BAA4B,GAA4C;EACnF,IAAI,EAAE,wBAD6E;EAEnF,MAAM,EAAE,gCAF2E;EAGnF,QAAQ,EAAE;AAHyE,CAA9E;AAMP;;AAEG;;AACH,OAAO,MAAM,oCAAoC,GAAI,KAAD,IAA4D;EAC9G,iCAAiC,CAAC,KAAD,CAAjC;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,4BAA4B,CAAC,IAA9B,EAAoC,KAAK,CAAC,IAAN,CAAW,SAA/C,CAAnC;;EAEA,IAAI,KAAK,CAAC,MAAV,EAAkB;IAChB,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,YAAY,CAAC,4BAA4B,CAAC,MAA9B,EAAsC,KAAK,CAAC,MAAN,CAAa,SAAnD,CAArC;EACD;;EAED,IAAI,KAAK,CAAC,QAAV,EAAoB;IAClB,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,YAAY,CAAC,4BAA4B,CAAC,QAA9B,EAAwC,KAAK,CAAC,QAAN,CAAe,SAAvD,CAAvC;EACD;;EAED,OAAO,KAAP;AACD,CAbM","sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderCellSlots, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles';\n\nexport const dataGridHeaderCellClassNames: SlotClassNames<DataGridHeaderCellSlots> = {\n  root: 'fui-DataGridHeaderCell',\n  button: 'fui-DataGridHeaderCell__button',\n  sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n};\n\n/**\n * Apply styling to the DataGridHeaderCell slots based on the state\n */\nexport const useDataGridHeaderCellStyles_unstable = (state: DataGridHeaderCellState): DataGridHeaderCellState => {\n  useTableHeaderCellStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);\n\n  if (state.button) {\n    state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);\n  }\n\n  if (state.sortIcon) {\n    state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB;AAG7C,SAASC,iCAAiC,QAAQ,6CAA6C;AAE/F,OAAO,MAAMC,4BAA4B,GAA4C;EACnFC,IAAI,EAAE,wBAAwB;EAC9BC,MAAM,EAAE,gCAAgC;EACxCC,QAAQ,EAAE;CACX;AAED;;;AAGA,OAAO,MAAMC,oCAAoC,GAAIC,KAA8B,IAA6B;EAC9GN,iCAAiC,CAACM,KAAK,CAAC;EACxCA,KAAK,CAACJ,IAAI,CAACK,SAAS,GAAGR,YAAY,CAACE,4BAA4B,CAACC,IAAI,EAAEI,KAAK,CAACJ,IAAI,CAACK,SAAS,CAAC;EAE5F,IAAID,KAAK,CAACH,MAAM,EAAE;IAChBG,KAAK,CAACH,MAAM,CAACI,SAAS,GAAGR,YAAY,CAACE,4BAA4B,CAACE,MAAM,EAAEG,KAAK,CAACH,MAAM,CAACI,SAAS,CAAC;;EAGpG,IAAID,KAAK,CAACF,QAAQ,EAAE;IAClBE,KAAK,CAACF,QAAQ,CAACG,SAAS,GAAGR,YAAY,CAACE,4BAA4B,CAACG,QAAQ,EAAEE,KAAK,CAACF,QAAQ,CAACG,SAAS,CAAC;;EAG1G,OAAOD,KAAK;AACd,CAAC","names":["mergeClasses","useTableHeaderCellStyles_unstable","dataGridHeaderCellClassNames","root","button","sortIcon","useDataGridHeaderCellStyles_unstable","state","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridHeaderCell/useDataGridHeaderCellStyles.ts"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderCellSlots, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles';\n\nexport const dataGridHeaderCellClassNames: SlotClassNames<DataGridHeaderCellSlots> = {\n  root: 'fui-DataGridHeaderCell',\n  button: 'fui-DataGridHeaderCell__button',\n  sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n};\n\n/**\n * Apply styling to the DataGridHeaderCell slots based on the state\n */\nexport const useDataGridHeaderCellStyles_unstable = (state: DataGridHeaderCellState): DataGridHeaderCellState => {\n  useTableHeaderCellStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);\n\n  if (state.button) {\n    state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);\n  }\n\n  if (state.sortIcon) {\n    state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);\n  }\n\n  return state;\n};\n"]}

package/lib/components/DataGridRow/DataGridRow.js

@@ -3,9 +3,8 @@ import { useDataGridRow_unstable } from './useDataGridRow';
 import { renderDataGridRow_unstable } from './renderDataGridRow';
 import { useDataGridRowStyles_unstable } from './useDataGridRowStyles';
 /**
- * DataGridRow component - TODO: add more docs
+ * DataGridRow component
  */
-
 export const DataGridRow = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDataGridRow_unstable(props, ref);
   useDataGridRowStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridRow/DataGridRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AAIA;;AAEG;;AACH,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAChG,MAAM,KAAK,GAAG,uBAAuB,CAAC,KAAD,EAAQ,GAAR,CAArC;EAEA,6BAA6B,CAAC,KAAD,CAA7B;EACA,OAAO,0BAA0B,CAAC,KAAD,CAAjC;AACD,CALiE,CAA3D;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useDataGridRow_unstable } from './useDataGridRow';\nimport { renderDataGridRow_unstable } from './renderDataGridRow';\nimport { useDataGridRowStyles_unstable } from './useDataGridRowStyles';\nimport type { DataGridRowProps } from './DataGridRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridRow component - TODO: add more docs\n */\nexport const DataGridRow: ForwardRefComponent<DataGridRowProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridRow_unstable(props, ref);\n\n  useDataGridRowStyles_unstable(state);\n  return renderDataGridRow_unstable(state);\n});\n\nDataGridRow.displayName = 'DataGridRow';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;AAGA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,uBAAuB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEjDJ,6BAA6B,CAACK,KAAK,CAAC;EACpC,OAAON,0BAA0B,CAACM,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACK,WAAW,GAAG,aAAa","names":["React","useDataGridRow_unstable","renderDataGridRow_unstable","useDataGridRowStyles_unstable","DataGridRow","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridRow/DataGridRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDataGridRow_unstable } from './useDataGridRow';\nimport { renderDataGridRow_unstable } from './renderDataGridRow';\nimport { useDataGridRowStyles_unstable } from './useDataGridRowStyles';\nimport type { DataGridRowProps } from './DataGridRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DataGridRow component\n */\nexport const DataGridRow: ForwardRefComponent<DataGridRowProps> = React.forwardRef((props, ref) => {\n  const state = useDataGridRow_unstable(props, ref);\n\n  useDataGridRowStyles_unstable(state);\n  return renderDataGridRow_unstable(state);\n});\n\nDataGridRow.displayName = 'DataGridRow';\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridRow.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridRow/DataGridRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { Slot, ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { ColumnDefinition } from '../../hooks';\nimport type { TableRowProps, TableRowSlots, TableRowState } from '../TableRow/TableRow.types';\nimport type { TableSelectionCell } from '../TableSelectionCell/TableSelectionCell';\n\nexport type DataGridRowSlots = TableRowSlots & {\n  /**\n   * When selection is enabled on the @see DataGrid, all rows\n   * will render the selection cell.\n   */\n  selectionCell?: Slot<typeof TableSelectionCell>;\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 CellRenderFunction = (column: ColumnDefinition<any>) => React.ReactNode;\n\n/**\n * DataGridRow Props\n */\nexport type DataGridRowProps = Omit<TableRowProps, 'children'> &\n  Omit<ComponentProps<DataGridRowSlots>, 'children'> & {\n    children: CellRenderFunction;\n  };\n\n/**\n * State used in rendering DataGridRow\n */\nexport type DataGridRowState = TableRowState & ComponentState<DataGridRowSlots>;\n"]}
+{"version":3,"file":"DataGridRow.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridRow/DataGridRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { Slot, ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { ColumnDefinition } from '../../hooks';\nimport type { TableRowProps, TableRowSlots, TableRowState } from '../TableRow/TableRow.types';\nimport type { TableSelectionCell } from '../TableSelectionCell/TableSelectionCell';\n\nexport type DataGridRowSlots = TableRowSlots & {\n  /**\n   * When selection is enabled on the @see DataGrid, all rows\n   * will render the selection cell.\n   */\n  selectionCell?: Slot<typeof TableSelectionCell>;\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 CellRenderFunction = (column: ColumnDefinition<any>) => React.ReactNode;\n\n/**\n * DataGridRow Props\n */\nexport type DataGridRowProps = Omit<TableRowProps, 'children'> &\n  Omit<ComponentProps<DataGridRowSlots>, 'children'> & {\n    children: CellRenderFunction;\n  };\n\n/**\n * State used in rendering DataGridRow\n */\nexport type DataGridRowState = TableRowState &\n  ComponentState<DataGridRowSlots> & {\n    renderCell: CellRenderFunction;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    columnDefs: ColumnDefinition<any>[];\n  };\n"]}

package/lib/components/DataGridRow/renderDataGridRow.js

@@ -1,16 +1,21 @@
 import * as React from 'react';
 import { getSlots } from '@fluentui/react-utilities';
+import { ColumnIdContextProvider } from '../../contexts/columnIdContext';
 /**
  * Render the final JSX of DataGridRow
  */
-
 export const renderDataGridRow_unstable = state => {
   const {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
-  }, slots.selectionCell && /*#__PURE__*/React.createElement(slots.selectionCell, { ...slotProps.selectionCell
-  }), slotProps.root.children);
+  return /*#__PURE__*/React.createElement(slots.root, {
+    ...slotProps.root
+  }, slots.selectionCell && /*#__PURE__*/React.createElement(slots.selectionCell, {
+    ...slotProps.selectionCell
+  }), state.columnDefs.map(columnDef => /*#__PURE__*/React.createElement(ColumnIdContextProvider, {
+    value: columnDef.columnId,
+    key: columnDef.columnId
+  }, state.renderCell(columnDef))));
 };
 //# sourceMappingURL=renderDataGridRow.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridRow/renderDataGridRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,0BAA0B,GAAI,KAAD,IAA4B;EACpE,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAmB,KAAnB,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,aAAN,iBAAuB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,aAAP,EAAoB,EAAA,GAAK,SAAS,CAAC;EAAf,CAApB,CAD1B,EAEG,SAAS,CAAC,IAAV,CAAe,QAFlB,CADF;AAMD,CATM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DataGridRowState, DataGridRowSlots } from './DataGridRow.types';\n\n/**\n * Render the final JSX of DataGridRow\n */\nexport const renderDataGridRow_unstable = (state: DataGridRowState) => {\n  const { slots, slotProps } = getSlots<DataGridRowSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.selectionCell && <slots.selectionCell {...slotProps.selectionCell} />}\n      {slotProps.root.children}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,uBAAuB,QAAQ,gCAAgC;AAExE;;;AAGA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGL,QAAQ,CAAmBG,KAAK,CAAC;EAE9D,oBACEJ,oBAACK,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAC3BF,KAAK,CAACG,aAAa,iBAAIR,oBAACK,KAAK,CAACG,aAAa;IAAA,GAAKF,SAAS,CAACE;EAAa,EAAI,EAC3EJ,KAAK,CAACK,UAAU,CAACC,GAAG,CAACC,SAAS,iBAC7BX,oBAACE,uBAAuB;IAACU,KAAK,EAAED,SAAS,CAACE,QAAQ;IAAEC,GAAG,EAAEH,SAAS,CAACE;EAAQ,GACxET,KAAK,CAACW,UAAU,CAACJ,SAAS,CAAC,CAE/B,CAAC,CACS;AAEjB,CAAC","names":["React","getSlots","ColumnIdContextProvider","renderDataGridRow_unstable","state","slots","slotProps","root","selectionCell","columnDefs","map","columnDef","value","columnId","key","renderCell"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridRow/renderDataGridRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<DataGridRowSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.selectionCell && <slots.selectionCell {...slotProps.selectionCell} />}\n      {state.columnDefs.map(columnDef => (\n        <ColumnIdContextProvider value={columnDef.columnId} key={columnDef.columnId}>\n          {state.renderCell(columnDef)}\n        </ColumnIdContextProvider>\n      ))}\n    </slots.root>\n  );\n};\n"]}

package/lib/components/DataGridRow/useDataGridRow.js

@@ -1,9 +1,7 @@
-import * as React from 'react';
 import { isInteractiveHTMLElement, useEventCallback, resolveShorthand } from '@fluentui/react-utilities';
 import { Space } from '@fluentui/keyboard-keys';
 import { useTableRow_unstable } from '../TableRow/useTableRow';
 import { useDataGridContext_unstable } from '../../contexts/dataGridContext';
-import { ColumnIdContextProvider } from '../../contexts/columnIdContext';
 import { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';
 import { useRowIdContext } from '../../contexts/rowIdContext';
 import { useIsInTableHeader } from '../../contexts/tableHeaderContext';
@@ -16,7 +14,6 @@ import { useIsInTableHeader } from '../../contexts/tableHeaderContext';
  * @param props - props from this instance of DataGridRow
  * @param ref - reference to root HTMLElement of DataGridRow
  */
-
 export const useDataGridRow_unstable = (props, ref) => {
   const rowId = useRowIdContext();
   const isHeader = useIsInTableHeader();
@@ -28,35 +25,23 @@ export const useDataGridRow_unstable = (props, ref) => {
     if (!isHeader && selectable && ctx.selection.isRowSelected(rowId)) {
       return ctx.selectionAppearance;
     }
-
     return 'none';
   });
   const toggleRow = useDataGridContext_unstable(ctx => ctx.selection.toggleRow);
-  const cellRenderFunction = props.children;
-  const cells = columnDefs.map(columnDef => {
-    return /*#__PURE__*/React.createElement(ColumnIdContextProvider, {
-      value: columnDef.columnId,
-      key: columnDef.columnId
-    }, cellRenderFunction(columnDef));
-  });
   const onClick = useEventCallback(e => {
     var _a;
-
     if (selectable && !isHeader) {
       toggleRow(e, rowId);
     }
-
     (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
   });
   const onKeyDown = useEventCallback(e => {
     var _a;
-
     if (selectable && !isHeader && e.key === Space && !isInteractiveHTMLElement(e.target)) {
       // stop scrolling
       e.preventDefault();
       toggleRow(e, rowId);
     }
-
     (_a = props.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(props, e);
   });
   const baseState = useTableRow_unstable({
@@ -65,17 +50,21 @@ export const useDataGridRow_unstable = (props, ref) => {
     ...props,
     onClick,
     onKeyDown,
-    children: cells,
+    children: null,
     as: 'div',
     tabIndex: tabbable && !isHeader ? 0 : undefined
   }, ref);
-  return { ...baseState,
-    components: { ...baseState.components,
+  return {
+    ...baseState,
+    components: {
+      ...baseState.components,
       selectionCell: DataGridSelectionCell
     },
     selectionCell: resolveShorthand(props.selectionCell, {
       required: selectable
-    })
+    }),
+    renderCell: props.children,
+    columnDefs
   };
 };
 //# sourceMappingURL=useDataGridRow.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-table/src/components/DataGridRow/useDataGridRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,wBAAT,EAAmC,gBAAnC,EAAqD,gBAArD,QAA6E,2BAA7E;AACA,SAAS,KAAT,QAAsB,yBAAtB;AAEA,SAAS,oBAAT,QAAqC,yBAArC;AACA,SAAS,2BAAT,QAA4C,gCAA5C;AACA,SAAS,uBAAT,QAAwC,gCAAxC;AACA,SAAS,qBAAT,QAAsC,gDAAtC;AACA,SAAS,eAAT,QAAgC,6BAAhC;AACA,SAAS,kBAAT,QAAmC,mCAAnC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;EAChH,MAAM,KAAK,GAAG,eAAe,EAA7B;EACA,MAAM,QAAQ,GAAG,kBAAkB,EAAnC;EACA,MAAM,UAAU,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,OAAZ,CAA9C;EACA,MAAM,UAAU,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,cAAZ,CAA9C;EACA,MAAM,QAAQ,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,SAAJ,CAAc,aAAd,CAA4B,KAA5B,CAAR,CAA5C;EACA,MAAM,QAAQ,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,SAAJ,KAAkB,cAA1B,CAA5C;EACA,MAAM,UAAU,GAAG,2BAA2B,CAAC,GAAG,IAAG;IACnD,IAAI,CAAC,QAAD,IAAa,UAAb,IAA2B,GAAG,CAAC,SAAJ,CAAc,aAAd,CAA4B,KAA5B,CAA/B,EAAmE;MACjE,OAAO,GAAG,CAAC,mBAAX;IACD;;IAED,OAAO,MAAP;EACD,CAN6C,CAA9C;EAOA,MAAM,SAAS,GAAG,2BAA2B,CAAC,GAAG,IAAI,GAAG,CAAC,SAAJ,CAAc,SAAtB,CAA7C;EAEA,MAAM,kBAAkB,GAAG,KAAK,CAAC,QAAjC;EACA,MAAM,KAAK,GAAG,UAAU,CAAC,GAAX,CAAe,SAAS,IAAG;IACvC,oBACE,KAAA,CAAA,aAAA,CAAC,uBAAD,EAAwB;MAAC,KAAK,EAAE,SAAS,CAAC,QAAlB;MAA4B,GAAG,EAAE,SAAS,CAAC;IAA3C,CAAxB,EACG,kBAAkB,CAAC,SAAD,CADrB,CADF;EAKD,CANa,CAAd;EAQA,MAAM,OAAO,GAAG,gBAAgB,CAAE,CAAD,IAA6C;;;IAC5E,IAAI,UAAU,IAAI,CAAC,QAAnB,EAA6B;MAC3B,SAAS,CAAC,CAAD,EAAI,KAAJ,CAAT;IACD;;IAED,CAAA,EAAA,GAAA,KAAK,CAAC,OAAN,MAAa,IAAb,IAAa,EAAA,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAa,EAAA,CAAA,IAAA,CAAb,KAAa,EAAG,CAAH,CAAb;EACD,CAN+B,CAAhC;EAQA,MAAM,SAAS,GAAG,gBAAgB,CAAE,CAAD,IAAgD;;;IACjF,IAAI,UAAU,IAAI,CAAC,QAAf,IAA2B,CAAC,CAAC,GAAF,KAAU,KAArC,IAA8C,CAAC,wBAAwB,CAAC,CAAC,CAAC,MAAH,CAA3E,EAAsG;MACpG;MACA,CAAC,CAAC,cAAF;MACA,SAAS,CAAC,CAAD,EAAI,KAAJ,CAAT;IACD;;IAED,CAAA,EAAA,GAAA,KAAK,CAAC,SAAN,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAA,IAAA,CAAf,KAAe,EAAG,CAAH,CAAf;EACD,CARiC,CAAlC;EAUA,MAAM,SAAS,GAAG,oBAAoB,CACpC;IACE,UADF;IAEE,iBAAiB,UAAU,GAAG,QAAH,GAAc,SAF3C;IAGE,GAAG,KAHL;IAIE,OAJF;IAKE,SALF;IAME,QAAQ,EAAE,KANZ;IAOE,EAAE,EAAE,KAPN;IAQE,QAAQ,EAAE,QAAQ,IAAI,CAAC,QAAb,GAAwB,CAAxB,GAA4B;EARxC,CADoC,EAWpC,GAXoC,CAAtC;EAcA,OAAO,EACL,GAAG,SADE;IAEL,UAAU,EAAE,EACV,GAAG,SAAS,CAAC,UADH;MAEV,aAAa,EAAE;IAFL,CAFP;IAML,aAAa,EAAE,gBAAgB,CAAC,KAAK,CAAC,aAAP,EAAsB;MAAE,QAAQ,EAAE;IAAZ,CAAtB;EAN1B,CAAP;AAQD,CAjEM","sourcesContent":["import * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, resolveShorthand } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport type { DataGridRowProps, DataGridRowState } from './DataGridRow.types';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { ColumnIdContextProvider } from '../../contexts/columnIdContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n\n/**\n * Create the state required to render DataGridRow.\n *\n * The returned state can be modified with hooks such as useDataGridRowStyles_unstable,\n * before being passed to renderDataGridRow_unstable.\n *\n * @param props - props from this instance of DataGridRow\n * @param ref - reference to root HTMLElement of DataGridRow\n */\nexport const useDataGridRow_unstable = (props: DataGridRowProps, ref: React.Ref<HTMLElement>): DataGridRowState => {\n  const rowId = useRowIdContext();\n  const isHeader = useIsInTableHeader();\n  const columnDefs = useDataGridContext_unstable(ctx => ctx.columns);\n  const selectable = useDataGridContext_unstable(ctx => ctx.selectableRows);\n  const selected = useDataGridContext_unstable(ctx => ctx.selection.isRowSelected(rowId));\n  const tabbable = useDataGridContext_unstable(ctx => ctx.focusMode === 'row_unstable');\n  const appearance = useDataGridContext_unstable(ctx => {\n    if (!isHeader && selectable && ctx.selection.isRowSelected(rowId)) {\n      return ctx.selectionAppearance;\n    }\n\n    return 'none';\n  });\n  const toggleRow = useDataGridContext_unstable(ctx => ctx.selection.toggleRow);\n\n  const cellRenderFunction = props.children;\n  const cells = columnDefs.map(columnDef => {\n    return (\n      <ColumnIdContextProvider value={columnDef.columnId} key={columnDef.columnId}>\n        {cellRenderFunction(columnDef)}\n      </ColumnIdContextProvider>\n    );\n  });\n\n  const onClick = useEventCallback((e: React.MouseEvent<HTMLTableRowElement>) => {\n    if (selectable && !isHeader) {\n      toggleRow(e, rowId);\n    }\n\n    props.onClick?.(e);\n  });\n\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLTableRowElement>) => {\n    if (selectable && !isHeader && e.key === Space && !isInteractiveHTMLElement(e.target as HTMLElement)) {\n      // stop scrolling\n      e.preventDefault();\n      toggleRow(e, rowId);\n    }\n\n    props.onKeyDown?.(e);\n  });\n\n  const baseState = useTableRow_unstable(\n    {\n      appearance,\n      'aria-selected': selectable ? selected : undefined,\n      ...props,\n      onClick,\n      onKeyDown,\n      children: cells,\n      as: 'div',\n      tabIndex: tabbable && !isHeader ? 0 : undefined,\n    },\n    ref,\n  );\n\n  return {\n    ...baseState,\n    components: {\n      ...baseState.components,\n      selectionCell: DataGridSelectionCell,\n    },\n    selectionCell: resolveShorthand(props.selectionCell, { required: selectable }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SAASA,wBAAwB,EAAEC,gBAAgB,EAAEC,gBAAgB,QAAQ,2BAA2B;AACxG,SAASC,KAAK,QAAQ,yBAAyB;AAE/C,SAASC,oBAAoB,QAAQ,yBAAyB;AAC9D,SAASC,2BAA2B,QAAQ,gCAAgC;AAC5E,SAASC,qBAAqB,QAAQ,gDAAgD;AACtF,SAASC,eAAe,QAAQ,6BAA6B;AAC7D,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE;;;;;;;;;AASA,OAAO,MAAMC,uBAAuB,GAAG,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,MAAMC,KAAK,GAAGL,eAAe,EAAE;EAC/B,MAAMM,QAAQ,GAAGL,kBAAkB,EAAE;EACrC,MAAMM,UAAU,GAAGT,2BAA2B,CAACU,GAAG,IAAIA,GAAG,CAACC,OAAO,CAAC;EAClE,MAAMC,UAAU,GAAGZ,2BAA2B,CAACU,GAAG,IAAIA,GAAG,CAACG,cAAc,CAAC;EACzE,MAAMC,QAAQ,GAAGd,2BAA2B,CAACU,GAAG,IAAIA,GAAG,CAACK,SAAS,CAACC,aAAa,CAACT,KAAK,CAAC,CAAC;EACvF,MAAMU,QAAQ,GAAGjB,2BAA2B,CAACU,GAAG,IAAIA,GAAG,CAACQ,SAAS,KAAK,cAAc,CAAC;EACrF,MAAMC,UAAU,GAAGnB,2BAA2B,CAACU,GAAG,IAAG;IACnD,IAAI,CAACF,QAAQ,IAAII,UAAU,IAAIF,GAAG,CAACK,SAAS,CAACC,aAAa,CAACT,KAAK,CAAC,EAAE;MACjE,OAAOG,GAAG,CAACU,mBAAmB;;IAGhC,OAAO,MAAM;EACf,CAAC,CAAC;EACF,MAAMC,SAAS,GAAGrB,2BAA2B,CAACU,GAAG,IAAIA,GAAG,CAACK,SAAS,CAACM,SAAS,CAAC;EAE7E,MAAMC,OAAO,GAAG1B,gBAAgB,CAAE2B,CAAwC,IAAI;;IAC5E,IAAIX,UAAU,IAAI,CAACJ,QAAQ,EAAE;MAC3Ba,SAAS,CAACE,CAAC,EAAEhB,KAAK,CAAC;;IAGrB,WAAK,CAACe,OAAO,+CAAbjB,KAAK,EAAWkB,CAAC,CAAC;EACpB,CAAC,CAAC;EAEF,MAAMC,SAAS,GAAG5B,gBAAgB,CAAE2B,CAA2C,IAAI;;IACjF,IAAIX,UAAU,IAAI,CAACJ,QAAQ,IAAIe,CAAC,CAACE,GAAG,KAAK3B,KAAK,IAAI,CAACH,wBAAwB,CAAC4B,CAAC,CAACG,MAAqB,CAAC,EAAE;MACpG;MACAH,CAAC,CAACI,cAAc,EAAE;MAClBN,SAAS,CAACE,CAAC,EAAEhB,KAAK,CAAC;;IAGrB,WAAK,CAACiB,SAAS,+CAAfnB,KAAK,EAAakB,CAAC,CAAC;EACtB,CAAC,CAAC;EAEF,MAAMK,SAAS,GAAG7B,oBAAoB,CACpC;IACEoB,UAAU;IACV,eAAe,EAAEP,UAAU,GAAGE,QAAQ,GAAGe,SAAS;IAClD,GAAGxB,KAAK;IACRiB,OAAO;IACPE,SAAS;IACTM,QAAQ,EAAE,IAAI;IACdC,EAAE,EAAE,KAAK;IACTC,QAAQ,EAAEf,QAAQ,IAAI,CAACT,QAAQ,GAAG,CAAC,GAAGqB;GACvC,EACDvB,GAAG,CACJ;EAED,OAAO;IACL,GAAGsB,SAAS;IACZK,UAAU,EAAE;MACV,GAAGL,SAAS,CAACK,UAAU;MACvBC,aAAa,EAAEjC;KAChB;IACDiC,aAAa,EAAErC,gBAAgB,CAACQ,KAAK,CAAC6B,aAAa,EAAE;MAAEC,QAAQ,EAAEvB;IAAU,CAAE,CAAC;IAC9EwB,UAAU,EAAE/B,KAAK,CAACyB,QAAQ;IAC1BrB;GACD;AACH,CAAC","names":["isInteractiveHTMLElement","useEventCallback","resolveShorthand","Space","useTableRow_unstable","useDataGridContext_unstable","DataGridSelectionCell","useRowIdContext","useIsInTableHeader","useDataGridRow_unstable","props","ref","rowId","isHeader","columnDefs","ctx","columns","selectable","selectableRows","selected","selection","isRowSelected","tabbable","focusMode","appearance","selectionAppearance","toggleRow","onClick","e","onKeyDown","key","target","preventDefault","baseState","undefined","children","as","tabIndex","components","selectionCell","required","renderCell"],"sourceRoot":"../src/","sources":["packages/react-components/react-table/src/components/DataGridRow/useDataGridRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, resolveShorthand } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport type { DataGridRowProps, DataGridRowState } from './DataGridRow.types';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n\n/**\n * Create the state required to render DataGridRow.\n *\n * The returned state can be modified with hooks such as useDataGridRowStyles_unstable,\n * before being passed to renderDataGridRow_unstable.\n *\n * @param props - props from this instance of DataGridRow\n * @param ref - reference to root HTMLElement of DataGridRow\n */\nexport const useDataGridRow_unstable = (props: DataGridRowProps, ref: React.Ref<HTMLElement>): DataGridRowState => {\n  const rowId = useRowIdContext();\n  const isHeader = useIsInTableHeader();\n  const columnDefs = useDataGridContext_unstable(ctx => ctx.columns);\n  const selectable = useDataGridContext_unstable(ctx => ctx.selectableRows);\n  const selected = useDataGridContext_unstable(ctx => ctx.selection.isRowSelected(rowId));\n  const tabbable = useDataGridContext_unstable(ctx => ctx.focusMode === 'row_unstable');\n  const appearance = useDataGridContext_unstable(ctx => {\n    if (!isHeader && selectable && ctx.selection.isRowSelected(rowId)) {\n      return ctx.selectionAppearance;\n    }\n\n    return 'none';\n  });\n  const toggleRow = useDataGridContext_unstable(ctx => ctx.selection.toggleRow);\n\n  const onClick = useEventCallback((e: React.MouseEvent<HTMLTableRowElement>) => {\n    if (selectable && !isHeader) {\n      toggleRow(e, rowId);\n    }\n\n    props.onClick?.(e);\n  });\n\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLTableRowElement>) => {\n    if (selectable && !isHeader && e.key === Space && !isInteractiveHTMLElement(e.target as HTMLElement)) {\n      // stop scrolling\n      e.preventDefault();\n      toggleRow(e, rowId);\n    }\n\n    props.onKeyDown?.(e);\n  });\n\n  const baseState = useTableRow_unstable(\n    {\n      appearance,\n      'aria-selected': selectable ? selected : undefined,\n      ...props,\n      onClick,\n      onKeyDown,\n      children: null,\n      as: 'div',\n      tabIndex: tabbable && !isHeader ? 0 : undefined,\n    },\n    ref,\n  );\n\n  return {\n    ...baseState,\n    components: {\n      ...baseState.components,\n      selectionCell: DataGridSelectionCell,\n    },\n    selectionCell: resolveShorthand(props.selectionCell, { required: selectable }),\n    renderCell: props.children,\n    columnDefs,\n  };\n};\n"]}