@fluentui/react-table 9.17.7 → 9.18.0

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    tableHeaderCellClassName: function() {
+        return tableHeaderCellClassName;
+    },
+    tableHeaderCellClassNames: function() {
+        return tableHeaderCellClassNames;
+    },
+    useTableHeaderCellStyles_unstable: function() {
+        return useTableHeaderCellStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _reacttabster = require("@fluentui/react-tabster");
+const tableHeaderCellClassName = 'fui-TableHeaderCell';
+const tableHeaderCellClassNames = {
+    root: 'fui-TableHeaderCell',
+    button: 'fui-TableHeaderCell__button',
+    sortIcon: 'fui-TableHeaderCell__sortIcon',
+    aside: 'fui-TableHeaderCell__aside'
+};
+const useTableLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'table-cell',
+        verticalAlign: 'middle'
+    }
+});
+const useFlexLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'flex',
+        flex: '1 1 0px',
+        minWidth: '0px'
+    }
+});
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        fontWeight: _reacttheme.tokens.fontWeightRegular,
+        padding: `0px ${_reacttheme.tokens.spacingHorizontalS}`,
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            outline: `2px solid ${_reacttheme.tokens.colorStrokeFocus2}`,
+            borderRadius: _reacttheme.tokens.borderRadiusMedium
+        }, {
+            selector: 'focus-within'
+        }),
+        position: 'relative'
+    },
+    rootInteractive: {
+        ':hover': {
+            color: _reacttheme.tokens.colorNeutralForeground1Hover,
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundHover
+        },
+        ':active': {
+            color: _reacttheme.tokens.colorNeutralForeground1Pressed,
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundPressed
+        }
+    },
+    resetButton: {
+        resize: 'horizontal',
+        boxSizing: 'content-box',
+        backgroundColor: 'inherit',
+        color: 'inherit',
+        fontFamily: 'inherit',
+        fontSize: 'inherit',
+        lineHeight: 'normal',
+        overflow: 'visible',
+        padding: '0',
+        border: 'none',
+        textAlign: 'unset'
+    },
+    button: {
+        position: 'relative',
+        width: '100%',
+        display: 'flex',
+        flexGrow: 1,
+        height: '100%',
+        alignItems: 'center',
+        gap: _reacttheme.tokens.spacingHorizontalXS,
+        minHeight: '32px',
+        flex: '1 1 0px',
+        outlineStyle: 'none'
+    },
+    sortable: {
+        cursor: 'pointer'
+    },
+    sortIcon: {
+        display: 'flex',
+        alignItems: 'center',
+        paddingTop: _reacttheme.tokens.spacingVerticalXXS
+    },
+    resizeHandle: {}
+});
+const useTableHeaderCellStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    const layoutStyles = {
+        table: useTableLayoutStyles(),
+        flex: useFlexLayoutStyles()
+    };
+    state.root.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.root, styles.root, state.sortable && styles.rootInteractive, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
+    state.button.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);
+    if (state.sortIcon) {
+        state.sortIcon.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);
+    }
+    if (state.aside) {
+        state.aside.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);
+    }
+    return state;
+};

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TableHeaderCell/useTableHeaderCellStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { TableHeaderCellSlots, TableHeaderCellState } from './TableHeaderCell.types';\n\nexport const tableHeaderCellClassName = 'fui-TableHeaderCell';\nexport const tableHeaderCellClassNames: SlotClassNames<TableHeaderCellSlots> = {\n  root: 'fui-TableHeaderCell',\n  button: 'fui-TableHeaderCell__button',\n  sortIcon: 'fui-TableHeaderCell__sortIcon',\n  aside: 'fui-TableHeaderCell__aside',\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-cell',\n    verticalAlign: 'middle',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flex: '1 1 0px',\n    minWidth: '0px',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    fontWeight: tokens.fontWeightRegular,\n    padding: `0px ${tokens.spacingHorizontalS}`,\n    ...createCustomFocusIndicatorStyle(\n      { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n      { selector: 'focus-within' },\n    ),\n    position: 'relative',\n  },\n\n  rootInteractive: {\n    ':hover': {\n      color: tokens.colorNeutralForeground1Hover,\n      backgroundColor: tokens.colorSubtleBackgroundHover,\n    },\n    ':active': {\n      color: tokens.colorNeutralForeground1Pressed,\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n    },\n  },\n\n  resetButton: {\n    resize: 'horizontal',\n    boxSizing: 'content-box',\n    backgroundColor: 'inherit',\n    color: 'inherit',\n    fontFamily: 'inherit',\n    fontSize: 'inherit',\n    lineHeight: 'normal',\n    overflow: 'visible',\n    padding: '0',\n    border: 'none',\n    textAlign: 'unset',\n  },\n\n  button: {\n    position: 'relative',\n    width: '100%',\n    display: 'flex',\n    flexGrow: 1,\n    height: '100%',\n    alignItems: 'center',\n    gap: tokens.spacingHorizontalXS,\n    minHeight: '32px',\n    flex: '1 1 0px',\n    outlineStyle: 'none',\n  },\n\n  sortable: {\n    cursor: 'pointer',\n  },\n\n  sortIcon: {\n    display: 'flex',\n    alignItems: 'center',\n    paddingTop: tokens.spacingVerticalXXS,\n  },\n\n  resizeHandle: {},\n});\n\n/**\n * Apply styling to the TableHeaderCell slots based on the state\n */\nexport const useTableHeaderCellStyles_unstable = (state: TableHeaderCellState): TableHeaderCellState => {\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    tableHeaderCellClassNames.root,\n    styles.root,\n    state.sortable && styles.rootInteractive,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.root.className,\n  );\n\n  state.button.className = mergeClasses(\n    tableHeaderCellClassNames.button,\n    styles.resetButton,\n    styles.button,\n    state.sortable && styles.sortable,\n    state.button.className,\n  );\n\n  if (state.sortIcon) {\n    state.sortIcon.className = mergeClasses(\n      tableHeaderCellClassNames.sortIcon,\n      styles.sortIcon,\n      state.sortIcon.className,\n    );\n  }\n\n  if (state.aside) {\n    state.aside.className = mergeClasses(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);\n  }\n\n  return state;\n};\n"],"names":["tableHeaderCellClassName","tableHeaderCellClassNames","useTableHeaderCellStyles_unstable","root","button","sortIcon","aside","useTableLayoutStyles","makeStyles","display","verticalAlign","useFlexLayoutStyles","flex","minWidth","useStyles","fontWeight","tokens","fontWeightRegular","padding","spacingHorizontalS","createCustomFocusIndicatorStyle","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","position","rootInteractive","color","colorNeutralForeground1Hover","backgroundColor","colorSubtleBackgroundHover","colorNeutralForeground1Pressed","colorSubtleBackgroundPressed","resetButton","resize","boxSizing","fontFamily","fontSize","lineHeight","overflow","border","textAlign","width","flexGrow","height","alignItems","gap","spacingHorizontalXS","minHeight","outlineStyle","sortable","cursor","paddingTop","spacingVerticalXXS","resizeHandle","state","styles","layoutStyles","table","className","mergeClasses","noNativeElements"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    tableResizeHandleClassNames: function() {
+        return tableResizeHandleClassNames;
+    },
+    useTableResizeHandleStyles_unstable: function() {
+        return useTableResizeHandleStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const tableResizeHandleClassNames = {
+    root: 'fui-TableResizeHandle'
+};
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        position: 'absolute',
+        right: 0,
+        top: 0,
+        bottom: 0,
+        width: '16px',
+        margin: '0 -8px',
+        cursor: 'col-resize',
+        opacity: 0,
+        transitionProperty: 'opacity',
+        transitionDuration: '.2s',
+        zIndex: 1,
+        // If mouse users focus on the resize handle through a context menu, we want the handle
+        // to be visible because the mouse might not be hovering over the handle
+        ':focus': {
+            opacity: 1,
+            outlineStyle: 'none'
+        },
+        ':hover': {
+            opacity: 1
+        },
+        '::after': {
+            content: '" "',
+            display: 'block',
+            width: '1px',
+            position: 'absolute',
+            left: '50%',
+            top: 0,
+            bottom: 0,
+            backgroundColor: _reacttheme.tokens.colorNeutralStroke1
+        }
+    }
+});
+const useTableResizeHandleStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(tableResizeHandleClassNames.root, styles.root, state.root.className);
+    return state;
+};

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TableResizeHandle/useTableResizeHandleStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableResizeHandleSlots, TableResizeHandleState } from './TableResizeHandle.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const tableResizeHandleClassNames: SlotClassNames<TableResizeHandleSlots> = {\n  root: 'fui-TableResizeHandle',\n  // TODO: add class names for all slots on TableResizeHandleSlots.\n  // Should be of the form `<slotName>: 'fui-TableResizeHandle__<slotName>`\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    position: 'absolute',\n    right: 0,\n    top: 0,\n    bottom: 0,\n    width: '16px',\n    margin: '0 -8px',\n    cursor: 'col-resize',\n    opacity: 0,\n    transitionProperty: 'opacity',\n    transitionDuration: '.2s',\n    zIndex: 1,\n\n    // If mouse users focus on the resize handle through a context menu, we want the handle\n    // to be visible because the mouse might not be hovering over the handle\n    ':focus': {\n      opacity: 1,\n      outlineStyle: 'none',\n    },\n\n    ':hover': {\n      opacity: 1,\n    },\n\n    '::after': {\n      content: '\" \"',\n      display: 'block',\n      width: '1px',\n      position: 'absolute',\n      left: '50%',\n      top: 0,\n      bottom: 0,\n      backgroundColor: tokens.colorNeutralStroke1,\n    },\n  },\n});\n\n/**\n * Apply styling to the TableResizeHandle slots based on the state\n */\nexport const useTableResizeHandleStyles_unstable = (state: TableResizeHandleState): TableResizeHandleState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(tableResizeHandleClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"names":["tableResizeHandleClassNames","useTableResizeHandleStyles_unstable","root","useStyles","makeStyles","position","right","top","bottom","width","margin","cursor","opacity","transitionProperty","transitionDuration","zIndex","outlineStyle","content","display","left","backgroundColor","tokens","colorNeutralStroke1","state","styles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,2BAAAA;eAAAA;;IAkDAC,mCAAAA;eAAAA;;;uBAvD4B;4BAGlB;AAEhB,MAAMD,8BAAsE;IACjFE,MAAM;AAGR;AAEA;;CAEC,GACD,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BF,MAAM;QACJG,UAAU;QACVC,OAAO;QACPC,KAAK;QACLC,QAAQ;QACRC,OAAO;QACPC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,oBAAoB;QACpBC,oBAAoB;QACpBC,QAAQ;QAER,uFAAuF;QACvF,wEAAwE;QACxE,UAAU;YACRH,SAAS;YACTI,cAAc;QAChB;QAEA,UAAU;YACRJ,SAAS;QACX;QAEA,WAAW;YACTK,SAAS;YACTC,SAAS;YACTT,OAAO;YACPJ,UAAU;YACVc,MAAM;YACNZ,KAAK;YACLC,QAAQ;YACRY,iBAAiBC,kBAAAA,CAAOC,mBAAmB;QAC7C;IACF;AACF;AAKO,MAAMrB,sCAAsC,CAACsB;IAClD;IAEA,MAAMC,SAASrB;IACfoB,MAAMrB,IAAI,CAACuB,SAAS,GAAGC,IAAAA,mBAAAA,EAAa1B,4BAA4BE,IAAI,EAAEsB,OAAOtB,IAAI,EAAEqB,MAAMrB,IAAI,CAACuB,SAAS;IACvG,OAAOF;AACT"}

package/lib-commonjs/components/TableRow/useTableRowStyles.styles.raw.js

@@ -0,0 +1,156 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    tableRowClassName: function() {
+        return tableRowClassName;
+    },
+    tableRowClassNames: function() {
+        return tableRowClassNames;
+    },
+    useTableRowStyles_unstable: function() {
+        return useTableRowStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _useTableCellActionsStylesstyles = require("../TableCellActions/useTableCellActionsStyles.styles");
+const _useTableSelectionCellStylesstyles = require("../TableSelectionCell/useTableSelectionCellStyles.styles");
+const _reacttabster = require("@fluentui/react-tabster");
+const tableRowClassName = 'fui-TableRow';
+const tableRowClassNames = {
+    root: tableRowClassName
+};
+const useTableLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'table-row'
+    }
+});
+const useFlexLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'flex',
+        alignItems: 'center'
+    }
+});
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        color: _reacttheme.tokens.colorNeutralForeground1,
+        boxSizing: 'border-box',
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            [`& .${_useTableSelectionCellStylesstyles.tableSelectionCellClassNames.root}`]: {
+                opacity: 1
+            },
+            [`& .${_useTableCellActionsStylesstyles.tableCellActionsClassNames.root}`]: {
+                opacity: 1
+            }
+        }, {
+            selector: 'focus-within'
+        }),
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            outline: `2px solid ${_reacttheme.tokens.colorStrokeFocus2}`,
+            borderRadius: _reacttheme.tokens.borderRadiusMedium
+        }, {
+            selector: 'focus'
+        })
+    },
+    rootInteractive: {
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            [`& .${_useTableCellActionsStylesstyles.tableCellActionsClassNames.root}`]: {
+                opacity: 1
+            }
+        }, {
+            selector: 'focus-within'
+        }),
+        ':active': {
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundPressed,
+            color: _reacttheme.tokens.colorNeutralForeground1Pressed,
+            [`& .${_useTableCellActionsStylesstyles.tableCellActionsClassNames.root}`]: {
+                opacity: 1
+            },
+            [`& .${_useTableSelectionCellStylesstyles.tableSelectionCellClassNames.root}`]: {
+                opacity: 1
+            }
+        },
+        ':hover': {
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundHover,
+            color: _reacttheme.tokens.colorNeutralForeground1Hover,
+            [`& .${_useTableCellActionsStylesstyles.tableCellActionsClassNames.root}`]: {
+                opacity: 1
+            },
+            [`& .${_useTableSelectionCellStylesstyles.tableSelectionCellClassNames.root}`]: {
+                opacity: 1
+            }
+        },
+        // High contrast styles
+        '@media (forced-colors: active)': {
+            ':hover': {
+                color: 'Highlight',
+                ..._react.shorthands.borderColor('Highlight')
+            }
+        }
+    },
+    medium: {
+        borderBottom: `${_reacttheme.tokens.strokeWidthThin} solid ${_reacttheme.tokens.colorNeutralStroke2}`
+    },
+    small: {
+        borderBottom: `${_reacttheme.tokens.strokeWidthThin} solid ${_reacttheme.tokens.colorNeutralStroke2}`
+    },
+    'extra-small': {
+        fontSize: _reacttheme.tokens.fontSizeBase200
+    },
+    brand: {
+        backgroundColor: _reacttheme.tokens.colorBrandBackground2,
+        ..._react.shorthands.borderColor(_reacttheme.tokens.colorTransparentStrokeInteractive),
+        ':active': {
+            backgroundColor: _reacttheme.tokens.colorBrandBackground2,
+            color: _reacttheme.tokens.colorNeutralForeground1
+        },
+        '@media(forced-colors: active)': {
+            border: '2px solid transparent',
+            borderRadius: _reacttheme.tokens.borderRadiusMedium,
+            boxSizing: 'border-box',
+            ':focus-visible': {
+                outlineOffset: '-4px'
+            }
+        }
+    },
+    neutral: {
+        '@media(forced-colors: active)': {
+            border: '2px solid transparent',
+            borderRadius: _reacttheme.tokens.borderRadiusMedium,
+            boxSizing: 'border-box',
+            ':focus-visible': {
+                outlineOffset: '-4px'
+            }
+        },
+        backgroundColor: _reacttheme.tokens.colorSubtleBackgroundSelected,
+        color: _reacttheme.tokens.colorNeutralForeground1Hover,
+        ':hover': {
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundSelected
+        },
+        ':active': {
+            backgroundColor: _reacttheme.tokens.colorSubtleBackgroundSelected
+        },
+        ..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStrokeOnBrand)
+    },
+    none: {}
+});
+const useTableRowStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    const layoutStyles = {
+        table: useTableLayoutStyles(),
+        flex: useFlexLayoutStyles()
+    };
+    state.root.className = (0, _react.mergeClasses)(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.root.className);
+    return state;
+};

package/lib-commonjs/components/TableRow/useTableRowStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TableRow/useTableRowStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableRowSlots, TableRowState } from './TableRow.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\n\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames: SlotClassNames<TableRowSlots> = {\n  root: tableRowClassName,\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-row',\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    color: tokens.colorNeutralForeground1,\n    boxSizing: 'border-box',\n    ...createCustomFocusIndicatorStyle(\n      {\n        [`& .${tableSelectionCellClassNames.root}`]: {\n          opacity: 1,\n        },\n        [`& .${tableCellActionsClassNames.root}`]: {\n          opacity: 1,\n        },\n      },\n      { selector: 'focus-within' },\n    ),\n    ...createCustomFocusIndicatorStyle(\n      { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n      { selector: 'focus' },\n    ),\n  },\n\n  rootInteractive: {\n    ...createCustomFocusIndicatorStyle(\n      {\n        [`& .${tableCellActionsClassNames.root}`]: {\n          opacity: 1,\n        },\n      },\n      { selector: 'focus-within' },\n    ),\n    ':active': {\n      backgroundColor: tokens.colorSubtleBackgroundPressed,\n      color: tokens.colorNeutralForeground1Pressed,\n      [`& .${tableCellActionsClassNames.root}`]: {\n        opacity: 1,\n      },\n      [`& .${tableSelectionCellClassNames.root}`]: {\n        opacity: 1,\n      },\n    },\n    ':hover': {\n      backgroundColor: tokens.colorSubtleBackgroundHover,\n      color: tokens.colorNeutralForeground1Hover,\n      [`& .${tableCellActionsClassNames.root}`]: {\n        opacity: 1,\n      },\n      [`& .${tableSelectionCellClassNames.root}`]: {\n        opacity: 1,\n      },\n    },\n    // High contrast styles\n    '@media (forced-colors: active)': {\n      ':hover': {\n        color: 'Highlight',\n        ...shorthands.borderColor('Highlight'),\n      },\n    },\n  },\n\n  medium: { borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}` },\n\n  small: { borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}` },\n\n  'extra-small': {\n    fontSize: tokens.fontSizeBase200,\n  },\n\n  brand: {\n    backgroundColor: tokens.colorBrandBackground2,\n    ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n    ':active': {\n      backgroundColor: tokens.colorBrandBackground2,\n      color: tokens.colorNeutralForeground1,\n    },\n\n    '@media(forced-colors: active)': {\n      border: '2px solid transparent',\n      borderRadius: tokens.borderRadiusMedium,\n      boxSizing: 'border-box',\n      ':focus-visible': {\n        outlineOffset: '-4px',\n      },\n    },\n  },\n\n  neutral: {\n    '@media(forced-colors: active)': {\n      border: '2px solid transparent',\n      borderRadius: tokens.borderRadiusMedium,\n      boxSizing: 'border-box',\n      ':focus-visible': {\n        outlineOffset: '-4px',\n      },\n    },\n    backgroundColor: tokens.colorSubtleBackgroundSelected,\n    color: tokens.colorNeutralForeground1Hover,\n    ':hover': {\n      backgroundColor: tokens.colorSubtleBackgroundSelected,\n    },\n    ':active': {\n      backgroundColor: tokens.colorSubtleBackgroundSelected,\n    },\n\n    ...shorthands.borderColor(tokens.colorNeutralStrokeOnBrand),\n  },\n\n  none: {},\n});\n\n/**\n * Apply styling to the TableRow slots based on the state\n */\nexport const useTableRowStyles_unstable = (state: TableRowState): TableRowState => {\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    tableRowClassNames.root,\n    styles.root,\n    !state.isHeaderRow && styles.rootInteractive,\n    styles[state.size],\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    styles[state.appearance],\n    state.root.className,\n  );\n\n  return state;\n};\n"],"names":["tableRowClassName","tableRowClassNames","useTableRowStyles_unstable","root","useTableLayoutStyles","makeStyles","display","useFlexLayoutStyles","alignItems","useStyles","color","tokens","colorNeutralForeground1","boxSizing","createCustomFocusIndicatorStyle","tableSelectionCellClassNames","opacity","tableCellActionsClassNames","selector","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","rootInteractive","backgroundColor","colorSubtleBackgroundPressed","colorNeutralForeground1Pressed","colorSubtleBackgroundHover","colorNeutralForeground1Hover","shorthands","borderColor","medium","borderBottom","strokeWidthThin","colorNeutralStroke2","small","fontSize","fontSizeBase200","brand","colorBrandBackground2","colorTransparentStrokeInteractive","border","outlineOffset","neutral","colorSubtleBackgroundSelected","colorNeutralStrokeOnBrand","none","state","styles","layoutStyles","table","flex","className","mergeClasses","isHeaderRow","size","noNativeElements","appearance"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    CELL_WIDTH: function() {
+        return CELL_WIDTH;
+    },
+    tableSelectionCellClassNames: function() {
+        return tableSelectionCellClassNames;
+    },
+    useTableSelectionCellStyles_unstable: function() {
+        return useTableSelectionCellStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttabster = require("@fluentui/react-tabster");
+const _reacttheme = require("@fluentui/react-theme");
+const CELL_WIDTH = 44;
+const tableSelectionCellClassNames = {
+    root: 'fui-TableSelectionCell',
+    checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',
+    radioIndicator: 'fui-TableSelectionCell__radioIndicator'
+};
+const useTableLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'table-cell',
+        width: `${CELL_WIDTH}px`
+    }
+});
+const useFlexLayoutStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'flex',
+        flex: '1 1 0px',
+        minWidth: `${CELL_WIDTH}px`,
+        maxWidth: `${CELL_WIDTH}px`,
+        justifyContent: 'center'
+    }
+});
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _react.makeStyles)({
+    root: {
+        textAlign: 'center',
+        whiteSpace: 'nowrap',
+        padding: '0',
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            outline: `2px solid ${_reacttheme.tokens.colorStrokeFocus2}`,
+            borderRadius: _reacttheme.tokens.borderRadiusMedium
+        }, {
+            selector: 'focus'
+        })
+    },
+    radioIndicator: {
+        display: 'flex',
+        flexGrow: 1,
+        alignItems: 'center',
+        justifyContent: 'center'
+    },
+    subtle: {
+        opacity: 0,
+        ...(0, _reacttabster.createCustomFocusIndicatorStyle)({
+            opacity: 1
+        }, {
+            selector: 'focus-within'
+        })
+    },
+    hidden: {
+        opacity: 0
+    }
+});
+const useTableSelectionCellStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    const layoutStyles = {
+        table: useTableLayoutStyles(),
+        flex: useFlexLayoutStyles()
+    };
+    state.root.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.subtle && state.checked === false && styles.subtle, state.hidden && styles.hidden, state.root.className);
+    if (state.checkboxIndicator) {
+        state.checkboxIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);
+    }
+    if (state.radioIndicator) {
+        state.radioIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.radioIndicator, styles.radioIndicator, state.radioIndicator.className);
+    }
+    return state;
+};

package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TableSelectionCell/useTableSelectionCellStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableSelectionCellSlots, TableSelectionCellState } from './TableSelectionCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const CELL_WIDTH = 44;\n\nexport const tableSelectionCellClassNames: SlotClassNames<TableSelectionCellSlots> = {\n  root: 'fui-TableSelectionCell',\n  checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',\n  radioIndicator: 'fui-TableSelectionCell__radioIndicator',\n};\n\nconst useTableLayoutStyles = makeStyles({\n  root: {\n    display: 'table-cell',\n    width: `${CELL_WIDTH}px`,\n  },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flex: '1 1 0px',\n    minWidth: `${CELL_WIDTH}px`,\n    maxWidth: `${CELL_WIDTH}px`,\n    justifyContent: 'center',\n  },\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    textAlign: 'center',\n    whiteSpace: 'nowrap',\n    padding: '0',\n    ...createCustomFocusIndicatorStyle(\n      { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n      { selector: 'focus' },\n    ),\n  },\n\n  radioIndicator: {\n    display: 'flex',\n    flexGrow: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n\n  subtle: {\n    opacity: 0,\n    ...createCustomFocusIndicatorStyle(\n      {\n        opacity: 1,\n      },\n      { selector: 'focus-within' },\n    ),\n  },\n\n  hidden: {\n    opacity: 0,\n  },\n});\n\n/**\n * Apply styling to the TableSelectionCell slots based on the state\n */\nexport const useTableSelectionCellStyles_unstable = (state: TableSelectionCellState): TableSelectionCellState => {\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    tableSelectionCellClassNames.root,\n    styles.root,\n    state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n    state.subtle && state.checked === false && styles.subtle,\n    state.hidden && styles.hidden,\n    state.root.className,\n  );\n  if (state.checkboxIndicator) {\n    state.checkboxIndicator.className = mergeClasses(\n      tableSelectionCellClassNames.checkboxIndicator,\n      state.checkboxIndicator.className,\n    );\n  }\n\n  if (state.radioIndicator) {\n    state.radioIndicator.className = mergeClasses(\n      tableSelectionCellClassNames.radioIndicator,\n      styles.radioIndicator,\n      state.radioIndicator.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["CELL_WIDTH","tableSelectionCellClassNames","useTableSelectionCellStyles_unstable","root","checkboxIndicator","radioIndicator","useTableLayoutStyles","makeStyles","display","width","useFlexLayoutStyles","flex","minWidth","maxWidth","justifyContent","useStyles","textAlign","whiteSpace","padding","createCustomFocusIndicatorStyle","outline","tokens","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","flexGrow","alignItems","subtle","opacity","hidden","state","styles","layoutStyles","table","className","mergeClasses","noNativeElements","checked"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAMaA,UAAAA;eAAAA;;IAEAC,4BAAAA;eAAAA;;IA8DAC,oCAAAA;eAAAA;;;uBAtE4B;8BAGO;4BACzB;AAEhB,MAAMF,aAAa;AAEnB,MAAMC,+BAAwE;IACnFE,MAAM;IACNC,mBAAmB;IACnBC,gBAAgB;AAClB;AAEA,MAAMC,uBAAuBC,IAAAA,iBAAAA,EAAW;IACtCJ,MAAM;QACJK,SAAS;QACTC,OAAO,CAAC,EAAET,WAAW,EAAE,CAAC;IAC1B;AACF;AAEA,MAAMU,sBAAsBH,IAAAA,iBAAAA,EAAW;IACrCJ,MAAM;QACJK,SAAS;QACTG,MAAM;QACNC,UAAU,CAAC,EAAEZ,WAAW,EAAE,CAAC;QAC3Ba,UAAU,CAAC,EAAEb,WAAW,EAAE,CAAC;QAC3Bc,gBAAgB;IAClB;AACF;AAEA;;CAEC,GACD,MAAMC,YAAYR,IAAAA,iBAAAA,EAAW;IAC3BJ,MAAM;QACJa,WAAW;QACXC,YAAY;QACZC,SAAS;QACT,GAAGC,IAAAA,6CAAAA,EACD;YAAEC,SAAS,CAAC,UAAU,EAAEC,kBAAAA,CAAOC,iBAAiB,CAAC,CAAC;YAAEC,cAAcF,kBAAAA,CAAOG,kBAAkB;QAAC,GAC5F;YAAEC,UAAU;QAAQ,EACrB;IACH;IAEApB,gBAAgB;QACdG,SAAS;QACTkB,UAAU;QACVC,YAAY;QACZb,gBAAgB;IAClB;IAEAc,QAAQ;QACNC,SAAS;QACT,GAAGV,IAAAA,6CAAAA,EACD;YACEU,SAAS;QACX,GACA;YAAEJ,UAAU;QAAe,EAC5B;IACH;IAEAK,QAAQ;QACND,SAAS;IACX;AACF;AAKO,MAAM3B,uCAAuC,CAAC6B;IACnD;IAEA,MAAMC,SAASjB;IACf,MAAMkB,eAAe;QACnBC,OAAO5B;QACPK,MAAMD;IACR;IACAqB,MAAM5B,IAAI,CAACgC,SAAS,GAAGC,IAAAA,mBAAAA,EACrBnC,6BAA6BE,IAAI,EACjC6B,OAAO7B,IAAI,EACX4B,MAAMM,gBAAgB,GAAGJ,aAAatB,IAAI,CAACR,IAAI,GAAG8B,aAAaC,KAAK,CAAC/B,IAAI,EACzE4B,MAAMH,MAAM,IAAIG,MAAMO,OAAO,KAAK,SAASN,OAAOJ,MAAM,EACxDG,MAAMD,MAAM,IAAIE,OAAOF,MAAM,EAC7BC,MAAM5B,IAAI,CAACgC,SAAS;IAEtB,IAAIJ,MAAM3B,iBAAiB,EAAE;QAC3B2B,MAAM3B,iBAAiB,CAAC+B,SAAS,GAAGC,IAAAA,mBAAAA,EAClCnC,6BAA6BG,iBAAiB,EAC9C2B,MAAM3B,iBAAiB,CAAC+B,SAAS;IAErC;IAEA,IAAIJ,MAAM1B,cAAc,EAAE;QACxB0B,MAAM1B,cAAc,CAAC8B,SAAS,GAAGC,IAAAA,mBAAAA,EAC/BnC,6BAA6BI,cAAc,EAC3C2B,OAAO3B,cAAc,EACrB0B,MAAM1B,cAAc,CAAC8B,SAAS;IAElC;IAEA,OAAOJ;AACT"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-table",
-  "version": "9.17.7",
+  "version": "9.18.0",
   "description": "React components for building web experiences",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -21,14 +21,14 @@
   },
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
-    "@fluentui/react-aria": "^9.15.3",
-    "@fluentui/react-avatar": "^9.8.7",
-    "@fluentui/react-checkbox": "^9.4.7",
+    "@fluentui/react-aria": "^9.15.4",
+    "@fluentui/react-avatar": "^9.9.0",
+    "@fluentui/react-checkbox": "^9.5.0",
     "@fluentui/react-context-selector": "^9.2.2",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-radio": "^9.4.7",
+    "@fluentui/react-radio": "^9.5.0",
     "@fluentui/react-shared-contexts": "^9.24.0",
-    "@fluentui/react-tabster": "^9.25.3",
+    "@fluentui/react-tabster": "^9.26.0",
     "@fluentui/react-theme": "^9.1.24",
     "@fluentui/react-utilities": "^9.22.0",
     "@fluentui/react-jsx-runtime": "^9.1.2",