@fluentui/react-table 9.19.15 → 9.19.17

package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js

@@ -23,8 +23,8 @@ const dataGridHeaderClassNames = {
     root: 'fui-DataGridHeader'
 };
 const useDataGridHeaderStyles_unstable = (state)=>{
-    'use no memo';
     (0, _useTableHeaderStylesstyles.useTableHeaderStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridHeaderClassNames.root, state.root.className);
     return state;
 };

package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DataGridHeader/useDataGridHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles.styles';\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  'use no memo';\n\n  useTableHeaderStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n\n  return state;\n};\n"],"names":["mergeClasses","useTableHeaderStyles_unstable","dataGridHeaderClassNames","root","useDataGridHeaderStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;4BAOaE;;;oCAOAE;;;;uBAZgB,iBAAiB;4CAGA,6CAA6C;AAEpF,MAAMF,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAKK,MAAMC,mCAAmC,CAACC;IAC/C;QAEAJ,yDAAAA,EAA8BI;IAC9BA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,yBAAyBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAEvF,OAAOD;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DataGridHeader/useDataGridHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles.styles';\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  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n\n  return state;\n};\n"],"names":["mergeClasses","useTableHeaderStyles_unstable","dataGridHeaderClassNames","root","useDataGridHeaderStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;4BAOaE;;;oCAOAE;;;;uBAZgB,iBAAiB;4CAGA,6CAA6C;AAEpF,MAAMF,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAKK,MAAMC,mCAAmC,CAACC;IAC/CJ,6DAAAA,EAA8BI;IAC9B,oDAAoD;IACpDA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,yBAAyBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAEvF,OAAOD;AACT,EAAE"}

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js

@@ -26,16 +26,19 @@ const dataGridHeaderCellClassNames = {
     aside: 'fui-DataGridHeaderCell__aside'
 };
 const useDataGridHeaderCellStyles_unstable = (state)=>{
-    'use no memo';
     (0, _useTableHeaderCellStylesstyles.useTableHeaderCellStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.root, state.root.className);
     if (state.button) {
+        // eslint-disable-next-line react-hooks/immutability
         state.button.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.button, state.button.className);
     }
     if (state.sortIcon) {
+        // eslint-disable-next-line react-hooks/immutability
         state.sortIcon.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);
     }
     if (state.aside) {
+        // eslint-disable-next-line react-hooks/immutability
         state.aside.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.aside, state.aside.className);
     }
     return state;

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridHeaderCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles.styles';\nexport const dataGridHeaderCellClassNames = {\n    root: 'fui-DataGridHeaderCell',\n    button: 'fui-DataGridHeaderCell__button',\n    sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n    aside: 'fui-DataGridHeaderCell__aside'\n};\n/**\n * Apply styling to the DataGridHeaderCell slots based on the state\n */ export const useDataGridHeaderCellStyles_unstable = (state)=>{\n    'use no memo';\n    useTableHeaderCellStyles_unstable(state);\n    state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);\n    if (state.button) {\n        state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);\n    }\n    if (state.sortIcon) {\n        state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);\n    }\n    if (state.aside) {\n        state.aside.className = mergeClasses(dataGridHeaderCellClassNames.aside, state.aside.className);\n    }\n    return state;\n};\n"],"names":["mergeClasses","useTableHeaderCellStyles_unstable","dataGridHeaderCellClassNames","root","button","sortIcon","aside","useDataGridHeaderCellStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCE,4BAA4B;;;wCAQY;;;;uBAVxB,gBAAgB;gDACK,oDAAoD;AAC/F,qCAAqC;IACxCC,IAAI,EAAE,wBAAwB;IAC9BC,MAAM,EAAE,gCAAgC;IACxCC,QAAQ,EAAE,kCAAkC;IAC5CC,KAAK,EAAE;AACX,CAAC;AAGU,MAAMC,wCAAwCC,KAAK,IAAG;IAC7D,aAAa;QACbP,iEAAiC,EAACO,KAAK,CAAC;IACxCA,KAAK,CAACL,IAAI,CAACM,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACC,IAAI,EAAEK,KAAK,CAACL,IAAI,CAACM,SAAS,CAAC;IAC5F,IAAID,KAAK,CAACJ,MAAM,EAAE;QACdI,KAAK,CAACJ,MAAM,CAACK,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACE,MAAM,EAAEI,KAAK,CAACJ,MAAM,CAACK,SAAS,CAAC;IACtG;IACA,IAAID,KAAK,CAACH,QAAQ,EAAE;QAChBG,KAAK,CAACH,QAAQ,CAACI,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACG,QAAQ,EAAEG,KAAK,CAACH,QAAQ,CAACI,SAAS,CAAC;IAC5G;IACA,IAAID,KAAK,CAACF,KAAK,EAAE;QACbE,KAAK,CAACF,KAAK,CAACG,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACI,KAAK,EAAEE,KAAK,CAACF,KAAK,CAACG,SAAS,CAAC;IACnG;IACA,OAAOD,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useDataGridHeaderCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles.styles';\nexport const dataGridHeaderCellClassNames = {\n    root: 'fui-DataGridHeaderCell',\n    button: 'fui-DataGridHeaderCell__button',\n    sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n    aside: 'fui-DataGridHeaderCell__aside'\n};\n/**\n * Apply styling to the DataGridHeaderCell slots based on the state\n */ export const useDataGridHeaderCellStyles_unstable = (state)=>{\n    useTableHeaderCellStyles_unstable(state);\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);\n    if (state.button) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);\n    }\n    if (state.sortIcon) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);\n    }\n    if (state.aside) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.aside.className = mergeClasses(dataGridHeaderCellClassNames.aside, state.aside.className);\n    }\n    return state;\n};\n"],"names":["mergeClasses","useTableHeaderCellStyles_unstable","dataGridHeaderCellClassNames","root","button","sortIcon","aside","useDataGridHeaderCellStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCE,4BAA4B;;;IAQxBK,oCAAoC;;;;uBAVxB,gBAAgB;gDACK,oDAAoD;AAC/F,qCAAqC;IACxCJ,IAAI,EAAE,wBAAwB;IAC9BC,MAAM,EAAE,gCAAgC;IACxCC,QAAQ,EAAE,kCAAkC;IAC5CC,KAAK,EAAE;AACX,CAAC;AAGU,8CAA8CE,KAAK,IAAG;QAC7DP,iEAAiC,EAACO,KAAK,CAAC;IACxC,oDAAA;IACAA,KAAK,CAACL,IAAI,CAACM,SAAS,GAAGT,uBAAY,EAACE,4BAA4B,CAACC,IAAI,EAAEK,KAAK,CAACL,IAAI,CAACM,SAAS,CAAC;IAC5F,IAAID,KAAK,CAACJ,MAAM,EAAE;QACd,oDAAA;QACAI,KAAK,CAACJ,MAAM,CAACK,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACE,MAAM,EAAEI,KAAK,CAACJ,MAAM,CAACK,SAAS,CAAC;IACtG;IACA,IAAID,KAAK,CAACH,QAAQ,EAAE;QAChB,oDAAA;QACAG,KAAK,CAACH,QAAQ,CAACI,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACG,QAAQ,EAAEG,KAAK,CAACH,QAAQ,CAACI,SAAS,CAAC;IAC5G;IACA,IAAID,KAAK,CAACF,KAAK,EAAE;QACb,oDAAA;QACAE,KAAK,CAACF,KAAK,CAACG,SAAS,OAAGT,mBAAY,EAACE,4BAA4B,CAACI,KAAK,EAAEE,KAAK,CAACF,KAAK,CAACG,SAAS,CAAC;IACnG;IACA,OAAOD,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js

@@ -26,16 +26,19 @@ const dataGridHeaderCellClassNames = {
     aside: 'fui-DataGridHeaderCell__aside'
 };
 const useDataGridHeaderCellStyles_unstable = (state)=>{
-    'use no memo';
     (0, _useTableHeaderCellStylesstyles.useTableHeaderCellStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.root, state.root.className);
     if (state.button) {
+        // eslint-disable-next-line react-hooks/immutability
         state.button.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.button, state.button.className);
     }
     if (state.sortIcon) {
+        // eslint-disable-next-line react-hooks/immutability
         state.sortIcon.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);
     }
     if (state.aside) {
+        // eslint-disable-next-line react-hooks/immutability
         state.aside.className = (0, _react.mergeClasses)(dataGridHeaderCellClassNames.aside, state.aside.className);
     }
     return state;

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderCellSlots, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles.styles';\n\nexport const dataGridHeaderCellClassNames: SlotClassNames<DataGridHeaderCellSlots> = {\n  root: 'fui-DataGridHeaderCell',\n  button: 'fui-DataGridHeaderCell__button',\n  sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n  aside: 'fui-DataGridHeaderCell__aside',\n};\n\n/**\n * Apply styling to the DataGridHeaderCell slots based on the state\n */\nexport const useDataGridHeaderCellStyles_unstable = (state: DataGridHeaderCellState): DataGridHeaderCellState => {\n  'use no memo';\n\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  if (state.aside) {\n    state.aside.className = mergeClasses(dataGridHeaderCellClassNames.aside, state.aside.className);\n  }\n\n  return state;\n};\n"],"names":["mergeClasses","useTableHeaderCellStyles_unstable","dataGridHeaderCellClassNames","root","button","sortIcon","aside","useDataGridHeaderCellStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaE,4BAAAA;;;wCAUAK;;;;uBAfgB,iBAAiB;gDAGI,qDAAqD;AAEhG,qCAA8E;IACnFJ,MAAM;IACNC,QAAQ;IACRC,UAAU;IACVC,OAAO;AACT,EAAE;AAKK,MAAMC,uCAAuC,CAACC;IACnD;QAEAP,iEAAAA,EAAkCO;IAClCA,MAAML,IAAI,CAACM,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BC,IAAI,EAAEK,MAAML,IAAI,CAACM,SAAS;IAE3F,IAAID,MAAMJ,MAAM,EAAE;QAChBI,MAAMJ,MAAM,CAACK,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BE,MAAM,EAAEI,MAAMJ,MAAM,CAACK,SAAS;IACnG;IAEA,IAAID,MAAMH,QAAQ,EAAE;QAClBG,MAAMH,QAAQ,CAACI,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BG,QAAQ,EAAEG,MAAMH,QAAQ,CAACI,SAAS;IACzG;IAEA,IAAID,MAAMF,KAAK,EAAE;QACfE,MAAMF,KAAK,CAACG,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BI,KAAK,EAAEE,MAAMF,KAAK,CAACG,SAAS;IAChG;IAEA,OAAOD;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderCellSlots, DataGridHeaderCellState } from './DataGridHeaderCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderCellStyles_unstable } from '../TableHeaderCell/useTableHeaderCellStyles.styles';\n\nexport const dataGridHeaderCellClassNames: SlotClassNames<DataGridHeaderCellSlots> = {\n  root: 'fui-DataGridHeaderCell',\n  button: 'fui-DataGridHeaderCell__button',\n  sortIcon: 'fui-DataGridHeaderCell__sortIcon',\n  aside: 'fui-DataGridHeaderCell__aside',\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  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(dataGridHeaderCellClassNames.root, state.root.className);\n\n  if (state.button) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.button.className = mergeClasses(dataGridHeaderCellClassNames.button, state.button.className);\n  }\n\n  if (state.sortIcon) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.sortIcon.className = mergeClasses(dataGridHeaderCellClassNames.sortIcon, state.sortIcon.className);\n  }\n\n  if (state.aside) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.aside.className = mergeClasses(dataGridHeaderCellClassNames.aside, state.aside.className);\n  }\n\n  return state;\n};\n"],"names":["mergeClasses","useTableHeaderCellStyles_unstable","dataGridHeaderCellClassNames","root","button","sortIcon","aside","useDataGridHeaderCellStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaE,4BAAAA;;;IAUAK,oCAAAA;;;;uBAfgB,iBAAiB;gDAGI,qDAAqD;AAEhG,qCAA8E;IACnFJ,MAAM;IACNC,QAAQ;IACRC,UAAU;IACVC,OAAO;AACT,EAAE;AAKK,6CAA6C,CAACE;QACnDP,iEAAAA,EAAkCO;IAClC,oDAAoD;IACpDA,MAAML,IAAI,CAACM,SAAS,GAAGT,uBAAAA,EAAaE,6BAA6BC,IAAI,EAAEK,MAAML,IAAI,CAACM,SAAS;IAE3F,IAAID,MAAMJ,MAAM,EAAE;QAChB,oDAAoD;QACpDI,MAAMJ,MAAM,CAACK,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BE,MAAM,EAAEI,MAAMJ,MAAM,CAACK,SAAS;IACnG;IAEA,IAAID,MAAMH,QAAQ,EAAE;QAClB,oDAAoD;QACpDG,MAAMH,QAAQ,CAACI,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BG,QAAQ,EAAEG,MAAMH,QAAQ,CAACI,SAAS;IACzG;IAEA,IAAID,MAAMF,KAAK,EAAE;QACf,oDAAoD;QACpDE,MAAMF,KAAK,CAACG,SAAS,OAAGT,mBAAAA,EAAaE,6BAA6BI,KAAK,EAAEE,MAAMF,KAAK,CAACG,SAAS;IAChG;IAEA,OAAOD;AACT,EAAE"}

package/lib-commonjs/components/DataGridRow/useDataGridRow.js

@@ -92,5 +92,6 @@ function useStableDataGridContextValue() {
         ref.current = ctx;
         return null;
     });
+    // eslint-disable-next-line react-hooks/refs
     return ref.current;
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DataGridRow/useDataGridRow.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport type { DataGridRowProps, DataGridRowState } from './DataGridRow.types';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { dataGridContextDefaultValue, useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useTableRowIdContext } 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 = useTableRowIdContext();\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 focusMode = useDataGridContext_unstable(ctx => ctx.focusMode);\n  const compositeRowTabsterAttribute = useDataGridContext_unstable(ctx => ctx.compositeRowTabsterAttribute);\n\n  const tabbable = focusMode === 'row_unstable' || focusMode === 'composite';\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      tabIndex: tabbable && !isHeader ? 0 : undefined,\n      ...(focusMode === 'composite' && !isHeader && compositeRowTabsterAttribute),\n      ...props,\n      onClick,\n      onKeyDown,\n      children: null,\n      as: 'div',\n    },\n    ref,\n  );\n\n  return {\n    ...baseState,\n    components: {\n      // eslint-disable-next-line @typescript-eslint/no-deprecated\n      ...baseState.components,\n      selectionCell: DataGridSelectionCell,\n    },\n    selectionCell: slot.optional(props.selectionCell, {\n      renderByDefault: selectable,\n      elementType: DataGridSelectionCell,\n    }),\n    renderCell: props.children,\n    columnDefs,\n    // This context value should not be used internally\n    // It's intended to help power user render functions\n    dataGridContextValue: useStableDataGridContextValue(),\n  };\n};\n\nfunction useStableDataGridContextValue() {\n  const ref = React.useRef(dataGridContextDefaultValue);\n\n  // Heads up!\n  // We will not re-render when the context value changes, but we will have the latest value of the context when we do\n  // render for other reasons.\n  //\n  // This relies on a context selector that always returns the same value:\n  // - we will not re-render when the context value changes\n  // - we will store the context value in a ref\n  useDataGridContext_unstable(ctx => {\n    ref.current = ctx;\n    return null;\n  });\n\n  return ref.current!;\n}\n"],"names":["React","isInteractiveHTMLElement","useEventCallback","slot","Space","useTableRow_unstable","dataGridContextDefaultValue","useDataGridContext_unstable","DataGridSelectionCell","useTableRowIdContext","useIsInTableHeader","useDataGridRow_unstable","props","ref","rowId","isHeader","columnDefs","ctx","columns","selectable","selectableRows","selected","selection","isRowSelected","focusMode","compositeRowTabsterAttribute","tabbable","appearance","selectionAppearance","toggleRow","onClick","e","onKeyDown","key","target","preventDefault","baseState","undefined","tabIndex","children","as","components","selectionCell","optional","renderByDefault","elementType","renderCell","dataGridContextValue","useStableDataGridContextValue","useRef","current"],"mappings":"AAAA;;;;;+BAqBaW;;;;;;;iEAnBU,QAAQ;gCACkC,4BAA4B;8BACvE,0BAA0B;6BAEX,0BAA0B;iCACU,iCAAiC;uCACpE,iDAAiD;8BAClD,8BAA8B;oCAChC,oCAAoC;AAWhE,gCAAgC,CAACC,OAAyBC;IAC/D,MAAMC,YAAQL,kCAAAA;IACd,MAAMM,eAAWL,sCAAAA;IACjB,MAAMM,iBAAaT,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIC,OAAO;IACjE,MAAMC,iBAAaZ,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIG,cAAc;IACxE,MAAMC,eAAWd,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIK,SAAS,CAACC,aAAa,CAACT;IAChF,MAAMU,gBAAYjB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIO,SAAS;IAClE,MAAMC,mCAA+BlB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIQ,4BAA4B;IAExG,MAAMC,WAAWF,cAAc,kBAAkBA,cAAc;IAC/D,MAAMG,iBAAapB,4CAAAA,EAA4BU,CAAAA;QAC7C,IAAI,CAACF,YAAYI,cAAcF,IAAIK,SAAS,CAACC,aAAa,CAACT,QAAQ;YACjE,OAAOG,IAAIW,mBAAmB;QAChC;QAEA,OAAO;IACT;IACA,MAAMC,gBAAYtB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIK,SAAS,CAACO,SAAS;IAE5E,MAAMC,cAAU5B,gCAAAA,EAAiB,CAAC6B;YAKhCnB;QAJA,IAAIO,cAAc,CAACJ,UAAU;YAC3Bc,UAAUE,GAAGjB;QACf;SAEAF,iBAAAA,MAAMkB,OAAAA,AAAO,MAAA,QAAblB,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAAA,IAAAA,CAAAA,OAAgBmB;IAClB;IAEA,MAAMC,gBAAY9B,gCAAAA,EAAiB,CAAC6B;YAOlCnB;QANA,IAAIO,cAAc,CAACJ,YAAYgB,EAAEE,GAAG,KAAK7B,mBAAAA,IAAS,KAACH,wCAAAA,EAAyB8B,EAAEG,MAAM,GAAkB;YACpG,iBAAiB;YACjBH,EAAEI,cAAc;YAChBN,UAAUE,GAAGjB;QACf;SAEAF,mBAAAA,MAAMoB,SAAAA,AAAS,MAAA,QAAfpB,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAAA,IAAAA,CAAAA,OAAkBmB;IACpB;IAEA,MAAMK,gBAAY/B,iCAAAA,EAChB;QACEsB;QACA,iBAAiBR,aAAaE,WAAWgB;QACzCC,UAAUZ,YAAY,CAACX,WAAW,IAAIsB;QACtC,GAAIb,cAAc,eAAe,CAACT,YAAYU,4BAA4B;QAC1E,GAAGb,KAAK;QACRkB;QACAE;QACAO,UAAU;QACVC,IAAI;IACN,GACA3B;IAGF,OAAO;QACL,GAAGuB,SAAS;QACZK,YAAY;YACV,4DAA4D;YAC5D,GAAGL,UAAUK,UAAU;YACvBC,eAAelC,4CAAAA;QACjB;QACAkC,eAAevC,oBAAAA,CAAKwC,QAAQ,CAAC/B,MAAM8B,aAAa,EAAE;YAChDE,iBAAiBzB;YACjB0B,aAAarC,4CAAAA;QACf;QACAsC,YAAYlC,MAAM2B,QAAQ;QAC1BvB;QACA,mDAAmD;QACnD,oDAAoD;QACpD+B,sBAAsBC;IACxB;AACF,EAAE;AAEF,SAASA;IACP,MAAMnC,MAAMb,OAAMiD,MAAM,CAAC3C,4CAAAA;IAEzB,YAAY;IACZ,oHAAoH;IACpH,4BAA4B;IAC5B,EAAE;IACF,wEAAwE;IACxE,yDAAyD;IACzD,6CAA6C;QAC7CC,4CAAAA,EAA4BU,CAAAA;QAC1BJ,IAAIqC,OAAO,GAAGjC;QACd,OAAO;IACT;IAEA,OAAOJ,IAAIqC,OAAO;AACpB"}
+{"version":3,"sources":["../src/components/DataGridRow/useDataGridRow.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport type { DataGridRowProps, DataGridRowState } from './DataGridRow.types';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { dataGridContextDefaultValue, useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useTableRowIdContext } 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 = useTableRowIdContext();\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 focusMode = useDataGridContext_unstable(ctx => ctx.focusMode);\n  const compositeRowTabsterAttribute = useDataGridContext_unstable(ctx => ctx.compositeRowTabsterAttribute);\n\n  const tabbable = focusMode === 'row_unstable' || focusMode === 'composite';\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      tabIndex: tabbable && !isHeader ? 0 : undefined,\n      ...(focusMode === 'composite' && !isHeader && compositeRowTabsterAttribute),\n      ...props,\n      onClick,\n      onKeyDown,\n      children: null,\n      as: 'div',\n    },\n    ref,\n  );\n\n  return {\n    ...baseState,\n    components: {\n      // eslint-disable-next-line @typescript-eslint/no-deprecated\n      ...baseState.components,\n      selectionCell: DataGridSelectionCell,\n    },\n    selectionCell: slot.optional(props.selectionCell, {\n      renderByDefault: selectable,\n      elementType: DataGridSelectionCell,\n    }),\n    renderCell: props.children,\n    columnDefs,\n    // This context value should not be used internally\n    // It's intended to help power user render functions\n    dataGridContextValue: useStableDataGridContextValue(),\n  };\n};\n\nfunction useStableDataGridContextValue() {\n  const ref = React.useRef(dataGridContextDefaultValue);\n\n  // Heads up!\n  // We will not re-render when the context value changes, but we will have the latest value of the context when we do\n  // render for other reasons.\n  //\n  // This relies on a context selector that always returns the same value:\n  // - we will not re-render when the context value changes\n  // - we will store the context value in a ref\n  useDataGridContext_unstable(ctx => {\n    ref.current = ctx;\n    return null;\n  });\n\n  // eslint-disable-next-line react-hooks/refs\n  return ref.current!;\n}\n"],"names":["React","isInteractiveHTMLElement","useEventCallback","slot","Space","useTableRow_unstable","dataGridContextDefaultValue","useDataGridContext_unstable","DataGridSelectionCell","useTableRowIdContext","useIsInTableHeader","useDataGridRow_unstable","props","ref","rowId","isHeader","columnDefs","ctx","columns","selectable","selectableRows","selected","selection","isRowSelected","focusMode","compositeRowTabsterAttribute","tabbable","appearance","selectionAppearance","toggleRow","onClick","e","onKeyDown","key","target","preventDefault","baseState","undefined","tabIndex","children","as","components","selectionCell","optional","renderByDefault","elementType","renderCell","dataGridContextValue","useStableDataGridContextValue","useRef","current"],"mappings":"AAAA;;;;;+BAqBaW;;;;;;;iEAnBU,QAAQ;gCACkC,4BAA4B;8BACvE,0BAA0B;6BAEX,0BAA0B;iCACU,iCAAiC;uCACpE,iDAAiD;8BAClD,8BAA8B;oCAChC,oCAAoC;AAWhE,gCAAgC,CAACC,OAAyBC;IAC/D,MAAMC,YAAQL,kCAAAA;IACd,MAAMM,eAAWL,sCAAAA;IACjB,MAAMM,iBAAaT,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIC,OAAO;IACjE,MAAMC,iBAAaZ,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIG,cAAc;IACxE,MAAMC,eAAWd,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIK,SAAS,CAACC,aAAa,CAACT;IAChF,MAAMU,gBAAYjB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIO,SAAS;IAClE,MAAMC,mCAA+BlB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIQ,4BAA4B;IAExG,MAAMC,WAAWF,cAAc,kBAAkBA,cAAc;IAC/D,MAAMG,iBAAapB,4CAAAA,EAA4BU,CAAAA;QAC7C,IAAI,CAACF,YAAYI,cAAcF,IAAIK,SAAS,CAACC,aAAa,CAACT,QAAQ;YACjE,OAAOG,IAAIW,mBAAmB;QAChC;QAEA,OAAO;IACT;IACA,MAAMC,gBAAYtB,4CAAAA,EAA4BU,CAAAA,MAAOA,IAAIK,SAAS,CAACO,SAAS;IAE5E,MAAMC,cAAU5B,gCAAAA,EAAiB,CAAC6B;YAKhCnB;QAJA,IAAIO,cAAc,CAACJ,UAAU;YAC3Bc,UAAUE,GAAGjB;QACf;SAEAF,iBAAAA,MAAMkB,OAAAA,AAAO,MAAA,QAAblB,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAAA,IAAAA,CAAAA,OAAgBmB;IAClB;IAEA,MAAMC,gBAAY9B,gCAAAA,EAAiB,CAAC6B;YAOlCnB;QANA,IAAIO,cAAc,CAACJ,YAAYgB,EAAEE,GAAG,KAAK7B,mBAAAA,IAAS,KAACH,wCAAAA,EAAyB8B,EAAEG,MAAM,GAAkB;YACpG,iBAAiB;YACjBH,EAAEI,cAAc;YAChBN,UAAUE,GAAGjB;QACf;SAEAF,mBAAAA,MAAMoB,SAAAA,AAAS,MAAA,QAAfpB,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAAA,IAAAA,CAAAA,OAAkBmB;IACpB;IAEA,MAAMK,gBAAY/B,iCAAAA,EAChB;QACEsB;QACA,iBAAiBR,aAAaE,WAAWgB;QACzCC,UAAUZ,YAAY,CAACX,WAAW,IAAIsB;QACtC,GAAIb,cAAc,eAAe,CAACT,YAAYU,4BAA4B;QAC1E,GAAGb,KAAK;QACRkB;QACAE;QACAO,UAAU;QACVC,IAAI;IACN,GACA3B;IAGF,OAAO;QACL,GAAGuB,SAAS;QACZK,YAAY;YACV,4DAA4D;YAC5D,GAAGL,UAAUK,UAAU;YACvBC,eAAelC,4CAAAA;QACjB;QACAkC,eAAevC,oBAAAA,CAAKwC,QAAQ,CAAC/B,MAAM8B,aAAa,EAAE;YAChDE,iBAAiBzB;YACjB0B,aAAarC,4CAAAA;QACf;QACAsC,YAAYlC,MAAM2B,QAAQ;QAC1BvB;QACA,mDAAmD;QACnD,oDAAoD;QACpD+B,sBAAsBC;IACxB;AACF,EAAE;AAEF,SAASA;IACP,MAAMnC,MAAMb,OAAMiD,MAAM,CAAC3C,4CAAAA;IAEzB,YAAY;IACZ,oHAAoH;IACpH,4BAA4B;IAC5B,EAAE;IACF,wEAAwE;IACxE,yDAAyD;IACzD,6CAA6C;QAC7CC,4CAAAA,EAA4BU,CAAAA;QAC1BJ,IAAIqC,OAAO,GAAGjC;QACd,OAAO;IACT;IAEA,4CAA4C;IAC5C,OAAOJ,IAAIqC,OAAO;AACpB"}

package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js

@@ -38,12 +38,13 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useDataGridRowStyles_unstable = (state)=>{
-    'use no memo';
     const isSubtle = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.subtleSelection);
     const styles = useStyles();
     (0, _useTableRowStylesstyles.useTableRowStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridRowClassNames.root, state.root.className, isSubtle && styles.subtleSelection);
     if (state.selectionCell) {
+        // eslint-disable-next-line react-hooks/immutability
         state.selectionCell.className = (0, _react.mergeClasses)(dataGridRowClassNames.selectionCell, state.selectionCell.className);
     }
     return state;

package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridRowStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { useTableRowStyles_unstable } from '../TableRow/useTableRowStyles.styles';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nexport const dataGridRowClassNames = {\n    root: 'fui-DataGridRow',\n    selectionCell: 'fui-DataGridRow__selectionCell'\n};\nconst useStyles = makeStyles({\n    subtleSelection: {\n        ...createCustomFocusIndicatorStyle({\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }, {\n            selector: 'focus-within'\n        }),\n        ':hover': {\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }\n    }\n});\n/**\n * Apply styling to the DataGridRow slots based on the state\n */ export const useDataGridRowStyles_unstable = (state)=>{\n    'use no memo';\n    const isSubtle = useDataGridContext_unstable((ctx)=>ctx.subtleSelection);\n    const styles = useStyles();\n    useTableRowStyles_unstable(state);\n    state.root.className = mergeClasses(dataGridRowClassNames.root, state.root.className, isSubtle && styles.subtleSelection);\n    if (state.selectionCell) {\n        state.selectionCell.className = mergeClasses(dataGridRowClassNames.selectionCell, state.selectionCell.className);\n    }\n    return state;\n};\n"],"names":["__styles","mergeClasses","createCustomFocusIndicatorStyle","useTableRowStyles_unstable","useDataGridContext_unstable","tableSelectionCellClassNames","dataGridRowClassNames","root","selectionCell","useStyles","subtleSelection","Bconypa","ff6mpl","d","h","useDataGridRowStyles_unstable","state","isSubtle","ctx","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAMCM,qBAAqB;;;iCAsBY;eAA7BS;;;uBA3BwB,gBAAgB;yCAEd,sCAAsC;iCACrC,gCAAgC;AAErE,8BAA8B;IACjCR,IAAI,EAAE,iBAAiB;IACvBC,aAAa,EAAE;AACnB,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAU,eAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAejB,CAAC;AAGS,uCAAuCE,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,QAAQ,OAAGb,4CAA2B,GAAEc,GAAG,GAAGA,GAAG,CAACR,eAAe,CAAC;IACxE,MAAMS,MAAM,GAAGV,SAAS,CAAC,CAAC;QAC1BN,mDAA0B,EAACa,KAAK,CAAC;IACjCA,KAAK,CAACT,IAAI,CAACa,SAAS,OAAGnB,mBAAY,EAACK,qBAAqB,CAACC,IAAI,EAAES,KAAK,CAACT,IAAI,CAACa,SAAS,EAAEH,QAAQ,IAAIE,MAAM,CAACT,eAAe,CAAC;IACzH,IAAIM,KAAK,CAACR,aAAa,EAAE;QACrBQ,KAAK,CAACR,aAAa,CAACY,SAAS,OAAGnB,mBAAY,EAACK,qBAAqB,CAACE,aAAa,EAAEQ,KAAK,CAACR,aAAa,CAACY,SAAS,CAAC;IACpH;IACA,OAAOJ,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useDataGridRowStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { useTableRowStyles_unstable } from '../TableRow/useTableRowStyles.styles';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nexport const dataGridRowClassNames = {\n    root: 'fui-DataGridRow',\n    selectionCell: 'fui-DataGridRow__selectionCell'\n};\nconst useStyles = makeStyles({\n    subtleSelection: {\n        ...createCustomFocusIndicatorStyle({\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }, {\n            selector: 'focus-within'\n        }),\n        ':hover': {\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }\n    }\n});\n/**\n * Apply styling to the DataGridRow slots based on the state\n */ export const useDataGridRowStyles_unstable = (state)=>{\n    const isSubtle = useDataGridContext_unstable((ctx)=>ctx.subtleSelection);\n    const styles = useStyles();\n    useTableRowStyles_unstable(state);\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(dataGridRowClassNames.root, state.root.className, isSubtle && styles.subtleSelection);\n    if (state.selectionCell) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.selectionCell.className = mergeClasses(dataGridRowClassNames.selectionCell, state.selectionCell.className);\n    }\n    return state;\n};\n"],"names":["__styles","mergeClasses","createCustomFocusIndicatorStyle","useTableRowStyles_unstable","useDataGridContext_unstable","tableSelectionCellClassNames","dataGridRowClassNames","root","selectionCell","useStyles","subtleSelection","Bconypa","ff6mpl","d","h","useDataGridRowStyles_unstable","state","isSubtle","ctx","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAMCM,qBAAqB;;;iCAsBY;eAA7BS;;;uBA3BwB,gBAAgB;yCAEd,sCAAsC;iCACrC,gCAAgC;AAErE,8BAA8B;IACjCR,IAAI,EAAE,iBAAiB;IACvBC,aAAa,EAAE;AACnB,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAU,eAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAejB,CAAC;AAGS,uCAAuCE,KAAK,IAAG;IACtD,MAAMC,QAAQ,OAAGb,4CAA2B,GAAEc,GAAG,GAAGA,GAAG,CAACR,eAAe,CAAC;IACxE,MAAMS,MAAM,GAAGV,SAAS,CAAC,CAAC;IAC1BN,uDAA0B,EAACa,KAAK,CAAC;IACjC,oDAAA;IACAA,KAAK,CAACT,IAAI,CAACa,SAAS,OAAGnB,mBAAY,EAACK,qBAAqB,CAACC,IAAI,EAAES,KAAK,CAACT,IAAI,CAACa,SAAS,EAAEH,QAAQ,IAAIE,MAAM,CAACT,eAAe,CAAC;IACzH,IAAIM,KAAK,CAACR,aAAa,EAAE;QACrB,oDAAA;QACAQ,KAAK,CAACR,aAAa,CAACY,SAAS,OAAGnB,mBAAY,EAACK,qBAAqB,CAACE,aAAa,EAAEQ,KAAK,CAACR,aAAa,CAACY,SAAS,CAAC;IACpH;IACA,OAAOJ,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js

@@ -43,12 +43,13 @@ const useStyles = (0, _react.makeStyles)({
     }
 });
 const useDataGridRowStyles_unstable = (state)=>{
-    'use no memo';
     const isSubtle = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.subtleSelection);
     const styles = useStyles();
     (0, _useTableRowStylesstyles.useTableRowStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridRowClassNames.root, state.root.className, isSubtle && styles.subtleSelection);
     if (state.selectionCell) {
+        // eslint-disable-next-line react-hooks/immutability
         state.selectionCell.className = (0, _react.mergeClasses)(dataGridRowClassNames.selectionCell, state.selectionCell.className);
     }
     return state;

package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DataGridRow/useDataGridRowStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { DataGridRowSlots, DataGridRowState } from './DataGridRow.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableRowStyles_unstable } from '../TableRow/useTableRowStyles.styles';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\n\nexport const dataGridRowClassNames: SlotClassNames<DataGridRowSlots> = {\n  root: 'fui-DataGridRow',\n  selectionCell: 'fui-DataGridRow__selectionCell',\n};\n\nconst useStyles = makeStyles({\n  subtleSelection: {\n    ...createCustomFocusIndicatorStyle(\n      {\n        [`& .${tableSelectionCellClassNames.root}`]: {\n          opacity: 1,\n        },\n      },\n      { selector: 'focus-within' },\n    ),\n\n    ':hover': {\n      [`& .${tableSelectionCellClassNames.root}`]: {\n        opacity: 1,\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the DataGridRow slots based on the state\n */\nexport const useDataGridRowStyles_unstable = (state: DataGridRowState): DataGridRowState => {\n  'use no memo';\n\n  const isSubtle = useDataGridContext_unstable(ctx => ctx.subtleSelection);\n  const styles = useStyles();\n\n  useTableRowStyles_unstable(state);\n  state.root.className = mergeClasses(\n    dataGridRowClassNames.root,\n    state.root.className,\n    isSubtle && styles.subtleSelection,\n  );\n  if (state.selectionCell) {\n    state.selectionCell.className = mergeClasses(dataGridRowClassNames.selectionCell, state.selectionCell.className);\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","createCustomFocusIndicatorStyle","useTableRowStyles_unstable","useDataGridContext_unstable","tableSelectionCellClassNames","dataGridRowClassNames","root","selectionCell","useStyles","subtleSelection","opacity","selector","useDataGridRowStyles_unstable","state","isSubtle","ctx","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAUaM,qBAAAA;;;iCA2BAO;eAAAA;;;uBAnC4B,iBAAiB;8BACV,0BAA0B;yCAG/B,uCAAuC;iCACtC,iCAAiC;mDAChC,2DAA2D;AAEjG,8BAAgE;IACrEN,MAAM;IACNC,eAAe;AACjB,EAAE;AAEF,MAAMC,gBAAYT,iBAAAA,EAAW;IAC3BU,iBAAiB;QACf,OAAGR,6CAAAA,EACD;YACE,CAAC,CAAC,GAAG,EAAEG,+DAAAA,CAA6BE,IAAI,EAAE,CAAC,EAAE;gBAC3CI,SAAS;YACX;QACF,GACA;YAAEC,UAAU;QAAe,EAC5B;QAED,UAAU;YACR,CAAC,CAAC,GAAG,EAAEP,+DAAAA,CAA6BE,IAAI,EAAE,CAAC,EAAE;gBAC3CI,SAAS;YACX;QACF;IACF;AACF;AAKO,sCAAsC,CAACG;IAC5C;IAEA,MAAMC,eAAWX,4CAAAA,EAA4BY,CAAAA,MAAOA,IAAIN,eAAe;IACvE,MAAMO,SAASR;QAEfN,mDAAAA,EAA2BW;IAC3BA,MAAMP,IAAI,CAACW,SAAS,OAAGjB,mBAAAA,EACrBK,sBAAsBC,IAAI,EAC1BO,MAAMP,IAAI,CAACW,SAAS,EACpBH,YAAYE,OAAOP,eAAe;IAEpC,IAAII,MAAMN,aAAa,EAAE;QACvBM,MAAMN,aAAa,CAACU,SAAS,OAAGjB,mBAAAA,EAAaK,sBAAsBE,aAAa,EAAEM,MAAMN,aAAa,CAACU,SAAS;IACjH;IAEA,OAAOJ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DataGridRow/useDataGridRowStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { DataGridRowSlots, DataGridRowState } from './DataGridRow.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableRowStyles_unstable } from '../TableRow/useTableRowStyles.styles';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\n\nexport const dataGridRowClassNames: SlotClassNames<DataGridRowSlots> = {\n  root: 'fui-DataGridRow',\n  selectionCell: 'fui-DataGridRow__selectionCell',\n};\n\nconst useStyles = makeStyles({\n  subtleSelection: {\n    ...createCustomFocusIndicatorStyle(\n      {\n        [`& .${tableSelectionCellClassNames.root}`]: {\n          opacity: 1,\n        },\n      },\n      { selector: 'focus-within' },\n    ),\n\n    ':hover': {\n      [`& .${tableSelectionCellClassNames.root}`]: {\n        opacity: 1,\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the DataGridRow slots based on the state\n */\nexport const useDataGridRowStyles_unstable = (state: DataGridRowState): DataGridRowState => {\n  const isSubtle = useDataGridContext_unstable(ctx => ctx.subtleSelection);\n  const styles = useStyles();\n\n  useTableRowStyles_unstable(state);\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    dataGridRowClassNames.root,\n    state.root.className,\n    isSubtle && styles.subtleSelection,\n  );\n  if (state.selectionCell) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.selectionCell.className = mergeClasses(dataGridRowClassNames.selectionCell, state.selectionCell.className);\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","createCustomFocusIndicatorStyle","useTableRowStyles_unstable","useDataGridContext_unstable","tableSelectionCellClassNames","dataGridRowClassNames","root","selectionCell","useStyles","subtleSelection","opacity","selector","useDataGridRowStyles_unstable","state","isSubtle","ctx","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAUaM,qBAAAA;;;iCA2BAO;eAAAA;;;uBAnC4B,iBAAiB;8BACV,0BAA0B;yCAG/B,uCAAuC;iCACtC,iCAAiC;mDAChC,2DAA2D;AAEjG,8BAAgE;IACrEN,MAAM;IACNC,eAAe;AACjB,EAAE;AAEF,MAAMC,gBAAYT,iBAAAA,EAAW;IAC3BU,iBAAiB;QACf,OAAGR,6CAAAA,EACD;YACE,CAAC,CAAC,GAAG,EAAEG,+DAAAA,CAA6BE,IAAI,EAAE,CAAC,EAAE;gBAC3CI,SAAS;YACX;QACF,GACA;YAAEC,UAAU;QAAe,EAC5B;QAED,UAAU;YACR,CAAC,CAAC,GAAG,EAAEP,+DAAAA,CAA6BE,IAAI,EAAE,CAAC,EAAE;gBAC3CI,SAAS;YACX;QACF;IACF;AACF;AAKO,sCAAsC,CAACG;IAC5C,MAAMC,WAAWX,gDAAAA,EAA4BY,CAAAA,MAAOA,IAAIN,eAAe;IACvE,MAAMO,SAASR;QAEfN,mDAAAA,EAA2BW;IAC3B,oDAAoD;IACpDA,MAAMP,IAAI,CAACW,SAAS,OAAGjB,mBAAAA,EACrBK,sBAAsBC,IAAI,EAC1BO,MAAMP,IAAI,CAACW,SAAS,EACpBH,YAAYE,OAAOP,eAAe;IAEpC,IAAII,MAAMN,aAAa,EAAE;QACvB,oDAAoD;QACpDM,MAAMN,aAAa,CAACU,SAAS,OAAGjB,mBAAAA,EAAaK,sBAAsBE,aAAa,EAAEM,MAAMN,aAAa,CAACU,SAAS;IACjH;IAEA,OAAOJ;AACT,EAAE"}

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js

@@ -25,13 +25,15 @@ const dataGridSelectionCellClassNames = {
     radioIndicator: 'fui-DataGridSelectionCell__radioIndicator'
 };
 const useDataGridSelectionCellStyles_unstable = (state)=>{
-    'use no memo';
     (0, _useTableSelectionCellStylesstyles.useTableSelectionCellStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.root, state.root.className);
     if (state.checkboxIndicator) {
+        // eslint-disable-next-line react-hooks/immutability
         state.checkboxIndicator.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);
     }
     if (state.radioIndicator) {
+        // eslint-disable-next-line react-hooks/immutability
         state.radioIndicator.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.radioIndicator, state.radioIndicator.className);
     }
     return state;

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridSelectionCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableSelectionCellStyles_unstable } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nexport const dataGridSelectionCellClassNames = {\n    root: 'fui-DataGridSelectionCell',\n    checkboxIndicator: 'fui-DataGridSelectionCell__checkboxIndicator',\n    radioIndicator: 'fui-DataGridSelectionCell__radioIndicator'\n};\n/**\n * Apply styling to the DataGridSelectionCell slots based on the state\n */ export const useDataGridSelectionCellStyles_unstable = (state)=>{\n    'use no memo';\n    useTableSelectionCellStyles_unstable(state);\n    state.root.className = mergeClasses(dataGridSelectionCellClassNames.root, state.root.className);\n    if (state.checkboxIndicator) {\n        state.checkboxIndicator.className = mergeClasses(dataGridSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);\n    }\n    if (state.radioIndicator) {\n        state.radioIndicator.className = mergeClasses(dataGridSelectionCellClassNames.radioIndicator, state.radioIndicator.className);\n    }\n    return state;\n};\n"],"names":["mergeClasses","useTableSelectionCellStyles_unstable","dataGridSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useDataGridSelectionCellStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCE,+BAA+B;;;2CAOY;;;;uBAT3B,gBAAgB;mDACQ,0DAA0D;AACxG,wCAAwC;IAC3CC,IAAI,EAAE,2BAA2B;IACjCC,iBAAiB,EAAE,8CAA8C;IACjEC,cAAc,EAAE;AACpB,CAAC;AAGU,MAAMC,2CAA2CC,KAAK,IAAG;IAChE,aAAa;IACbN,2EAAoC,EAACM,KAAK,CAAC;IAC3CA,KAAK,CAACJ,IAAI,CAACK,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACC,IAAI,EAAEI,KAAK,CAACJ,IAAI,CAACK,SAAS,CAAC;IAC/F,IAAID,KAAK,CAACH,iBAAiB,EAAE;QACzBG,KAAK,CAACH,iBAAiB,CAACI,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACE,iBAAiB,EAAEG,KAAK,CAACH,iBAAiB,CAACI,SAAS,CAAC;IAC1I;IACA,IAAID,KAAK,CAACF,cAAc,EAAE;QACtBE,KAAK,CAACF,cAAc,CAACG,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACG,cAAc,EAAEE,KAAK,CAACF,cAAc,CAACG,SAAS,CAAC;IACjI;IACA,OAAOD,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useDataGridSelectionCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableSelectionCellStyles_unstable } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nexport const dataGridSelectionCellClassNames = {\n    root: 'fui-DataGridSelectionCell',\n    checkboxIndicator: 'fui-DataGridSelectionCell__checkboxIndicator',\n    radioIndicator: 'fui-DataGridSelectionCell__radioIndicator'\n};\n/**\n * Apply styling to the DataGridSelectionCell slots based on the state\n */ export const useDataGridSelectionCellStyles_unstable = (state)=>{\n    useTableSelectionCellStyles_unstable(state);\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(dataGridSelectionCellClassNames.root, state.root.className);\n    if (state.checkboxIndicator) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.checkboxIndicator.className = mergeClasses(dataGridSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);\n    }\n    if (state.radioIndicator) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.radioIndicator.className = mergeClasses(dataGridSelectionCellClassNames.radioIndicator, state.radioIndicator.className);\n    }\n    return state;\n};\n"],"names":["mergeClasses","useTableSelectionCellStyles_unstable","dataGridSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useDataGridSelectionCellStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCE,+BAA+B;;;2CAOY;;;;uBAT3B,gBAAgB;mDACQ,0DAA0D;AACxG,wCAAwC;IAC3CC,IAAI,EAAE,2BAA2B;IACjCC,iBAAiB,EAAE,8CAA8C;IACjEC,cAAc,EAAE;AACpB,CAAC;AAGU,MAAMC,2CAA2CC,KAAK,IAAG;QAChEN,uEAAoC,EAACM,KAAK,CAAC;IAC3C,oDAAA;IACAA,KAAK,CAACJ,IAAI,CAACK,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACC,IAAI,EAAEI,KAAK,CAACJ,IAAI,CAACK,SAAS,CAAC;IAC/F,IAAID,KAAK,CAACH,iBAAiB,EAAE;QACzB,oDAAA;QACAG,KAAK,CAACH,iBAAiB,CAACI,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACE,iBAAiB,EAAEG,KAAK,CAACH,iBAAiB,CAACI,SAAS,CAAC;IAC1I;IACA,IAAID,KAAK,CAACF,cAAc,EAAE;QACtB,oDAAA;QACAE,KAAK,CAACF,cAAc,CAACG,SAAS,OAAGR,mBAAY,EAACE,+BAA+B,CAACG,cAAc,EAAEE,KAAK,CAACF,cAAc,CAACG,SAAS,CAAC;IACjI;IACA,OAAOD,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js

@@ -25,13 +25,15 @@ const dataGridSelectionCellClassNames = {
     radioIndicator: 'fui-DataGridSelectionCell__radioIndicator'
 };
 const useDataGridSelectionCellStyles_unstable = (state)=>{
-    'use no memo';
     (0, _useTableSelectionCellStylesstyles.useTableSelectionCellStyles_unstable)(state);
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.root, state.root.className);
     if (state.checkboxIndicator) {
+        // eslint-disable-next-line react-hooks/immutability
         state.checkboxIndicator.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);
     }
     if (state.radioIndicator) {
+        // eslint-disable-next-line react-hooks/immutability
         state.radioIndicator.className = (0, _react.mergeClasses)(dataGridSelectionCellClassNames.radioIndicator, state.radioIndicator.className);
     }
     return state;

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridSelectionCellSlots, DataGridSelectionCellState } from './DataGridSelectionCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableSelectionCellStyles_unstable } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\n\nexport const dataGridSelectionCellClassNames: SlotClassNames<DataGridSelectionCellSlots> = {\n  root: 'fui-DataGridSelectionCell',\n  checkboxIndicator: 'fui-DataGridSelectionCell__checkboxIndicator',\n  radioIndicator: 'fui-DataGridSelectionCell__radioIndicator',\n};\n\n/**\n * Apply styling to the DataGridSelectionCell slots based on the state\n */\nexport const useDataGridSelectionCellStyles_unstable = (\n  state: DataGridSelectionCellState,\n): DataGridSelectionCellState => {\n  'use no memo';\n\n  useTableSelectionCellStyles_unstable(state);\n  state.root.className = mergeClasses(dataGridSelectionCellClassNames.root, state.root.className);\n\n  if (state.checkboxIndicator) {\n    state.checkboxIndicator.className = mergeClasses(\n      dataGridSelectionCellClassNames.checkboxIndicator,\n      state.checkboxIndicator.className,\n    );\n  }\n\n  if (state.radioIndicator) {\n    state.radioIndicator.className = mergeClasses(\n      dataGridSelectionCellClassNames.radioIndicator,\n      state.radioIndicator.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["mergeClasses","useTableSelectionCellStyles_unstable","dataGridSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useDataGridSelectionCellStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaE,+BAAAA;;;2CASAI;;;;uBAdgB,iBAAiB;mDAGO,2DAA2D;AAEzG,wCAAoF;IACzFH,MAAM;IACNC,mBAAmB;IACnBC,gBAAgB;AAClB,EAAE;AAKK,MAAMC,0CAA0C,CACrDC;IAEA;IAEAN,2EAAAA,EAAqCM;IACrCA,MAAMJ,IAAI,CAACK,SAAS,OAAGR,mBAAAA,EAAaE,gCAAgCC,IAAI,EAAEI,MAAMJ,IAAI,CAACK,SAAS;IAE9F,IAAID,MAAMH,iBAAiB,EAAE;QAC3BG,MAAMH,iBAAiB,CAACI,SAAS,OAAGR,mBAAAA,EAClCE,gCAAgCE,iBAAiB,EACjDG,MAAMH,iBAAiB,CAACI,SAAS;IAErC;IAEA,IAAID,MAAMF,cAAc,EAAE;QACxBE,MAAMF,cAAc,CAACG,SAAS,OAAGR,mBAAAA,EAC/BE,gCAAgCG,cAAc,EAC9CE,MAAMF,cAAc,CAACG,SAAS;IAElC;IAEA,OAAOD;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridSelectionCellSlots, DataGridSelectionCellState } from './DataGridSelectionCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableSelectionCellStyles_unstable } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\n\nexport const dataGridSelectionCellClassNames: SlotClassNames<DataGridSelectionCellSlots> = {\n  root: 'fui-DataGridSelectionCell',\n  checkboxIndicator: 'fui-DataGridSelectionCell__checkboxIndicator',\n  radioIndicator: 'fui-DataGridSelectionCell__radioIndicator',\n};\n\n/**\n * Apply styling to the DataGridSelectionCell slots based on the state\n */\nexport const useDataGridSelectionCellStyles_unstable = (\n  state: DataGridSelectionCellState,\n): DataGridSelectionCellState => {\n  useTableSelectionCellStyles_unstable(state);\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(dataGridSelectionCellClassNames.root, state.root.className);\n\n  if (state.checkboxIndicator) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.checkboxIndicator.className = mergeClasses(\n      dataGridSelectionCellClassNames.checkboxIndicator,\n      state.checkboxIndicator.className,\n    );\n  }\n\n  if (state.radioIndicator) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.radioIndicator.className = mergeClasses(\n      dataGridSelectionCellClassNames.radioIndicator,\n      state.radioIndicator.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["mergeClasses","useTableSelectionCellStyles_unstable","dataGridSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useDataGridSelectionCellStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaE,+BAAAA;;;2CASAI;;;;uBAdgB,iBAAiB;mDAGO,2DAA2D;AAEzG,wCAAoF;IACzFH,MAAM;IACNC,mBAAmB;IACnBC,gBAAgB;AAClB,EAAE;AAKK,MAAMC,0CAA0C,CACrDC;QAEAN,uEAAAA,EAAqCM;IACrC,oDAAoD;IACpDA,MAAMJ,IAAI,CAACK,SAAS,OAAGR,mBAAAA,EAAaE,gCAAgCC,IAAI,EAAEI,MAAMJ,IAAI,CAACK,SAAS;IAE9F,IAAID,MAAMH,iBAAiB,EAAE;QAC3B,oDAAoD;QACpDG,MAAMH,iBAAiB,CAACI,SAAS,OAAGR,mBAAAA,EAClCE,gCAAgCE,iBAAiB,EACjDG,MAAMH,iBAAiB,CAACI,SAAS;IAErC;IAEA,IAAID,MAAMF,cAAc,EAAE;QACxB,oDAAoD;QACpDE,MAAMF,cAAc,CAACG,SAAS,OAAGR,mBAAAA,EAC/BE,gCAAgCG,cAAc,EAC9CE,MAAMF,cAAc,CAACG,SAAS;IAElC;IAEA,OAAOD;AACT,EAAE"}

package/lib-commonjs/components/Table/useTableStyles.styles.js

@@ -63,12 +63,12 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useTableStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableClassName, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
     return state;
 };

package/lib-commonjs/components/Table/useTableStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tableClassName = 'fui-Table';\nexport const tableClassNames = {\n    root: 'fui-Table'\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table',\n        verticalAlign: 'middle',\n        width: '100%',\n        tableLayout: 'fixed'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'block'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        borderCollapse: 'collapse',\n        backgroundColor: tokens.colorSubtleBackground\n    }\n});\n/**\n * Apply styling to the Table slots based on the state\n */ export const useTableStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    state.root.className = mergeClasses(tableClassName, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","tableClassName","tableClassNames","root","useTableLayoutStyles","mc9l5x","ha4doy","a9b677","B73mfa3","d","useFlexLayoutStyles","useStyles","po53p8","De3pzq","useTableStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,cAAc;;;mBACC;;;IA0BXa,uBAAuB;;;;uBA7BC,gBAAgB;AAElD,uBAAuB,WAAW;AAClC,MAAMZ,kBAAkB;IAC3BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,GAAGN,mBAAA,EAAA;IAAAK,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAO5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,OAAGZ,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAI,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACF;;CAEA,GAAI,MAAME,SAAS,GAAA,WAAA,GAAGb,mBAAA,EAAA;IAAAK,IAAA,EAAA;QAAAS,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAJ,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,gCAAiCM,KAAK,IAAG;IAChD,aAAa;IACb,MAAMC,MAAM,GAAGL,SAAS,CAAC,CAAC;IAC1B,MAAMM,YAAY,GAAG;QACjBC,KAAK,EAAEd,oBAAoB,CAAC,CAAC;QAC7Be,IAAI,EAAET,mBAAmB,CAAC;IAC9B,CAAC;IACDK,KAAK,CAACZ,IAAI,CAACiB,SAAS,OAAGrB,mBAAY,EAACE,cAAc,EAAEe,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAAChB,IAAI,GAAGc,YAAY,CAACC,KAAK,CAACf,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACiB,SAAS,CAAC;IACjK,OAAOL,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useTableStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tableClassName = 'fui-Table';\nexport const tableClassNames = {\n    root: 'fui-Table'\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table',\n        verticalAlign: 'middle',\n        width: '100%',\n        tableLayout: 'fixed'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'block'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        borderCollapse: 'collapse',\n        backgroundColor: tokens.colorSubtleBackground\n    }\n});\n/**\n * Apply styling to the Table slots based on the state\n */ export const useTableStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tableClassName, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","tableClassName","tableClassNames","root","useTableLayoutStyles","mc9l5x","ha4doy","a9b677","B73mfa3","d","useFlexLayoutStyles","useStyles","po53p8","De3pzq","useTableStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,cAAc;;;mBACC;;;2BA0BY;eAAvBa;;;uBA7BwB,gBAAgB;AAElD,uBAAuB,WAAW;AAClC,MAAMZ,kBAAkB;IAC3BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,GAAGN,mBAAA,EAAA;IAAAK,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAO5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,OAAGZ,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAI,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACF;;CAEA,GAAI,MAAME,SAAS,GAAA,WAAA,OAAGb,eAAA,EAAA;IAAAK,IAAA,EAAA;QAAAS,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAJ,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAKrB,CAAC;AAGS,iCAAiCM,KAAK,IAAG;IAChD,MAAMC,MAAM,GAAGL,SAAS,CAAC,CAAC;IAC1B,MAAMM,YAAY,GAAG;QACjBC,KAAK,EAAEd,oBAAoB,CAAC,CAAC;QAC7Be,IAAI,EAAET,mBAAmB,CAAC;IAC9B,CAAC;IACD,oDAAA;IACAK,KAAK,CAACZ,IAAI,CAACiB,SAAS,OAAGrB,mBAAY,EAACE,cAAc,EAAEe,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAAChB,IAAI,GAAGc,YAAY,CAACC,KAAK,CAACf,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACiB,SAAS,CAAC;IACjK,OAAOL,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/Table/useTableStyles.styles.raw.js

@@ -48,12 +48,12 @@ const useFlexLayoutStyles = (0, _react.makeStyles)({
     }
 });
 const useTableStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableClassName, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
     return state;
 };

package/lib-commonjs/components/Table/useTableStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Table/useTableStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableSlots, TableState } from './Table.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableClassName = 'fui-Table';\nexport const tableClassNames: SlotClassNames<TableSlots> = {\n  root: 'fui-Table',\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table',\n    verticalAlign: 'middle',\n    width: '100%',\n    tableLayout: 'fixed',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'block',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    borderCollapse: 'collapse',\n    backgroundColor: tokens.colorSubtleBackground,\n  },\n});\n\n/**\n * Apply styling to the Table slots based on the state\n */\nexport const useTableStyles_unstable = (state: TableState): TableState => {\n  'use no memo';\n\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  state.root.className = mergeClasses(\n    tableClassName,\n    styles.root,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","tableClassName","tableClassNames","root","useTableLayoutStyles","display","verticalAlign","width","tableLayout","useFlexLayoutStyles","useStyles","borderCollapse","backgroundColor","colorSubtleBackground","useTableStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,cAAAA;;;mBACAC;;;IAgCAY,uBAAAA;;;;uBAtC4B,iBAAiB;4BACnC,wBAAwB;AAIxC,uBAAuB,YAAY;AACnC,MAAMZ,kBAA8C;IACzDC,MAAM;AACR,EAAE;AAEF,MAAMC,2BAAuBN,iBAAAA,EAAW;IACtCK,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,OAAO;QACPC,aAAa;IACf;AACF;AAEA,MAAMC,0BAAsBX,iBAAAA,EAAW;IACrCK,MAAM;QACJE,SAAS;IACX;AACF;AAEA;;CAEC,GACD,MAAMK,gBAAYZ,iBAAAA,EAAW;IAC3BK,MAAM;QACJQ,gBAAgB;QAChBC,iBAAiBZ,kBAAAA,CAAOa,qBAAqB;IAC/C;AACF;AAKO,gCAAgC,CAACE;IACtC;IAEA,MAAMC,SAASN;IACf,MAAMO,eAAe;QACnBC,OAAOd;QACPe,MAAMV;IACR;IACAM,MAAMZ,IAAI,CAACiB,SAAS,OAAGrB,mBAAAA,EACrBE,gBACAe,OAAOb,IAAI,EACXY,MAAMM,gBAAgB,GAAGJ,aAAaE,IAAI,CAAChB,IAAI,GAAGc,aAAaC,KAAK,CAACf,IAAI,EACzEY,MAAMZ,IAAI,CAACiB,SAAS;IAGtB,OAAOL;AACT,EAAE"}
+{"version":3,"sources":["../src/components/Table/useTableStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableSlots, TableState } from './Table.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableClassName = 'fui-Table';\nexport const tableClassNames: SlotClassNames<TableSlots> = {\n  root: 'fui-Table',\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table',\n    verticalAlign: 'middle',\n    width: '100%',\n    tableLayout: 'fixed',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'block',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    borderCollapse: 'collapse',\n    backgroundColor: tokens.colorSubtleBackground,\n  },\n});\n\n/**\n * Apply styling to the Table slots based on the state\n */\nexport const useTableStyles_unstable = (state: TableState): TableState => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    tableClassName,\n    styles.root,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","tableClassName","tableClassNames","root","useTableLayoutStyles","display","verticalAlign","width","tableLayout","useFlexLayoutStyles","useStyles","borderCollapse","backgroundColor","colorSubtleBackground","useTableStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,cAAAA;;;mBACAC;;;2BAgCAY;;;;uBAtC4B,iBAAiB;4BACnC,wBAAwB;AAIxC,uBAAuB,YAAY;AACnC,MAAMZ,kBAA8C;IACzDC,MAAM;AACR,EAAE;AAEF,MAAMC,2BAAuBN,iBAAAA,EAAW;IACtCK,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,OAAO;QACPC,aAAa;IACf;AACF;AAEA,MAAMC,0BAAsBX,iBAAAA,EAAW;IACrCK,MAAM;QACJE,SAAS;IACX;AACF;AAEA;;CAEC,GACD,MAAMK,gBAAYZ,iBAAAA,EAAW;IAC3BK,MAAM;QACJQ,gBAAgB;QAChBC,iBAAiBZ,kBAAAA,CAAOa,qBAAqB;IAC/C;AACF;AAKO,MAAMC,0BAA0B,CAACC;IACtC,MAAMC,SAASN;IACf,MAAMO,eAAe;QACnBC,OAAOd;QACPe,MAAMV;IACR;IACA,oDAAoD;IACpDM,MAAMZ,IAAI,CAACiB,SAAS,OAAGrB,mBAAAA,EACrBE,gBACAe,OAAOb,IAAI,EACXY,MAAMM,gBAAgB,GAAGJ,aAAaE,IAAI,CAAChB,IAAI,GAAGc,aAAaC,KAAK,CAACf,IAAI,EACzEY,MAAMZ,IAAI,CAACiB,SAAS;IAGtB,OAAOL;AACT,EAAE"}

package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.js

@@ -44,11 +44,11 @@ const tableBodyClassNames = {
     root: 'fui-TableBody'
 };
 const useTableBodyStyles_unstable = (state)=>{
-    'use no memo';
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableBodyClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
     return state;
 };

package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-row-group'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'block'\n    }\n});\nexport const tableBodyClassName = 'fui-TableBody';\nexport const tableBodyClassNames = {\n    root: 'fui-TableBody'\n};\n/**\n * Apply styling to the TableBody slots based on the state\n */ export const useTableBodyStyles_unstable = (state)=>{\n    'use no memo';\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    state.root.className = mergeClasses(tableBodyClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n    return state;\n};\n"],"names":["mergeClasses","__styles","useTableLayoutStyles","root","mc9l5x","d","useFlexLayoutStyles","tableBodyClassName","tableBodyClassNames","useTableBodyStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;sBAYmB;;;uBACC;;;+BAKY;;;;uBAjBH,gBAAgB;AACzD,MAAME,oBAAoB,GAAA,WAAA,OAAGD,eAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,GAAGL,mBAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACK,MAAME,qBAAqB,eAAe;AAC1C,MAAMC,sBAAsB;IAC/BL,IAAI,EAAE;AACV,CAAC;AAGU,MAAMM,+BAA+BC,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,YAAY,GAAG;QACjBC,KAAK,EAAEV,oBAAoB,CAAC,CAAC;QAC7BW,IAAI,EAAEP,mBAAmB,CAAC;IAC9B,CAAC;IACDI,KAAK,CAACP,IAAI,CAACW,SAAS,OAAGd,mBAAY,EAACO,kBAAkB,EAAEG,KAAK,CAACK,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACV,IAAI,GAAGQ,YAAY,CAACC,KAAK,CAACT,IAAI,EAAEO,KAAK,CAACP,IAAI,CAACW,SAAS,CAAC;IACxJ,OAAOJ,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useTableBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-row-group'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'block'\n    }\n});\nexport const tableBodyClassName = 'fui-TableBody';\nexport const tableBodyClassNames = {\n    root: 'fui-TableBody'\n};\n/**\n * Apply styling to the TableBody slots based on the state\n */ export const useTableBodyStyles_unstable = (state)=>{\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tableBodyClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n    return state;\n};\n"],"names":["mergeClasses","__styles","useTableLayoutStyles","root","mc9l5x","d","useFlexLayoutStyles","tableBodyClassName","tableBodyClassNames","useTableBodyStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;sBAYmB;eAAlBO;;uBACmB;;;+BAKY;eAA3BE;;;uBAjBwB,gBAAgB;AACzD,MAAMP,oBAAoB,GAAA,WAAA,OAAGD,eAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACK,2BAA2B,eAAe;AAC1C,MAAMG,sBAAsB;IAC/BL,IAAI,EAAE;AACV,CAAC;AAGU,qCAAqCO,KAAK,IAAG;IACpD,MAAMC,YAAY,GAAG;QACjBC,KAAK,EAAEV,oBAAoB,CAAC,CAAC;QAC7BW,IAAI,EAAEP,mBAAmB,CAAC;IAC9B,CAAC;IACD,oDAAA;IACAI,KAAK,CAACP,IAAI,CAACW,SAAS,OAAGd,mBAAY,EAACO,kBAAkB,EAAEG,KAAK,CAACK,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACV,IAAI,GAAGQ,YAAY,CAACC,KAAK,CAACT,IAAI,EAAEO,KAAK,CAACP,IAAI,CAACW,SAAS,CAAC;IACxJ,OAAOJ,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.raw.js

@@ -36,11 +36,11 @@ const tableBodyClassNames = {
     root: 'fui-TableBody'
 };
 const useTableBodyStyles_unstable = (state)=>{
-    'use no memo';
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableBodyClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
     return state;
 };

package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TableBody/useTableBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { TableBodySlots, TableBodyState } from './TableBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-row-group',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'block',\n  },\n});\n\nexport const tableBodyClassName = 'fui-TableBody';\nexport const tableBodyClassNames: SlotClassNames<TableBodySlots> = {\n  root: 'fui-TableBody',\n};\n\n/**\n * Apply styling to the TableBody slots based on the state\n */\nexport const useTableBodyStyles_unstable = (state: TableBodyState): TableBodyState => {\n  'use no memo';\n\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  state.root.className = mergeClasses(\n    tableBodyClassName,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","useTableLayoutStyles","root","display","useFlexLayoutStyles","tableBodyClassName","tableBodyClassNames","useTableBodyStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;sBAkBaM;;;uBACAC;;;+BAOAC;eAAAA;;;uBAxB4B,iBAAiB;AAI1D,MAAMN,2BAAuBD,iBAAAA,EAAW;IACtCE,MAAM;QACJC,SAAS;IACX;AACF;AAEA,MAAMC,0BAAsBJ,iBAAAA,EAAW;IACrCE,MAAM;QACJC,SAAS;IACX;AACF;AAEO,MAAME,qBAAqB,gBAAgB;AAC3C,MAAMC,sBAAsD;IACjEJ,MAAM;AACR,EAAE;AAKK,oCAAoC,CAACM;IAC1C;IAEA,MAAMC,eAAe;QACnBC,OAAOT;QACPU,MAAMP;IACR;IACAI,MAAMN,IAAI,CAACU,SAAS,OAAGb,mBAAAA,EACrBM,oBACAG,MAAMK,gBAAgB,GAAGJ,aAAaE,IAAI,CAACT,IAAI,GAAGO,aAAaC,KAAK,CAACR,IAAI,EACzEM,MAAMN,IAAI,CAACU,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/TableBody/useTableBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { TableBodySlots, TableBodyState } from './TableBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-row-group',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'block',\n  },\n});\n\nexport const tableBodyClassName = 'fui-TableBody';\nexport const tableBodyClassNames: SlotClassNames<TableBodySlots> = {\n  root: 'fui-TableBody',\n};\n\n/**\n * Apply styling to the TableBody slots based on the state\n */\nexport const useTableBodyStyles_unstable = (state: TableBodyState): TableBodyState => {\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    tableBodyClassName,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["mergeClasses","makeStyles","useTableLayoutStyles","root","display","useFlexLayoutStyles","tableBodyClassName","tableBodyClassNames","useTableBodyStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;sBAkBaM;;;uBACAC;;;+BAOAC;;;;uBAxB4B,iBAAiB;AAI1D,MAAMN,2BAAuBD,iBAAAA,EAAW;IACtCE,MAAM;QACJC,SAAS;IACX;AACF;AAEA,MAAMC,0BAAsBJ,iBAAAA,EAAW;IACrCE,MAAM;QACJC,SAAS;IACX;AACF;AAEO,MAAME,qBAAqB,gBAAgB;AAC3C,MAAMC,sBAAsD;IACjEJ,MAAM;AACR,EAAE;AAKK,MAAMK,8BAA8B,CAACC;IAC1C,MAAMC,eAAe;QACnBC,OAAOT;QACPU,MAAMP;IACR;IACA,oDAAoD;IACpDI,MAAMN,IAAI,CAACU,SAAS,OAAGb,mBAAAA,EACrBM,oBACAG,MAAMK,gBAAgB,GAAGJ,aAAaE,IAAI,CAACT,IAAI,GAAGO,aAAaC,KAAK,CAACR,IAAI,EACzEM,MAAMN,IAAI,CAACU,SAAS;IAGtB,OAAOJ;AACT,EAAE"}

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js

@@ -127,12 +127,12 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useTableCellStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);
     return state;
 };

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames = {\n    root: tableCellClassName\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-cell',\n        verticalAlign: 'middle'\n    },\n    medium: {\n        height: '44px'\n    },\n    small: {\n        height: '34px'\n    },\n    'extra-small': {\n        height: '24px'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'flex',\n        minWidth: '0px',\n        alignItems: 'center',\n        flex: '1 1 0px'\n    },\n    medium: {\n        minHeight: '44px'\n    },\n    small: {\n        minHeight: '34px'\n    },\n    'extra-small': {\n        minHeight: '24px'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        position: 'relative',\n        padding: `0px ${tokens.spacingHorizontalS}`,\n        ...createCustomFocusIndicatorStyle({\n            outline: `2px solid ${tokens.colorStrokeFocus2}`,\n            borderRadius: tokens.borderRadiusMedium\n        }, {\n            selector: 'focus'\n        })\n    }\n});\n/**\n * Apply styling to the TableCell slots based on the state\n */ export const useTableCellStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    state.root.className = mergeClasses(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableCellClassName","tableCellClassNames","root","useTableLayoutStyles","mc9l5x","ha4doy","medium","Bqenvij","small","d","useFlexLayoutStyles","Bf4jedk","Bt984gj","xawz","Bh6795r","Bnnss6s","fkmc3a","sshi5w","p","useStyles","qhf8xq","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","useTableCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements","size"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICI,kBAAkB;;;uBACC;;;IAmDfmC,2BAA2B;;;;uBAvDH,gBAAgB;AAGlD,2BAA2B,eAAe;AAC1C,MAAMlC,sBAAsB;IAC/BC,IAAI,EAAEF;AACV,CAAC;AACD,MAAMG,oBAAoB,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;IAAA,eAAA;QAAAA,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAc5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,OAAGd,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAO,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAV,MAAA,EAAA;QAAAW,MAAA,EAAA;IAAA;IAAAT,KAAA,EAAA;QAAAS,MAAA,EAAA;IAAA;IAAA,eAAA;QAAAA,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAR,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAS,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAgB3B,CAAC;AACF;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGvB,mBAAA,EAAA;IAAAM,IAAA,EAAA;QAAAkB,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAzB,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAS,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAWrB,CAAC;AAGS,qCAAqCkB,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;IAC1B,MAAMmB,YAAY,GAAG;QACjBC,KAAK,EAAEpC,oBAAoB,CAAC,CAAC;QAC7BqC,IAAI,EAAE9B,mBAAmB,CAAC;IAC9B,CAAC;IACD0B,KAAK,CAAClC,IAAI,CAACuC,SAAS,OAAG5C,mBAAY,EAACI,mBAAmB,CAACC,IAAI,EAAEmC,MAAM,CAACnC,IAAI,EAAEkC,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACtC,IAAI,GAAGoC,YAAY,CAACC,KAAK,CAACrC,IAAI,EAAEkC,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACJ,KAAK,CAACO,IAAI,CAAC,GAAGL,YAAY,CAACC,KAAK,CAACH,KAAK,CAACO,IAAI,CAAC,EAAEP,KAAK,CAAClC,IAAI,CAACuC,SAAS,CAAC;IACpQ,OAAOL,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useTableCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames = {\n    root: tableCellClassName\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-cell',\n        verticalAlign: 'middle'\n    },\n    medium: {\n        height: '44px'\n    },\n    small: {\n        height: '34px'\n    },\n    'extra-small': {\n        height: '24px'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'flex',\n        minWidth: '0px',\n        alignItems: 'center',\n        flex: '1 1 0px'\n    },\n    medium: {\n        minHeight: '44px'\n    },\n    small: {\n        minHeight: '34px'\n    },\n    'extra-small': {\n        minHeight: '24px'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        position: 'relative',\n        padding: `0px ${tokens.spacingHorizontalS}`,\n        ...createCustomFocusIndicatorStyle({\n            outline: `2px solid ${tokens.colorStrokeFocus2}`,\n            borderRadius: tokens.borderRadiusMedium\n        }, {\n            selector: 'focus'\n        })\n    }\n});\n/**\n * Apply styling to the TableCell slots based on the state\n */ export const useTableCellStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableCellClassName","tableCellClassNames","root","useTableLayoutStyles","mc9l5x","ha4doy","medium","Bqenvij","small","d","useFlexLayoutStyles","Bf4jedk","Bt984gj","xawz","Bh6795r","Bnnss6s","fkmc3a","sshi5w","p","useStyles","qhf8xq","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","useTableCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements","size"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICI,kBAAkB;;;uBACC;;;+BAmDY;eAA3BmC;;;uBAvDwB,gBAAgB;AAGlD,2BAA2B,eAAe;AAC1C,MAAMlC,sBAAsB;IAC/BC,IAAI,EAAEF;AACV,CAAC;AACD,MAAMG,oBAAoB,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;IAAA,eAAA;QAAAA,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAc5B,CAAC;AACF,MAAMC,mBAAmB,GAAA,WAAA,OAAGd,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAO,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAV,MAAA,EAAA;QAAAW,MAAA,EAAA;IAAA;IAAAT,KAAA,EAAA;QAAAS,MAAA,EAAA;IAAA;IAAA,eAAA;QAAAA,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAR,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAS,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAgB3B,CAAC;AACF;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGvB,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAkB,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAzB,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAS,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAWrB,CAAC;AAGS,qCAAqCkB,KAAK,IAAG;IACpD,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;IAC1B,MAAMmB,YAAY,GAAG;QACjBC,KAAK,EAAEpC,oBAAoB,CAAC,CAAC;QAC7BqC,IAAI,EAAE9B,mBAAmB,CAAC;IAC9B,CAAC;IACD,oDAAA;IACA0B,KAAK,CAAClC,IAAI,CAACuC,SAAS,OAAG5C,mBAAY,EAACI,mBAAmB,CAACC,IAAI,EAAEmC,MAAM,CAACnC,IAAI,EAAEkC,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACtC,IAAI,GAAGoC,YAAY,CAACC,KAAK,CAACrC,IAAI,EAAEkC,KAAK,CAACM,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACJ,KAAK,CAACO,IAAI,CAAC,GAAGL,YAAY,CAACC,KAAK,CAACH,KAAK,CAACO,IAAI,CAAC,EAAEP,KAAK,CAAClC,IAAI,CAACuC,SAAS,CAAC;IACpQ,OAAOL,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.raw.js

@@ -74,12 +74,12 @@ const useFlexLayoutStyles = (0, _react.makeStyles)({
     }
 });
 const useTableCellStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     const layoutStyles = {
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);
     return state;
 };

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TableCell/useTableCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { TableCellSlots, TableCellState } from './TableCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames: SlotClassNames<TableCellSlots> = {\n  root: tableCellClassName,\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-cell',\n    verticalAlign: 'middle',\n  },\n\n  medium: {\n    height: '44px',\n  },\n\n  small: {\n    height: '34px',\n  },\n\n  'extra-small': {\n    height: '24px',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'flex',\n    minWidth: '0px',\n    alignItems: 'center',\n    flex: '1 1 0px',\n  },\n\n  medium: {\n    minHeight: '44px',\n  },\n\n  small: {\n    minHeight: '34px',\n  },\n\n  'extra-small': {\n    minHeight: '24px',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    position: 'relative',\n    padding: `0px ${tokens.spacingHorizontalS}`,\n\n    ...createCustomFocusIndicatorStyle(\n      { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n      { selector: 'focus' },\n    ),\n  },\n});\n\n/**\n * Apply styling to the TableCell slots based on the state\n */\nexport const useTableCellStyles_unstable = (state: TableCellState): TableCellState => {\n  'use no memo';\n\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  state.root.className = mergeClasses(\n    tableCellClassNames.root,\n    styles.root,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size],\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableCellClassName","tableCellClassNames","root","useTableLayoutStyles","display","verticalAlign","medium","height","small","useFlexLayoutStyles","minWidth","alignItems","flex","minHeight","useStyles","position","padding","spacingHorizontalS","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useTableCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements","size"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,kBAAAA;;;uBACAC;;;+BA8DAsB;eAAAA;;;uBArE4B,iBAAiB;4BACnC,wBAAwB;8BACC,0BAA0B;AAInE,2BAA2B,gBAAgB;AAC3C,MAAMtB,sBAAsD;IACjEC,MAAMF;AACR,EAAE;AAEF,MAAMG,2BAAuBP,iBAAAA,EAAW;IACtCM,MAAM;QACJE,SAAS;QACTC,eAAe;IACjB;IAEAC,QAAQ;QACNC,QAAQ;IACV;IAEAC,OAAO;QACLD,QAAQ;IACV;IAEA,eAAe;QACbA,QAAQ;IACV;AACF;AAEA,MAAME,0BAAsBb,iBAAAA,EAAW;IACrCM,MAAM;QACJE,SAAS;QACTM,UAAU;QACVC,YAAY;QACZC,MAAM;IACR;IAEAN,QAAQ;QACNO,WAAW;IACb;IAEAL,OAAO;QACLK,WAAW;IACb;IAEA,eAAe;QACbA,WAAW;IACb;AACF;AAEA;;CAEC,GACD,MAAMC,gBAAYlB,iBAAAA,EAAW;IAC3BM,MAAM;QACJa,UAAU;QACVC,SAAS,CAAC,IAAI,EAAElB,kBAAAA,CAAOmB,kBAAkB,EAAE;QAE3C,OAAGlB,6CAAAA,EACD;YAAEmB,SAAS,CAAC,UAAU,EAAEpB,kBAAAA,CAAOqB,iBAAiB,EAAE;YAAEC,cAActB,kBAAAA,CAAOuB,kBAAkB;QAAC,GAC5F;YAAEC,UAAU;QAAQ,EACrB;IACH;AACF;AAKO,oCAAoC,CAACE;IAC1C;IAEA,MAAMC,SAASX;IACf,MAAMY,eAAe;QACnBC,OAAOxB;QACPS,MAAMH;IACR;IACAe,MAAMtB,IAAI,CAAC0B,SAAS,OAAG/B,mBAAAA,EACrBI,oBAAoBC,IAAI,EACxBuB,OAAOvB,IAAI,EACXsB,MAAMK,gBAAgB,GAAGH,aAAad,IAAI,CAACV,IAAI,GAAGwB,aAAaC,KAAK,CAACzB,IAAI,EACzEsB,MAAMK,gBAAgB,GAAGH,aAAad,IAAI,CAACY,MAAMM,IAAI,CAAC,GAAGJ,aAAaC,KAAK,CAACH,MAAMM,IAAI,CAAC,EACvFN,MAAMtB,IAAI,CAAC0B,SAAS;IAEtB,OAAOJ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/TableCell/useTableCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { TableCellSlots, TableCellState } from './TableCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames: SlotClassNames<TableCellSlots> = {\n  root: tableCellClassName,\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-cell',\n    verticalAlign: 'middle',\n  },\n\n  medium: {\n    height: '44px',\n  },\n\n  small: {\n    height: '34px',\n  },\n\n  'extra-small': {\n    height: '24px',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'flex',\n    minWidth: '0px',\n    alignItems: 'center',\n    flex: '1 1 0px',\n  },\n\n  medium: {\n    minHeight: '44px',\n  },\n\n  small: {\n    minHeight: '34px',\n  },\n\n  'extra-small': {\n    minHeight: '24px',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    position: 'relative',\n    padding: `0px ${tokens.spacingHorizontalS}`,\n\n    ...createCustomFocusIndicatorStyle(\n      { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n      { selector: 'focus' },\n    ),\n  },\n});\n\n/**\n * Apply styling to the TableCell slots based on the state\n */\nexport const useTableCellStyles_unstable = (state: TableCellState): TableCellState => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles(),\n  };\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    tableCellClassNames.root,\n    styles.root,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size],\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableCellClassName","tableCellClassNames","root","useTableLayoutStyles","display","verticalAlign","medium","height","small","useFlexLayoutStyles","minWidth","alignItems","flex","minHeight","useStyles","position","padding","spacingHorizontalS","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useTableCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements","size"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,kBAAAA;;;uBACAC;;;+BA8DAsB;eAAAA;;;uBArE4B,iBAAiB;4BACnC,wBAAwB;8BACC,0BAA0B;AAInE,2BAA2B,gBAAgB;AAC3C,MAAMtB,sBAAsD;IACjEC,MAAMF;AACR,EAAE;AAEF,MAAMG,2BAAuBP,iBAAAA,EAAW;IACtCM,MAAM;QACJE,SAAS;QACTC,eAAe;IACjB;IAEAC,QAAQ;QACNC,QAAQ;IACV;IAEAC,OAAO;QACLD,QAAQ;IACV;IAEA,eAAe;QACbA,QAAQ;IACV;AACF;AAEA,MAAME,0BAAsBb,iBAAAA,EAAW;IACrCM,MAAM;QACJE,SAAS;QACTM,UAAU;QACVC,YAAY;QACZC,MAAM;IACR;IAEAN,QAAQ;QACNO,WAAW;IACb;IAEAL,OAAO;QACLK,WAAW;IACb;IAEA,eAAe;QACbA,WAAW;IACb;AACF;AAEA;;CAEC,GACD,MAAMC,gBAAYlB,iBAAAA,EAAW;IAC3BM,MAAM;QACJa,UAAU;QACVC,SAAS,CAAC,IAAI,EAAElB,kBAAAA,CAAOmB,kBAAkB,EAAE;QAE3C,OAAGlB,6CAAAA,EACD;YAAEmB,SAAS,CAAC,UAAU,EAAEpB,kBAAAA,CAAOqB,iBAAiB,EAAE;YAAEC,cAActB,kBAAAA,CAAOuB,kBAAkB;QAAC,GAC5F;YAAEC,UAAU;QAAQ,EACrB;IACH;AACF;AAKO,oCAAoC,CAACE;IAC1C,MAAMC,SAASX;IACf,MAAMY,eAAe;QACnBC,OAAOxB;QACPS,MAAMH;IACR;IACA,oDAAoD;IACpDe,MAAMtB,IAAI,CAAC0B,SAAS,OAAG/B,mBAAAA,EACrBI,oBAAoBC,IAAI,EACxBuB,OAAOvB,IAAI,EACXsB,MAAMK,gBAAgB,GAAGH,aAAad,IAAI,CAACV,IAAI,GAAGwB,aAAaC,KAAK,CAACzB,IAAI,EACzEsB,MAAMK,gBAAgB,GAAGH,aAAad,IAAI,CAACY,MAAMM,IAAI,CAAC,GAAGJ,aAAaC,KAAK,CAACH,MAAMM,IAAI,CAAC,EACvFN,MAAMtB,IAAI,CAAC0B,SAAS;IAEtB,OAAOJ;AACT,EAAE"}

package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.js

@@ -57,8 +57,8 @@ const tableCellActionsClassNames = {
     ]
 });
 const useTableCellActionsStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableCellActionsClassNames.root, styles.root, state.visible && styles.visible, state.root.className);
     return state;
 };

package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCellActionsStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const tableCellActionsClassNames = {\n    root: 'fui-TableCellActions'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        backgroundColor: 'inherit',\n        position: 'absolute',\n        right: '0px',\n        top: '50%',\n        transform: 'translateY(-50%)',\n        opacity: 0,\n        marginLeft: 'auto'\n    },\n    visible: {\n        opacity: 1\n    }\n});\n/**\n * Apply styling to the TableCellActions slots based on the state\n */ export const useTableCellActionsStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    state.root.className = mergeClasses(tableCellActionsClassNames.root, styles.root, state.visible && styles.visible, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tableCellActionsClassNames","root","useStyles","De3pzq","qhf8xq","j35jbq","Bhzewxz","Bz10aip","abs64n","Frg6f3","visible","d","useTableCellActionsStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,0BAA0B;;;sCAqBY;eAAlCY;;;uBAtBwB,gBAAgB;AAClD,mCAAmC;IACtCX,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,OAAA,EAAA;QAAAF,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAG,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAarB,CAAC;AAGS,4CAA4CE,KAAK,IAAG;IAC3D,aAAa;IACb,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;IAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,OAAGhB,mBAAY,EAACC,0BAA0B,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACH,OAAO,IAAII,MAAM,CAACJ,OAAO,EAAEG,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;IACxI,OAAOF,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useTableCellActionsStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const tableCellActionsClassNames = {\n    root: 'fui-TableCellActions'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        backgroundColor: 'inherit',\n        position: 'absolute',\n        right: '0px',\n        top: '50%',\n        transform: 'translateY(-50%)',\n        opacity: 0,\n        marginLeft: 'auto'\n    },\n    visible: {\n        opacity: 1\n    }\n});\n/**\n * Apply styling to the TableCellActions slots based on the state\n */ export const useTableCellActionsStyles_unstable = (state)=>{\n    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tableCellActionsClassNames.root, styles.root, state.visible && styles.visible, state.root.className);\n    return state;\n};\n"],"names":["__styles","mergeClasses","tableCellActionsClassNames","root","useStyles","De3pzq","qhf8xq","j35jbq","Bhzewxz","Bz10aip","abs64n","Frg6f3","visible","d","useTableCellActionsStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,0BAA0B;;;sCAqBY;eAAlCY;;;uBAtBwB,gBAAgB;AAClD,mCAAmC;IACtCX,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,OAAA,EAAA;QAAAF,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAG,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAarB,CAAC;AAGS,4CAA4CE,KAAK,IAAG;IAC3D,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAW,KAAK,CAACZ,IAAI,CAACc,SAAS,OAAGhB,mBAAY,EAACC,0BAA0B,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACH,OAAO,IAAII,MAAM,CAACJ,OAAO,EAAEG,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;IACxI,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.raw.js

@@ -38,8 +38,8 @@ const tableCellActionsClassNames = {
     }
 });
 const useTableCellActionsStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableCellActionsClassNames.root, styles.root, state.visible && styles.visible, state.root.className);
     return state;
 };

package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TableCellActions/useTableCellActionsStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableCellActionsSlots, TableCellActionsState } from './TableCellActions.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableCellActionsClassNames: SlotClassNames<TableCellActionsSlots> = {\n  root: 'fui-TableCellActions',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    backgroundColor: 'inherit',\n    position: 'absolute',\n    right: '0px',\n    top: '50%',\n    transform: 'translateY(-50%)',\n    opacity: 0,\n    marginLeft: 'auto',\n  },\n\n  visible: {\n    opacity: 1,\n  },\n});\n\n/**\n * Apply styling to the TableCellActions slots based on the state\n */\nexport const useTableCellActionsStyles_unstable = (state: TableCellActionsState): TableCellActionsState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    tableCellActionsClassNames.root,\n    styles.root,\n    state.visible && styles.visible,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tableCellActionsClassNames","root","useStyles","backgroundColor","position","right","top","transform","opacity","marginLeft","visible","useTableCellActionsStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,0BAAAA;;;sCA0BAW;eAAAA;;;uBA9B4B,iBAAiB;AAInD,mCAA0E;IAC/EV,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,iBAAiB;QACjBC,UAAU;QACVC,OAAO;QACPC,KAAK;QACLC,WAAW;QACXC,SAAS;QACTC,YAAY;IACd;IAEAC,SAAS;QACPF,SAAS;IACX;AACF;AAKO,2CAA2C,CAACI;IACjD;IAEA,MAAMC,SAASX;IACfU,MAAMX,IAAI,CAACa,SAAS,OAAGf,mBAAAA,EACrBC,2BAA2BC,IAAI,EAC/BY,OAAOZ,IAAI,EACXW,MAAMF,OAAO,IAAIG,OAAOH,OAAO,EAC/BE,MAAMX,IAAI,CAACa,SAAS;IAGtB,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/TableCellActions/useTableCellActionsStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableCellActionsSlots, TableCellActionsState } from './TableCellActions.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableCellActionsClassNames: SlotClassNames<TableCellActionsSlots> = {\n  root: 'fui-TableCellActions',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    backgroundColor: 'inherit',\n    position: 'absolute',\n    right: '0px',\n    top: '50%',\n    transform: 'translateY(-50%)',\n    opacity: 0,\n    marginLeft: 'auto',\n  },\n\n  visible: {\n    opacity: 1,\n  },\n});\n\n/**\n * Apply styling to the TableCellActions slots based on the state\n */\nexport const useTableCellActionsStyles_unstable = (state: TableCellActionsState): TableCellActionsState => {\n  const styles = useStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    tableCellActionsClassNames.root,\n    styles.root,\n    state.visible && styles.visible,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tableCellActionsClassNames","root","useStyles","backgroundColor","position","right","top","transform","opacity","marginLeft","visible","useTableCellActionsStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,0BAAAA;;;sCA0BAW;eAAAA;;;uBA9B4B,iBAAiB;AAInD,mCAA0E;IAC/EV,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM;QACJE,iBAAiB;QACjBC,UAAU;QACVC,OAAO;QACPC,KAAK;QACLC,WAAW;QACXC,SAAS;QACTC,YAAY;IACd;IAEAC,SAAS;QACPF,SAAS;IACX;AACF;AAKO,2CAA2C,CAACI;IACjD,MAAMC,SAASX;IACf,oDAAoD;IACpDU,MAAMX,IAAI,CAACa,SAAS,OAAGf,mBAAAA,EACrBC,2BAA2BC,IAAI,EAC/BY,OAAOZ,IAAI,EACXW,MAAMF,OAAO,IAAIG,OAAOH,OAAO,EAC/BE,MAAMX,IAAI,CAACa,SAAS;IAGtB,OAAOF;AACT,EAAE"}

package/lib-commonjs/components/TableCellLayout/useTableCellLayoutStyles.styles.js

@@ -109,9 +109,9 @@ const tableCellLayoutClassNames = {
     ]
 });
 const useTableCellLayoutStyles_unstable = (state)=>{
-    'use no memo';
     const styles = useStyles();
     const { truncate } = state;
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.root, styles.root, truncate && styles.rootTruncate, state.root.className);
     const primary = state.appearance === 'primary';
     if (state.media) {
@@ -120,15 +120,19 @@ const useTableCellLayoutStyles_unstable = (state)=>{
             medium: styles.mediaSmallAndMedium,
             'extra-small': styles.mediaExtraSmall
         };
+        // eslint-disable-next-line react-hooks/immutability
         state.media.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.media, styles.media, mediaSizedStyles[state.size], primary && styles.mediaPrimary, state.media.className);
     }
     if (state.main) {
+        // eslint-disable-next-line react-hooks/immutability
         state.main.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.main, truncate && styles.mainTruncate, primary && styles.mainPrimary, state.main.className);
     }
     if (state.description) {
+        // eslint-disable-next-line react-hooks/immutability
         state.description.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.description, styles.description, state.description.className);
     }
     if (state.content) {
+        // eslint-disable-next-line react-hooks/immutability
         state.content.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.content, styles.content, truncate && styles.contentTruncate, state.content.className);
     }
     return state;