@fluentui/react-table 9.19.15 → 9.19.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (162) hide show
  1. package/CHANGELOG.md +43 -10
  2. package/lib/components/DataGrid/useDataGridStyles.styles.js +1 -2
  3. package/lib/components/DataGrid/useDataGridStyles.styles.js.map +1 -1
  4. package/lib/components/DataGrid/useDataGridStyles.styles.raw.js +1 -1
  5. package/lib/components/DataGrid/useDataGridStyles.styles.raw.js.map +1 -1
  6. package/lib/components/DataGridBody/useDataGridBodyStyles.styles.js +1 -2
  7. package/lib/components/DataGridBody/useDataGridBodyStyles.styles.js.map +1 -1
  8. package/lib/components/DataGridBody/useDataGridBodyStyles.styles.raw.js +1 -1
  9. package/lib/components/DataGridBody/useDataGridBodyStyles.styles.raw.js.map +1 -1
  10. package/lib/components/DataGridCell/useDataGridCellStyles.styles.js +1 -2
  11. package/lib/components/DataGridCell/useDataGridCellStyles.styles.js.map +1 -1
  12. package/lib/components/DataGridCell/useDataGridCellStyles.styles.raw.js +1 -1
  13. package/lib/components/DataGridCell/useDataGridCellStyles.styles.raw.js.map +1 -1
  14. package/lib/components/DataGridHeader/useDataGridHeaderStyles.styles.js +1 -2
  15. package/lib/components/DataGridHeader/useDataGridHeaderStyles.styles.js.map +1 -1
  16. package/lib/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js +1 -1
  17. package/lib/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js.map +1 -1
  18. package/lib/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js +4 -2
  19. package/lib/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js.map +1 -1
  20. package/lib/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js +4 -1
  21. package/lib/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js.map +1 -1
  22. package/lib/components/DataGridRow/useDataGridRow.js +1 -0
  23. package/lib/components/DataGridRow/useDataGridRow.js.map +1 -1
  24. package/lib/components/DataGridRow/useDataGridRowStyles.styles.js +2 -2
  25. package/lib/components/DataGridRow/useDataGridRowStyles.styles.js.map +1 -1
  26. package/lib/components/DataGridRow/useDataGridRowStyles.styles.raw.js +2 -1
  27. package/lib/components/DataGridRow/useDataGridRowStyles.styles.raw.js.map +1 -1
  28. package/lib/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js +3 -2
  29. package/lib/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js.map +1 -1
  30. package/lib/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js +3 -1
  31. package/lib/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js.map +1 -1
  32. package/lib/components/Table/useTableStyles.styles.js +1 -2
  33. package/lib/components/Table/useTableStyles.styles.js.map +1 -1
  34. package/lib/components/Table/useTableStyles.styles.raw.js +1 -1
  35. package/lib/components/Table/useTableStyles.styles.raw.js.map +1 -1
  36. package/lib/components/TableBody/useTableBodyStyles.styles.js +1 -2
  37. package/lib/components/TableBody/useTableBodyStyles.styles.js.map +1 -1
  38. package/lib/components/TableBody/useTableBodyStyles.styles.raw.js +1 -1
  39. package/lib/components/TableBody/useTableBodyStyles.styles.raw.js.map +1 -1
  40. package/lib/components/TableCell/useTableCellStyles.styles.js +1 -2
  41. package/lib/components/TableCell/useTableCellStyles.styles.js.map +1 -1
  42. package/lib/components/TableCell/useTableCellStyles.styles.raw.js +1 -1
  43. package/lib/components/TableCell/useTableCellStyles.styles.raw.js.map +1 -1
  44. package/lib/components/TableCellActions/useTableCellActionsStyles.styles.js +1 -2
  45. package/lib/components/TableCellActions/useTableCellActionsStyles.styles.js.map +1 -1
  46. package/lib/components/TableCellActions/useTableCellActionsStyles.styles.raw.js +1 -1
  47. package/lib/components/TableCellActions/useTableCellActionsStyles.styles.raw.js.map +1 -1
  48. package/lib/components/TableCellLayout/useTableCellLayoutStyles.styles.js +5 -2
  49. package/lib/components/TableCellLayout/useTableCellLayoutStyles.styles.js.map +1 -1
  50. package/lib/components/TableCellLayout/useTableCellLayoutStyles.styles.raw.js +5 -1
  51. package/lib/components/TableCellLayout/useTableCellLayoutStyles.styles.raw.js.map +1 -1
  52. package/lib/components/TableHeader/useTableHeaderStyles.styles.js +1 -2
  53. package/lib/components/TableHeader/useTableHeaderStyles.styles.js.map +1 -1
  54. package/lib/components/TableHeader/useTableHeaderStyles.styles.raw.js +1 -1
  55. package/lib/components/TableHeader/useTableHeaderStyles.styles.raw.js.map +1 -1
  56. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.styles.js +4 -2
  57. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.styles.js.map +1 -1
  58. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js +4 -1
  59. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js.map +1 -1
  60. package/lib/components/TableResizeHandle/useTableResizeHandleStyles.styles.js +1 -2
  61. package/lib/components/TableResizeHandle/useTableResizeHandleStyles.styles.js.map +1 -1
  62. package/lib/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js +1 -1
  63. package/lib/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js.map +1 -1
  64. package/lib/components/TableRow/useTableRowStyles.styles.js +1 -2
  65. package/lib/components/TableRow/useTableRowStyles.styles.js.map +1 -1
  66. package/lib/components/TableRow/useTableRowStyles.styles.raw.js +1 -1
  67. package/lib/components/TableRow/useTableRowStyles.styles.raw.js.map +1 -1
  68. package/lib/components/TableSelectionCell/useTableSelectionCellStyles.styles.js +3 -2
  69. package/lib/components/TableSelectionCell/useTableSelectionCellStyles.styles.js.map +1 -1
  70. package/lib/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js +3 -1
  71. package/lib/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js.map +1 -1
  72. package/lib/hooks/useTableColumnResizeMouseHandler.js +1 -0
  73. package/lib/hooks/useTableColumnResizeMouseHandler.js.map +1 -1
  74. package/lib/hooks/useTableColumnSizing.js +0 -1
  75. package/lib/hooks/useTableColumnSizing.js.map +1 -1
  76. package/lib/hooks/useTableFeatures.js +1 -0
  77. package/lib/hooks/useTableFeatures.js.map +1 -1
  78. package/lib/hooks/useTableSelection.js +0 -1
  79. package/lib/hooks/useTableSelection.js.map +1 -1
  80. package/lib/hooks/useTableSort.js +0 -1
  81. package/lib/hooks/useTableSort.js.map +1 -1
  82. package/lib-commonjs/components/DataGrid/useDataGridStyles.styles.js +1 -1
  83. package/lib-commonjs/components/DataGrid/useDataGridStyles.styles.js.map +1 -1
  84. package/lib-commonjs/components/DataGrid/useDataGridStyles.styles.raw.js +1 -1
  85. package/lib-commonjs/components/DataGrid/useDataGridStyles.styles.raw.js.map +1 -1
  86. package/lib-commonjs/components/DataGridBody/useDataGridBodyStyles.styles.js +1 -1
  87. package/lib-commonjs/components/DataGridBody/useDataGridBodyStyles.styles.js.map +1 -1
  88. package/lib-commonjs/components/DataGridBody/useDataGridBodyStyles.styles.raw.js +1 -1
  89. package/lib-commonjs/components/DataGridBody/useDataGridBodyStyles.styles.raw.js.map +1 -1
  90. package/lib-commonjs/components/DataGridCell/useDataGridCellStyles.styles.js +1 -1
  91. package/lib-commonjs/components/DataGridCell/useDataGridCellStyles.styles.js.map +1 -1
  92. package/lib-commonjs/components/DataGridCell/useDataGridCellStyles.styles.raw.js +1 -1
  93. package/lib-commonjs/components/DataGridCell/useDataGridCellStyles.styles.raw.js.map +1 -1
  94. package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.js +1 -1
  95. package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.js.map +1 -1
  96. package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js +1 -1
  97. package/lib-commonjs/components/DataGridHeader/useDataGridHeaderStyles.styles.raw.js.map +1 -1
  98. package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js +4 -1
  99. package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.js.map +1 -1
  100. package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js +4 -1
  101. package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCellStyles.styles.raw.js.map +1 -1
  102. package/lib-commonjs/components/DataGridRow/useDataGridRow.js +1 -0
  103. package/lib-commonjs/components/DataGridRow/useDataGridRow.js.map +1 -1
  104. package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js +2 -1
  105. package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js.map +1 -1
  106. package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js +2 -1
  107. package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js.map +1 -1
  108. package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js +3 -1
  109. package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.js.map +1 -1
  110. package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js +3 -1
  111. package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCellStyles.styles.raw.js.map +1 -1
  112. package/lib-commonjs/components/Table/useTableStyles.styles.js +1 -1
  113. package/lib-commonjs/components/Table/useTableStyles.styles.js.map +1 -1
  114. package/lib-commonjs/components/Table/useTableStyles.styles.raw.js +1 -1
  115. package/lib-commonjs/components/Table/useTableStyles.styles.raw.js.map +1 -1
  116. package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.js +1 -1
  117. package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.js.map +1 -1
  118. package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.raw.js +1 -1
  119. package/lib-commonjs/components/TableBody/useTableBodyStyles.styles.raw.js.map +1 -1
  120. package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js +1 -1
  121. package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js.map +1 -1
  122. package/lib-commonjs/components/TableCell/useTableCellStyles.styles.raw.js +1 -1
  123. package/lib-commonjs/components/TableCell/useTableCellStyles.styles.raw.js.map +1 -1
  124. package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.js +1 -1
  125. package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.js.map +1 -1
  126. package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.raw.js +1 -1
  127. package/lib-commonjs/components/TableCellActions/useTableCellActionsStyles.styles.raw.js.map +1 -1
  128. package/lib-commonjs/components/TableCellLayout/useTableCellLayoutStyles.styles.js +5 -1
  129. package/lib-commonjs/components/TableCellLayout/useTableCellLayoutStyles.styles.js.map +1 -1
  130. package/lib-commonjs/components/TableCellLayout/useTableCellLayoutStyles.styles.raw.js +5 -1
  131. package/lib-commonjs/components/TableCellLayout/useTableCellLayoutStyles.styles.raw.js.map +1 -1
  132. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.styles.js +1 -1
  133. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.styles.js.map +1 -1
  134. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.styles.raw.js +1 -1
  135. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.styles.raw.js.map +1 -1
  136. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.js +4 -1
  137. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.js.map +1 -1
  138. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js +4 -1
  139. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.styles.raw.js.map +1 -1
  140. package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.js +1 -1
  141. package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.js.map +1 -1
  142. package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js +1 -1
  143. package/lib-commonjs/components/TableResizeHandle/useTableResizeHandleStyles.styles.raw.js.map +1 -1
  144. package/lib-commonjs/components/TableRow/useTableRowStyles.styles.js +1 -1
  145. package/lib-commonjs/components/TableRow/useTableRowStyles.styles.js.map +1 -1
  146. package/lib-commonjs/components/TableRow/useTableRowStyles.styles.raw.js +1 -1
  147. package/lib-commonjs/components/TableRow/useTableRowStyles.styles.raw.js.map +1 -1
  148. package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.js +3 -1
  149. package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.js.map +1 -1
  150. package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js +3 -1
  151. package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js.map +1 -1
  152. package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js +1 -0
  153. package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js.map +1 -1
  154. package/lib-commonjs/hooks/useTableColumnSizing.js +0 -1
  155. package/lib-commonjs/hooks/useTableColumnSizing.js.map +1 -1
  156. package/lib-commonjs/hooks/useTableFeatures.js +1 -0
  157. package/lib-commonjs/hooks/useTableFeatures.js.map +1 -1
  158. package/lib-commonjs/hooks/useTableSelection.js +0 -1
  159. package/lib-commonjs/hooks/useTableSelection.js.map +1 -1
  160. package/lib-commonjs/hooks/useTableSort.js +0 -1
  161. package/lib-commonjs/hooks/useTableSort.js.map +1 -1
  162. package/package.json +9 -9
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableCellLayoutStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const tableCellLayoutClassNames = {\n root: 'fui-TableCellLayout',\n media: 'fui-TableCellLayout__media',\n main: 'fui-TableCellLayout__main',\n description: 'fui-TableCellLayout__description',\n content: 'fui-TableCellLayout__content'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n gap: tokens.spacingHorizontalS,\n flex: '1 1 0px'\n },\n rootTruncate: {\n overflowX: 'hidden'\n },\n content: {\n display: 'flex',\n flexDirection: 'column'\n },\n contentTruncate: {\n overflowX: 'hidden'\n },\n media: {\n display: 'flex',\n alignItems: 'center'\n },\n mediaExtraSmall: {\n fontSize: '16px'\n },\n mediaSmallAndMedium: {\n fontSize: '20px'\n },\n mediaPrimary: {\n fontSize: '24px'\n },\n mainPrimary: {\n fontWeight: tokens.fontWeightSemibold\n },\n mainTruncate: {\n overflowX: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis'\n },\n description: {\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1\n }\n});\n/**\n * Apply styling to the TableCellLayout slots based on the state\n */ export const useTableCellLayoutStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { truncate } = state;\n state.root.className = mergeClasses(tableCellLayoutClassNames.root, styles.root, truncate && styles.rootTruncate, state.root.className);\n const primary = state.appearance === 'primary';\n if (state.media) {\n const mediaSizedStyles = {\n small: styles.mediaSmallAndMedium,\n medium: styles.mediaSmallAndMedium,\n 'extra-small': styles.mediaExtraSmall\n };\n state.media.className = mergeClasses(tableCellLayoutClassNames.media, styles.media, mediaSizedStyles[state.size], primary && styles.mediaPrimary, state.media.className);\n }\n if (state.main) {\n state.main.className = mergeClasses(tableCellLayoutClassNames.main, truncate && styles.mainTruncate, primary && styles.mainPrimary, state.main.className);\n }\n if (state.description) {\n state.description.className = mergeClasses(tableCellLayoutClassNames.description, styles.description, state.description.className);\n }\n if (state.content) {\n state.content.className = mergeClasses(tableCellLayoutClassNames.content, styles.content, truncate && styles.contentTruncate, state.content.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","typographyStyles","tableCellLayoutClassNames","root","media","main","description","content","useStyles","mc9l5x","Bt984gj","i8kkvl","Belr9w4","rmohyg","xawz","Bh6795r","Bnnss6s","fkmc3a","rootTruncate","B68tc82","Beiy3e4","contentTruncate","mediaExtraSmall","Be2twd7","mediaSmallAndMedium","mediaPrimary","mainPrimary","Bhrd7zp","mainTruncate","Huce71","ygn44y","sj55zd","Bahqtrf","Bg96gwp","d","p","useTableCellLayoutStyles_unstable","state","styles","truncate","className","primary","appearance","mediaSizedStyles","small","medium","size"],"mappings":"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"}
1
+ {"version":3,"sources":["useTableCellLayoutStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { typographyStyles } from '@fluentui/react-theme';\nexport const tableCellLayoutClassNames = {\n root: 'fui-TableCellLayout',\n media: 'fui-TableCellLayout__media',\n main: 'fui-TableCellLayout__main',\n description: 'fui-TableCellLayout__description',\n content: 'fui-TableCellLayout__content'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n gap: tokens.spacingHorizontalS,\n flex: '1 1 0px'\n },\n rootTruncate: {\n overflowX: 'hidden'\n },\n content: {\n display: 'flex',\n flexDirection: 'column'\n },\n contentTruncate: {\n overflowX: 'hidden'\n },\n media: {\n display: 'flex',\n alignItems: 'center'\n },\n mediaExtraSmall: {\n fontSize: '16px'\n },\n mediaSmallAndMedium: {\n fontSize: '20px'\n },\n mediaPrimary: {\n fontSize: '24px'\n },\n mainPrimary: {\n fontWeight: tokens.fontWeightSemibold\n },\n mainTruncate: {\n overflowX: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis'\n },\n description: {\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1\n }\n});\n/**\n * Apply styling to the TableCellLayout slots based on the state\n */ export const useTableCellLayoutStyles_unstable = (state)=>{\n const styles = useStyles();\n const { truncate } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(tableCellLayoutClassNames.root, styles.root, truncate && styles.rootTruncate, state.root.className);\n const primary = state.appearance === 'primary';\n if (state.media) {\n const mediaSizedStyles = {\n small: styles.mediaSmallAndMedium,\n medium: styles.mediaSmallAndMedium,\n 'extra-small': styles.mediaExtraSmall\n };\n // eslint-disable-next-line react-hooks/immutability\n state.media.className = mergeClasses(tableCellLayoutClassNames.media, styles.media, mediaSizedStyles[state.size], primary && styles.mediaPrimary, state.media.className);\n }\n if (state.main) {\n // eslint-disable-next-line react-hooks/immutability\n state.main.className = mergeClasses(tableCellLayoutClassNames.main, truncate && styles.mainTruncate, primary && styles.mainPrimary, state.main.className);\n }\n if (state.description) {\n // eslint-disable-next-line react-hooks/immutability\n state.description.className = mergeClasses(tableCellLayoutClassNames.description, styles.description, state.description.className);\n }\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(tableCellLayoutClassNames.content, styles.content, truncate && styles.contentTruncate, state.content.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","typographyStyles","tableCellLayoutClassNames","root","media","main","description","content","useStyles","mc9l5x","Bt984gj","i8kkvl","Belr9w4","rmohyg","xawz","Bh6795r","Bnnss6s","fkmc3a","rootTruncate","B68tc82","Beiy3e4","contentTruncate","mediaExtraSmall","Be2twd7","mediaSmallAndMedium","mediaPrimary","mainPrimary","Bhrd7zp","mainTruncate","Huce71","ygn44y","sj55zd","Bahqtrf","Bg96gwp","d","p","useTableCellLayoutStyles_unstable","state","styles","truncate","className","primary","appearance","mediaSizedStyles","small","medium","size"],"mappings":"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"}
@@ -72,9 +72,9 @@ const tableCellLayoutClassNames = {
72
72
  }
73
73
  });
74
74
  const useTableCellLayoutStyles_unstable = (state)=>{
75
- 'use no memo';
76
75
  const styles = useStyles();
77
76
  const { truncate } = state;
77
+ // eslint-disable-next-line react-hooks/immutability
78
78
  state.root.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.root, styles.root, truncate && styles.rootTruncate, state.root.className);
79
79
  const primary = state.appearance === 'primary';
80
80
  if (state.media) {
@@ -83,15 +83,19 @@ const useTableCellLayoutStyles_unstable = (state)=>{
83
83
  medium: styles.mediaSmallAndMedium,
84
84
  'extra-small': styles.mediaExtraSmall
85
85
  };
86
+ // eslint-disable-next-line react-hooks/immutability
86
87
  state.media.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.media, styles.media, mediaSizedStyles[state.size], primary && styles.mediaPrimary, state.media.className);
87
88
  }
88
89
  if (state.main) {
90
+ // eslint-disable-next-line react-hooks/immutability
89
91
  state.main.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.main, truncate && styles.mainTruncate, primary && styles.mainPrimary, state.main.className);
90
92
  }
91
93
  if (state.description) {
94
+ // eslint-disable-next-line react-hooks/immutability
92
95
  state.description.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.description, styles.description, state.description.className);
93
96
  }
94
97
  if (state.content) {
98
+ // eslint-disable-next-line react-hooks/immutability
95
99
  state.content.className = (0, _react.mergeClasses)(tableCellLayoutClassNames.content, styles.content, truncate && styles.contentTruncate, state.content.className);
96
100
  }
97
101
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TableCellLayout/useTableCellLayoutStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableCellLayoutSlots, TableCellLayoutState } from './TableCellLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const tableCellLayoutClassNames: SlotClassNames<TableCellLayoutSlots> = {\n root: 'fui-TableCellLayout',\n media: 'fui-TableCellLayout__media',\n main: 'fui-TableCellLayout__main',\n description: 'fui-TableCellLayout__description',\n content: 'fui-TableCellLayout__content',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n gap: tokens.spacingHorizontalS,\n flex: '1 1 0px',\n },\n\n rootTruncate: {\n overflowX: 'hidden',\n },\n\n content: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n contentTruncate: {\n overflowX: 'hidden',\n },\n\n media: {\n display: 'flex',\n alignItems: 'center',\n },\n\n mediaExtraSmall: {\n fontSize: '16px',\n },\n\n mediaSmallAndMedium: {\n fontSize: '20px',\n },\n\n mediaPrimary: {\n fontSize: '24px',\n },\n\n mainPrimary: {\n fontWeight: tokens.fontWeightSemibold,\n },\n\n mainTruncate: {\n overflowX: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n\n description: {\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1,\n },\n});\n\n/**\n * Apply styling to the TableCellLayout slots based on the state\n */\nexport const useTableCellLayoutStyles_unstable = (state: TableCellLayoutState): TableCellLayoutState => {\n 'use no memo';\n\n const styles = useStyles();\n const { truncate } = state;\n\n state.root.className = mergeClasses(\n tableCellLayoutClassNames.root,\n styles.root,\n truncate && styles.rootTruncate,\n state.root.className,\n );\n const primary = state.appearance === 'primary';\n\n if (state.media) {\n const mediaSizedStyles = {\n small: styles.mediaSmallAndMedium,\n medium: styles.mediaSmallAndMedium,\n 'extra-small': styles.mediaExtraSmall,\n };\n\n state.media.className = mergeClasses(\n tableCellLayoutClassNames.media,\n styles.media,\n mediaSizedStyles[state.size],\n primary && styles.mediaPrimary,\n state.media.className,\n );\n }\n\n if (state.main) {\n state.main.className = mergeClasses(\n tableCellLayoutClassNames.main,\n truncate && styles.mainTruncate,\n primary && styles.mainPrimary,\n state.main.className,\n );\n }\n\n if (state.description) {\n state.description.className = mergeClasses(\n tableCellLayoutClassNames.description,\n styles.description,\n state.description.className,\n );\n }\n\n if (state.content) {\n state.content.className = mergeClasses(\n tableCellLayoutClassNames.content,\n styles.content,\n truncate && styles.contentTruncate,\n state.content.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","tableCellLayoutClassNames","root","media","main","description","content","useStyles","display","alignItems","gap","spacingHorizontalS","flex","rootTruncate","overflowX","flexDirection","contentTruncate","mediaExtraSmall","fontSize","mediaSmallAndMedium","mediaPrimary","mainPrimary","fontWeight","fontWeightSemibold","mainTruncate","whiteSpace","textOverflow","color","colorNeutralForeground2","caption1","useTableCellLayoutStyles_unstable","state","styles","truncate","className","primary","appearance","mediaSizedStyles","small","medium","size"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,yBAAAA;;;qCAoEA6B;eAAAA;;;uBA1E4B,iBAAiB;4BACnC,wBAAwB;AAKxC,kCAAwE;IAC7E5B,MAAM;IACNC,OAAO;IACPC,MAAM;IACNC,aAAa;IACbC,SAAS;AACX,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYV,iBAAAA,EAAW;IAC3BK,MAAM;QACJM,SAAS;QACTC,YAAY;QACZC,KAAKX,kBAAAA,CAAOY,kBAAkB;QAC9BC,MAAM;IACR;IAEAC,cAAc;QACZC,WAAW;IACb;IAEAR,SAAS;QACPE,SAAS;QACTO,eAAe;IACjB;IAEAC,iBAAiB;QACfF,WAAW;IACb;IAEAX,OAAO;QACLK,SAAS;QACTC,YAAY;IACd;IAEAQ,iBAAiB;QACfC,UAAU;IACZ;IAEAC,qBAAqB;QACnBD,UAAU;IACZ;IAEAE,cAAc;QACZF,UAAU;IACZ;IAEAG,aAAa;QACXC,YAAYvB,kBAAAA,CAAOwB,kBAAkB;IACvC;IAEAC,cAAc;QACZV,WAAW;QACXW,YAAY;QACZC,cAAc;IAChB;IAEArB,aAAa;QACXsB,OAAO5B,kBAAAA,CAAO6B,uBAAuB;QACrC,GAAG5B,4BAAAA,CAAiB6B,QAAQ;IAC9B;AACF;AAKO,0CAA0C,CAACE;IAChD;IAEA,MAAMC,SAASzB;IACf,MAAM,EAAE0B,QAAQ,EAAE,GAAGF;IAErBA,MAAM7B,IAAI,CAACgC,SAAS,OAAGpC,mBAAAA,EACrBG,0BAA0BC,IAAI,EAC9B8B,OAAO9B,IAAI,EACX+B,YAAYD,OAAOnB,YAAY,EAC/BkB,MAAM7B,IAAI,CAACgC,SAAS;IAEtB,MAAMC,UAAUJ,MAAMK,UAAU,KAAK;IAErC,IAAIL,MAAM5B,KAAK,EAAE;QACf,MAAMkC,mBAAmB;YACvBC,OAAON,OAAOb,mBAAmB;YACjCoB,QAAQP,OAAOb,mBAAmB;YAClC,eAAea,OAAOf,eAAe;QACvC;QAEAc,MAAM5B,KAAK,CAAC+B,SAAS,OAAGpC,mBAAAA,EACtBG,0BAA0BE,KAAK,EAC/B6B,OAAO7B,KAAK,EACZkC,gBAAgB,CAACN,MAAMS,IAAI,CAAC,EAC5BL,WAAWH,OAAOZ,YAAY,EAC9BW,MAAM5B,KAAK,CAAC+B,SAAS;IAEzB;IAEA,IAAIH,MAAM3B,IAAI,EAAE;QACd2B,MAAM3B,IAAI,CAAC8B,SAAS,OAAGpC,mBAAAA,EACrBG,0BAA0BG,IAAI,EAC9B6B,YAAYD,OAAOR,YAAY,EAC/BW,WAAWH,OAAOX,WAAW,EAC7BU,MAAM3B,IAAI,CAAC8B,SAAS;IAExB;IAEA,IAAIH,MAAM1B,WAAW,EAAE;QACrB0B,MAAM1B,WAAW,CAAC6B,SAAS,OAAGpC,mBAAAA,EAC5BG,0BAA0BI,WAAW,EACrC2B,OAAO3B,WAAW,EAClB0B,MAAM1B,WAAW,CAAC6B,SAAS;IAE/B;IAEA,IAAIH,MAAMzB,OAAO,EAAE;QACjByB,MAAMzB,OAAO,CAAC4B,SAAS,OAAGpC,mBAAAA,EACxBG,0BAA0BK,OAAO,EACjC0B,OAAO1B,OAAO,EACd2B,YAAYD,OAAOhB,eAAe,EAClCe,MAAMzB,OAAO,CAAC4B,SAAS;IAE3B;IAEA,OAAOH;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/TableCellLayout/useTableCellLayoutStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableCellLayoutSlots, TableCellLayoutState } from './TableCellLayout.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const tableCellLayoutClassNames: SlotClassNames<TableCellLayoutSlots> = {\n root: 'fui-TableCellLayout',\n media: 'fui-TableCellLayout__media',\n main: 'fui-TableCellLayout__main',\n description: 'fui-TableCellLayout__description',\n content: 'fui-TableCellLayout__content',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n gap: tokens.spacingHorizontalS,\n flex: '1 1 0px',\n },\n\n rootTruncate: {\n overflowX: 'hidden',\n },\n\n content: {\n display: 'flex',\n flexDirection: 'column',\n },\n\n contentTruncate: {\n overflowX: 'hidden',\n },\n\n media: {\n display: 'flex',\n alignItems: 'center',\n },\n\n mediaExtraSmall: {\n fontSize: '16px',\n },\n\n mediaSmallAndMedium: {\n fontSize: '20px',\n },\n\n mediaPrimary: {\n fontSize: '24px',\n },\n\n mainPrimary: {\n fontWeight: tokens.fontWeightSemibold,\n },\n\n mainTruncate: {\n overflowX: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n\n description: {\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1,\n },\n});\n\n/**\n * Apply styling to the TableCellLayout slots based on the state\n */\nexport const useTableCellLayoutStyles_unstable = (state: TableCellLayoutState): TableCellLayoutState => {\n const styles = useStyles();\n const { truncate } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n tableCellLayoutClassNames.root,\n styles.root,\n truncate && styles.rootTruncate,\n state.root.className,\n );\n const primary = state.appearance === 'primary';\n\n if (state.media) {\n const mediaSizedStyles = {\n small: styles.mediaSmallAndMedium,\n medium: styles.mediaSmallAndMedium,\n 'extra-small': styles.mediaExtraSmall,\n };\n\n // eslint-disable-next-line react-hooks/immutability\n state.media.className = mergeClasses(\n tableCellLayoutClassNames.media,\n styles.media,\n mediaSizedStyles[state.size],\n primary && styles.mediaPrimary,\n state.media.className,\n );\n }\n\n if (state.main) {\n // eslint-disable-next-line react-hooks/immutability\n state.main.className = mergeClasses(\n tableCellLayoutClassNames.main,\n truncate && styles.mainTruncate,\n primary && styles.mainPrimary,\n state.main.className,\n );\n }\n\n if (state.description) {\n // eslint-disable-next-line react-hooks/immutability\n state.description.className = mergeClasses(\n tableCellLayoutClassNames.description,\n styles.description,\n state.description.className,\n );\n }\n\n if (state.content) {\n // eslint-disable-next-line react-hooks/immutability\n state.content.className = mergeClasses(\n tableCellLayoutClassNames.content,\n styles.content,\n truncate && styles.contentTruncate,\n state.content.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","tableCellLayoutClassNames","root","media","main","description","content","useStyles","display","alignItems","gap","spacingHorizontalS","flex","rootTruncate","overflowX","flexDirection","contentTruncate","mediaExtraSmall","fontSize","mediaSmallAndMedium","mediaPrimary","mainPrimary","fontWeight","fontWeightSemibold","mainTruncate","whiteSpace","textOverflow","color","colorNeutralForeground2","caption1","useTableCellLayoutStyles_unstable","state","styles","truncate","className","primary","appearance","mediaSizedStyles","small","medium","size"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,yBAAAA;;;IAoEA6B,iCAAAA;;;;uBA1E4B,iBAAiB;4BACnC,wBAAwB;AAKxC,kCAAwE;IAC7E5B,MAAM;IACNC,OAAO;IACPC,MAAM;IACNC,aAAa;IACbC,SAAS;AACX,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYV,iBAAAA,EAAW;IAC3BK,MAAM;QACJM,SAAS;QACTC,YAAY;QACZC,KAAKX,kBAAAA,CAAOY,kBAAkB;QAC9BC,MAAM;IACR;IAEAC,cAAc;QACZC,WAAW;IACb;IAEAR,SAAS;QACPE,SAAS;QACTO,eAAe;IACjB;IAEAC,iBAAiB;QACfF,WAAW;IACb;IAEAX,OAAO;QACLK,SAAS;QACTC,YAAY;IACd;IAEAQ,iBAAiB;QACfC,UAAU;IACZ;IAEAC,qBAAqB;QACnBD,UAAU;IACZ;IAEAE,cAAc;QACZF,UAAU;IACZ;IAEAG,aAAa;QACXC,YAAYvB,kBAAAA,CAAOwB,kBAAkB;IACvC;IAEAC,cAAc;QACZV,WAAW;QACXW,YAAY;QACZC,cAAc;IAChB;IAEArB,aAAa;QACXsB,OAAO5B,kBAAAA,CAAO6B,uBAAuB;QACrC,GAAG5B,4BAAAA,CAAiB6B,QAAQ;IAC9B;AACF;AAKO,0CAA0C,CAACE;IAChD,MAAMC,SAASzB;IACf,MAAM,EAAE0B,QAAQ,EAAE,GAAGF;IAErB,oDAAoD;IACpDA,MAAM7B,IAAI,CAACgC,SAAS,OAAGpC,mBAAAA,EACrBG,0BAA0BC,IAAI,EAC9B8B,OAAO9B,IAAI,EACX+B,YAAYD,OAAOnB,YAAY,EAC/BkB,MAAM7B,IAAI,CAACgC,SAAS;IAEtB,MAAMC,UAAUJ,MAAMK,UAAU,KAAK;IAErC,IAAIL,MAAM5B,KAAK,EAAE;QACf,MAAMkC,mBAAmB;YACvBC,OAAON,OAAOb,mBAAmB;YACjCoB,QAAQP,OAAOb,mBAAmB;YAClC,eAAea,OAAOf,eAAe;QACvC;QAEA,oDAAoD;QACpDc,MAAM5B,KAAK,CAAC+B,SAAS,OAAGpC,mBAAAA,EACtBG,0BAA0BE,KAAK,EAC/B6B,OAAO7B,KAAK,EACZkC,gBAAgB,CAACN,MAAMS,IAAI,CAAC,EAC5BL,WAAWH,OAAOZ,YAAY,EAC9BW,MAAM5B,KAAK,CAAC+B,SAAS;IAEzB;IAEA,IAAIH,MAAM3B,IAAI,EAAE;QACd,oDAAoD;QACpD2B,MAAM3B,IAAI,CAAC8B,SAAS,OAAGpC,mBAAAA,EACrBG,0BAA0BG,IAAI,EAC9B6B,YAAYD,OAAOR,YAAY,EAC/BW,WAAWH,OAAOX,WAAW,EAC7BU,MAAM3B,IAAI,CAAC8B,SAAS;IAExB;IAEA,IAAIH,MAAM1B,WAAW,EAAE;QACrB,oDAAoD;QACpD0B,MAAM1B,WAAW,CAAC6B,SAAS,OAAGpC,mBAAAA,EAC5BG,0BAA0BI,WAAW,EACrC2B,OAAO3B,WAAW,EAClB0B,MAAM1B,WAAW,CAAC6B,SAAS;IAE/B;IAEA,IAAIH,MAAMzB,OAAO,EAAE;QACjB,oDAAoD;QACpDyB,MAAMzB,OAAO,CAAC4B,SAAS,OAAGpC,mBAAAA,EACxBG,0BAA0BK,OAAO,EACjC0B,OAAO1B,OAAO,EACd2B,YAAYD,OAAOhB,eAAe,EAClCe,MAAMzB,OAAO,CAAC4B,SAAS;IAE3B;IAEA,OAAOH;AACT,EAAE"}
@@ -44,11 +44,11 @@ const useTableLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
44
44
  ]
45
45
  });
46
46
  const useTableHeaderStyles_unstable = (state)=>{
47
- 'use no memo';
48
47
  const layoutStyles = {
49
48
  table: useTableLayoutStyles(),
50
49
  flex: useFlexLayoutStyles()
51
50
  };
51
+ // eslint-disable-next-line react-hooks/immutability
52
52
  state.root.className = (0, _react.mergeClasses)(tableHeaderClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
53
53
  return state;
54
54
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const tableHeaderClassName = 'fui-TableHeader';\nexport const tableHeaderClassNames = {\n root: 'fui-TableHeader'\n};\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'block'\n }\n});\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row-group'\n }\n});\n/**\n * Apply styling to the TableHeader slots based on the state\n */ export const useTableHeaderStyles_unstable = (state)=>{\n 'use no memo';\n const layoutStyles = {\n table: useTableLayoutStyles(),\n flex: useFlexLayoutStyles()\n };\n state.root.className = mergeClasses(tableHeaderClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","__styles","tableHeaderClassName","tableHeaderClassNames","root","useFlexLayoutStyles","mc9l5x","d","useTableLayoutStyles","useTableHeaderStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,oBAAoB;;;yBACC;;;iCAeY;;;;uBAjBL,gBAAgB;AAClD,6BAA6B,iBAAiB;AAC9C,MAAMC,wBAAwB;IACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,mBAAmB,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACF,MAAMC,oBAAoB,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI5B,CAAC;AAGS,MAAME,iCAAiCC,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,YAAY,GAAG;QACjBC,KAAK,EAAEJ,oBAAoB,CAAC,CAAC;QAC7BK,IAAI,EAAER,mBAAmB,CAAC;IAC9B,CAAC;IACDK,KAAK,CAACN,IAAI,CAACU,SAAS,OAAGd,mBAAY,EAACE,oBAAoB,EAAEQ,KAAK,CAACK,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACT,IAAI,GAAGO,YAAY,CAACC,KAAK,CAACR,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACU,SAAS,CAAC;IAC1J,OAAOJ,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useTableHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const tableHeaderClassName = 'fui-TableHeader';\nexport const tableHeaderClassNames = {\n root: 'fui-TableHeader'\n};\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'block'\n }\n});\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row-group'\n }\n});\n/**\n * Apply styling to the TableHeader slots based on the state\n */ export const useTableHeaderStyles_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(tableHeaderClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","__styles","tableHeaderClassName","tableHeaderClassNames","root","useFlexLayoutStyles","mc9l5x","d","useTableLayoutStyles","useTableHeaderStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,oBAAoB;;;yBACC;;;iCAeY;eAA7BO;;;uBAjBwB,gBAAgB;AAClD,6BAA6B,iBAAiB;AAC9C,MAAMN,wBAAwB;IACjCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,mBAAmB,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI3B,CAAC;AACF,MAAMC,oBAAoB,GAAA,WAAA,OAAGP,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAE,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAI5B,CAAC;AAGS,uCAAuCG,KAAK,IAAG;IACtD,MAAMC,YAAY,GAAG;QACjBC,KAAK,EAAEJ,oBAAoB,CAAC,CAAC;QAC7BK,IAAI,EAAER,mBAAmB,CAAC;IAC9B,CAAC;IACD,oDAAA;IACAK,KAAK,CAACN,IAAI,CAACU,SAAS,OAAGd,mBAAY,EAACE,oBAAoB,EAAEQ,KAAK,CAACK,gBAAgB,GAAGJ,YAAY,CAACE,IAAI,CAACT,IAAI,GAAGO,YAAY,CAACC,KAAK,CAACR,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACU,SAAS,CAAC;IAC1J,OAAOJ,KAAK;AAChB,CAAC"}
@@ -36,11 +36,11 @@ const useTableLayoutStyles = (0, _react.makeStyles)({
36
36
  }
37
37
  });
38
38
  const useTableHeaderStyles_unstable = (state)=>{
39
- 'use no memo';
40
39
  const layoutStyles = {
41
40
  table: useTableLayoutStyles(),
42
41
  flex: useFlexLayoutStyles()
43
42
  };
43
+ // eslint-disable-next-line react-hooks/immutability
44
44
  state.root.className = (0, _react.mergeClasses)(tableHeaderClassName, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);
45
45
  return state;
46
46
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TableHeader/useTableHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { TableHeaderSlots, TableHeaderState } from './TableHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableHeaderClassName = 'fui-TableHeader';\nexport const tableHeaderClassNames: SlotClassNames<TableHeaderSlots> = {\n root: 'fui-TableHeader',\n};\n\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'block',\n },\n});\n\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row-group',\n },\n});\n\n/**\n * Apply styling to the TableHeader slots based on the state\n */\nexport const useTableHeaderStyles_unstable = (state: TableHeaderState): TableHeaderState => {\n 'use no memo';\n\n const layoutStyles = {\n table: useTableLayoutStyles(),\n flex: useFlexLayoutStyles(),\n };\n state.root.className = mergeClasses(\n tableHeaderClassName,\n state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["mergeClasses","makeStyles","tableHeaderClassName","tableHeaderClassNames","root","useFlexLayoutStyles","display","useTableLayoutStyles","useTableHeaderStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,oBAAAA;;;yBACAC;;;iCAmBAK;eAAAA;;;uBAxB4B,iBAAiB;AAInD,6BAA6B,kBAAkB;AAC/C,MAAML,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,0BAAsBJ,iBAAAA,EAAW;IACrCG,MAAM;QACJE,SAAS;IACX;AACF;AAEA,MAAMC,2BAAuBN,iBAAAA,EAAW;IACtCG,MAAM;QACJE,SAAS;IACX;AACF;AAKO,sCAAsC,CAACG;IAC5C;IAEA,MAAMC,eAAe;QACnBC,OAAOJ;QACPK,MAAMP;IACR;IACAI,MAAML,IAAI,CAACS,SAAS,OAAGb,mBAAAA,EACrBE,sBACAO,MAAMK,gBAAgB,GAAGJ,aAAaE,IAAI,CAACR,IAAI,GAAGM,aAAaC,KAAK,CAACP,IAAI,EACzEK,MAAML,IAAI,CAACS,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/TableHeader/useTableHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { TableHeaderSlots, TableHeaderState } from './TableHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableHeaderClassName = 'fui-TableHeader';\nexport const tableHeaderClassNames: SlotClassNames<TableHeaderSlots> = {\n root: 'fui-TableHeader',\n};\n\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'block',\n },\n});\n\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row-group',\n },\n});\n\n/**\n * Apply styling to the TableHeader slots based on the state\n */\nexport const useTableHeaderStyles_unstable = (state: TableHeaderState): TableHeaderState => {\n const layoutStyles = {\n table: useTableLayoutStyles(),\n flex: useFlexLayoutStyles(),\n };\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n tableHeaderClassName,\n state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["mergeClasses","makeStyles","tableHeaderClassName","tableHeaderClassNames","root","useFlexLayoutStyles","display","useTableLayoutStyles","useTableHeaderStyles_unstable","state","layoutStyles","table","flex","className","noNativeElements"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,oBAAAA;;;yBACAC;;;iCAmBAK;;;;uBAxB4B,iBAAiB;AAInD,6BAA6B,kBAAkB;AAC/C,MAAML,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF,MAAMC,0BAAsBJ,iBAAAA,EAAW;IACrCG,MAAM;QACJE,SAAS;IACX;AACF;AAEA,MAAMC,2BAAuBN,iBAAAA,EAAW;IACtCG,MAAM;QACJE,SAAS;IACX;AACF;AAKO,MAAME,gCAAgC,CAACC;IAC5C,MAAMC,eAAe;QACnBC,OAAOJ;QACPK,MAAMP;IACR;IACA,oDAAoD;IACpDI,MAAML,IAAI,CAACS,SAAS,OAAGb,mBAAAA,EACrBE,sBACAO,MAAMK,gBAAgB,GAAGJ,aAAaE,IAAI,CAACR,IAAI,GAAGM,aAAaC,KAAK,CAACP,IAAI,EACzEK,MAAML,IAAI,CAACS,SAAS;IAGtB,OAAOJ;AACT,EAAE"}
@@ -227,18 +227,21 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
227
227
  ]
228
228
  });
229
229
  const useTableHeaderCellStyles_unstable = (state)=>{
230
- 'use no memo';
231
230
  const styles = useStyles();
232
231
  const layoutStyles = {
233
232
  table: useTableLayoutStyles(),
234
233
  flex: useFlexLayoutStyles()
235
234
  };
235
+ // eslint-disable-next-line react-hooks/immutability
236
236
  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);
237
+ // eslint-disable-next-line react-hooks/immutability
237
238
  state.button.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);
238
239
  if (state.sortIcon) {
240
+ // eslint-disable-next-line react-hooks/immutability
239
241
  state.sortIcon.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);
240
242
  }
241
243
  if (state.aside) {
244
+ // eslint-disable-next-line react-hooks/immutability
242
245
  state.aside.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);
243
246
  }
244
247
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableHeaderCellStyles.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 tableHeaderCellClassName = 'fui-TableHeaderCell';\nexport const tableHeaderCellClassNames = {\n root: 'fui-TableHeaderCell',\n button: 'fui-TableHeaderCell__button',\n sortIcon: 'fui-TableHeaderCell__sortIcon',\n aside: 'fui-TableHeaderCell__aside'\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n verticalAlign: 'middle'\n }\n});\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n flex: '1 1 0px',\n minWidth: '0px'\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n fontWeight: tokens.fontWeightRegular,\n padding: `0px ${tokens.spacingHorizontalS}`,\n ...createCustomFocusIndicatorStyle({\n outline: `2px solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus-within'\n }),\n position: 'relative'\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 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 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 sortable: {\n cursor: 'pointer'\n },\n sortIcon: {\n display: 'flex',\n alignItems: 'center',\n paddingTop: tokens.spacingVerticalXXS\n },\n resizeHandle: {}\n});\n/**\n * Apply styling to the TableHeaderCell slots based on the state\n */ export const useTableHeaderCellStyles_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(tableHeaderCellClassNames.root, styles.root, state.sortable && styles.rootInteractive, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n state.button.className = mergeClasses(tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);\n if (state.sortIcon) {\n state.sortIcon.className = mergeClasses(tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);\n }\n if (state.aside) {\n state.aside.className = mergeClasses(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableHeaderCellClassName","tableHeaderCellClassNames","root","button","sortIcon","aside","useTableLayoutStyles","mc9l5x","ha4doy","d","useFlexLayoutStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","Bf4jedk","p","useStyles","Bhrd7zp","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","robkg1","Bmvh20x","B3nxjsc","Bmkhcsx","B8osjzx","pehzd3","Blsv9te","u7xebq","Bsvwmf7","qhf8xq","rootInteractive","Bi91k9c","Jwef8y","lj723h","ecr2s2","resetButton","B3rzk8w","B7ck84d","De3pzq","sj55zd","Bahqtrf","Be2twd7","Bg96gwp","B68tc82","Bmxbyg5","Bpg54ce","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","fsow6f","a9b677","Bqenvij","Bt984gj","i8kkvl","Belr9w4","rmohyg","sshi5w","oeaueh","sortable","Bceei9c","resizeHandle","h","a","useTableHeaderCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"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"}
1
+ {"version":3,"sources":["useTableHeaderCellStyles.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 tableHeaderCellClassName = 'fui-TableHeaderCell';\nexport const tableHeaderCellClassNames = {\n root: 'fui-TableHeaderCell',\n button: 'fui-TableHeaderCell__button',\n sortIcon: 'fui-TableHeaderCell__sortIcon',\n aside: 'fui-TableHeaderCell__aside'\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n verticalAlign: 'middle'\n }\n});\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n flex: '1 1 0px',\n minWidth: '0px'\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n fontWeight: tokens.fontWeightRegular,\n padding: `0px ${tokens.spacingHorizontalS}`,\n ...createCustomFocusIndicatorStyle({\n outline: `2px solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus-within'\n }),\n position: 'relative'\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 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 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 sortable: {\n cursor: 'pointer'\n },\n sortIcon: {\n display: 'flex',\n alignItems: 'center',\n paddingTop: tokens.spacingVerticalXXS\n },\n resizeHandle: {}\n});\n/**\n * Apply styling to the TableHeaderCell slots based on the state\n */ export const useTableHeaderCellStyles_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(tableHeaderCellClassNames.root, styles.root, state.sortable && styles.rootInteractive, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.root.className);\n // eslint-disable-next-line react-hooks/immutability\n state.button.className = mergeClasses(tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);\n if (state.sortIcon) {\n // eslint-disable-next-line react-hooks/immutability\n state.sortIcon.className = mergeClasses(tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);\n }\n if (state.aside) {\n // eslint-disable-next-line react-hooks/immutability\n state.aside.className = mergeClasses(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableHeaderCellClassName","tableHeaderCellClassNames","root","button","sortIcon","aside","useTableLayoutStyles","mc9l5x","ha4doy","d","useFlexLayoutStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","Bf4jedk","p","useStyles","Bhrd7zp","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","robkg1","Bmvh20x","B3nxjsc","Bmkhcsx","B8osjzx","pehzd3","Blsv9te","u7xebq","Bsvwmf7","qhf8xq","rootInteractive","Bi91k9c","Jwef8y","lj723h","ecr2s2","resetButton","B3rzk8w","B7ck84d","De3pzq","sj55zd","Bahqtrf","Be2twd7","Bg96gwp","B68tc82","Bmxbyg5","Bpg54ce","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","fsow6f","a9b677","Bqenvij","Bt984gj","i8kkvl","Belr9w4","rmohyg","sshi5w","oeaueh","sortable","Bceei9c","resizeHandle","h","a","useTableHeaderCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements"],"mappings":"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"}
@@ -103,18 +103,21 @@ const useFlexLayoutStyles = (0, _react.makeStyles)({
103
103
  resizeHandle: {}
104
104
  });
105
105
  const useTableHeaderCellStyles_unstable = (state)=>{
106
- 'use no memo';
107
106
  const styles = useStyles();
108
107
  const layoutStyles = {
109
108
  table: useTableLayoutStyles(),
110
109
  flex: useFlexLayoutStyles()
111
110
  };
111
+ // eslint-disable-next-line react-hooks/immutability
112
112
  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);
113
+ // eslint-disable-next-line react-hooks/immutability
113
114
  state.button.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);
114
115
  if (state.sortIcon) {
116
+ // eslint-disable-next-line react-hooks/immutability
115
117
  state.sortIcon.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);
116
118
  }
117
119
  if (state.aside) {
120
+ // eslint-disable-next-line react-hooks/immutability
118
121
  state.aside.className = (0, _react.mergeClasses)(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);
119
122
  }
120
123
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TableHeaderCell/useTableHeaderCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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":["makeStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableHeaderCellClassName","tableHeaderCellClassNames","root","button","sortIcon","aside","useTableLayoutStyles","display","verticalAlign","useFlexLayoutStyles","flex","minWidth","useStyles","fontWeight","fontWeightRegular","padding","spacingHorizontalS","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","useTableHeaderCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/TableHeaderCell/useTableHeaderCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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 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 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 // eslint-disable-next-line react-hooks/immutability\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 // eslint-disable-next-line react-hooks/immutability\n state.sortIcon.className = mergeClasses(\n tableHeaderCellClassNames.sortIcon,\n styles.sortIcon,\n state.sortIcon.className,\n );\n }\n\n if (state.aside) {\n // eslint-disable-next-line react-hooks/immutability\n state.aside.className = mergeClasses(tableHeaderCellClassNames.aside, styles.resizeHandle, state.aside.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","tableHeaderCellClassName","tableHeaderCellClassNames","root","button","sortIcon","aside","useTableLayoutStyles","display","verticalAlign","useFlexLayoutStyles","flex","minWidth","useStyles","fontWeight","fontWeightRegular","padding","spacingHorizontalS","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","useTableHeaderCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements"],"mappings":"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"}
@@ -96,8 +96,8 @@ const tableResizeHandleClassNames = {
96
96
  ]
97
97
  });
98
98
  const useTableResizeHandleStyles_unstable = (state)=>{
99
- 'use no memo';
100
99
  const styles = useStyles();
100
+ // eslint-disable-next-line react-hooks/immutability
101
101
  state.root.className = (0, _react.mergeClasses)(tableResizeHandleClassNames.root, styles.root, state.root.className);
102
102
  return state;
103
103
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableResizeHandleStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tableResizeHandleClassNames = {\n root: 'fui-TableResizeHandle'\n};\n/**\n * Styles for the root slot\n */ const 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 // 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 ':hover': {\n opacity: 1\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 * Apply styling to the TableResizeHandle slots based on the state\n */ export const useTableResizeHandleStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(tableResizeHandleClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","tableResizeHandleClassNames","root","useStyles","qhf8xq","j35jbq","Bhzewxz","B5kzvoi","a9b677","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Bceei9c","abs64n","Bmy1vo4","B3o57yi","Bj3rh1h","B3cna0y","Brovlpu","B7zu5sd","Bsft5z2","ap17g6","a2br6o","E3zdtr","Eqx8gd","bn5sak","By385i5","Bjyk6c5","d","p","f","h","useTableResizeHandleStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,2BAA2B;;;uCAyCY;;;;uBA3CX,gBAAgB;AAElD,oCAAoC;IACvCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAiCrB,CAAC;AAGS,MAAMC,uCAAuCC,KAAK,IAAG;IAC5D,aAAa;IACb,MAAMC,MAAM,GAAGjC,SAAS,CAAC,CAAC;IAC1BgC,KAAK,CAACjC,IAAI,CAACmC,SAAS,OAAGtC,mBAAY,EAACE,2BAA2B,CAACC,IAAI,EAAEkC,MAAM,CAAClC,IAAI,EAAEiC,KAAK,CAACjC,IAAI,CAACmC,SAAS,CAAC;IACxG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useTableResizeHandleStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const tableResizeHandleClassNames = {\n root: 'fui-TableResizeHandle'\n};\n/**\n * Styles for the root slot\n */ const 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 // 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 ':hover': {\n opacity: 1\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 * Apply styling to the TableResizeHandle slots based on the state\n */ export const useTableResizeHandleStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(tableResizeHandleClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","tableResizeHandleClassNames","root","useStyles","qhf8xq","j35jbq","Bhzewxz","B5kzvoi","a9b677","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Bceei9c","abs64n","Bmy1vo4","B3o57yi","Bj3rh1h","B3cna0y","Brovlpu","B7zu5sd","Bsft5z2","ap17g6","a2br6o","E3zdtr","Eqx8gd","bn5sak","By385i5","Bjyk6c5","d","p","f","h","useTableResizeHandleStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCG,2BAA2B;;;uCAyCY;;;;uBA3CX,gBAAgB;AAElD,oCAAoC;IACvCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAiCrB,CAAC;AAGS,MAAMC,uCAAuCC,KAAK,IAAG;IAC5D,MAAMC,MAAM,GAAGjC,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAgC,KAAK,CAACjC,IAAI,CAACmC,SAAS,OAAGtC,mBAAY,EAACE,2BAA2B,CAACC,IAAI,EAAEkC,MAAM,CAAClC,IAAI,EAAEiC,KAAK,CAACjC,IAAI,CAACmC,SAAS,CAAC;IACxG,OAAOF,KAAK;AAChB,CAAC"}
@@ -59,8 +59,8 @@ const tableResizeHandleClassNames = {
59
59
  }
60
60
  });
61
61
  const useTableResizeHandleStyles_unstable = (state)=>{
62
- 'use no memo';
63
62
  const styles = useStyles();
63
+ // eslint-disable-next-line react-hooks/immutability
64
64
  state.root.className = (0, _react.mergeClasses)(tableResizeHandleClassNames.root, styles.root, state.root.className);
65
65
  return state;
66
66
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TableResizeHandle/useTableResizeHandleStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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":["makeStyles","mergeClasses","tokens","tableResizeHandleClassNames","root","useStyles","position","right","top","bottom","width","margin","cursor","opacity","transitionProperty","transitionDuration","zIndex","outlineStyle","content","display","left","backgroundColor","colorNeutralStroke1","useTableResizeHandleStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,2BAAAA;;;uCAkDAoB;;;;uBAvD4B,iBAAiB;4BAGnC,wBAAwB;AAExC,oCAA4E;IACjFnB,MAAM;AAGR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BI,MAAM;QACJE,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,iBAAiBnB,kBAAAA,CAAOoB,mBAAmB;QAC7C;IACF;AACF;AAKO,MAAMC,sCAAsC,CAACC;IAClD;IAEA,MAAMC,SAASpB;IACfmB,MAAMpB,IAAI,CAACsB,SAAS,OAAGzB,mBAAAA,EAAaE,4BAA4BC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACvG,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/TableResizeHandle/useTableResizeHandleStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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 const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(tableResizeHandleClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","tableResizeHandleClassNames","root","useStyles","position","right","top","bottom","width","margin","cursor","opacity","transitionProperty","transitionDuration","zIndex","outlineStyle","content","display","left","backgroundColor","colorNeutralStroke1","useTableResizeHandleStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,2BAAAA;;;uCAkDAoB;;;;uBAvD4B,iBAAiB;4BAGnC,wBAAwB;AAExC,oCAA4E;IACjFnB,MAAM;AAGR,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BI,MAAM;QACJE,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,iBAAiBnB,kBAAAA,CAAOoB,mBAAmB;QAC7C;IACF;AACF;AAKO,MAAMC,sCAAsC,CAACC;IAClD,MAAMC,SAASpB;IACf,oDAAoD;IACpDmB,MAAMpB,IAAI,CAACsB,SAAS,OAAGzB,mBAAAA,EAAaE,4BAA4BC,IAAI,EAAEqB,OAAOrB,IAAI,EAAEoB,MAAMpB,IAAI,CAACsB,SAAS;IACvG,OAAOF;AACT,EAAE"}
@@ -291,12 +291,12 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
291
291
  ]
292
292
  });
293
293
  const useTableRowStyles_unstable = (state)=>{
294
- 'use no memo';
295
294
  const styles = useStyles();
296
295
  const layoutStyles = {
297
296
  table: useTableLayoutStyles(),
298
297
  flex: useFlexLayoutStyles()
299
298
  };
299
+ // eslint-disable-next-line react-hooks/immutability
300
300
  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);
301
301
  return state;
302
302
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableRowStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n root: tableRowClassName\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row'\n }\n});\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center'\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n ...createCustomFocusIndicatorStyle({\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}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n },\n rootInteractive: {\n ...createCustomFocusIndicatorStyle({\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 medium: {\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`\n },\n small: {\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`\n },\n 'extra-small': {\n fontSize: tokens.fontSizeBase200\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground2,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n ':active': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorNeutralForeground1\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 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 ':active': {\n backgroundColor: tokens.colorSubtleBackgroundSelected\n },\n ...shorthands.borderColor(tokens.colorNeutralStrokeOnBrand)\n },\n none: {}\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */ export const useTableRowStyles_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(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);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","Bahaeuw","F230oe","Bdw8ktp","Bj1xduy","Bhh2cfd","medium","B9xav0g","oivjwe","Bn0qgzm","Bgfg5da","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","wmvzou","sc4o1m","wymq9i","u9orzk","puiv5t","Bosien3","b2z72d","Beulxaw","B57pkaw","Jcjdmf","B8qgbzl","Bbmb0sr","B14q8qp","Bcq6wej","Byz1pjr","kr9cjb","Ff9ifp","Bmclvqj","psczho","B0tx59b","sk7i8k","zlwzm7","Bkp2nk","gy0h4g","neutral","none","p","a","h","m","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"mappings":"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"}
1
+ {"version":3,"sources":["useTableRowStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n root: tableRowClassName\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-row'\n }\n});\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center'\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n boxSizing: 'border-box',\n ...createCustomFocusIndicatorStyle({\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}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n },\n rootInteractive: {\n ...createCustomFocusIndicatorStyle({\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 medium: {\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`\n },\n small: {\n borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`\n },\n 'extra-small': {\n fontSize: tokens.fontSizeBase200\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground2,\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n ':active': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorNeutralForeground1\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 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 ':active': {\n backgroundColor: tokens.colorSubtleBackgroundSelected\n },\n ...shorthands.borderColor(tokens.colorNeutralStrokeOnBrand)\n },\n none: {}\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */ export const useTableRowStyles_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(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);\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","Bahaeuw","F230oe","Bdw8ktp","Bj1xduy","Bhh2cfd","medium","B9xav0g","oivjwe","Bn0qgzm","Bgfg5da","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","wmvzou","sc4o1m","wymq9i","u9orzk","puiv5t","Bosien3","b2z72d","Beulxaw","B57pkaw","Jcjdmf","B8qgbzl","Bbmb0sr","B14q8qp","Bcq6wej","Byz1pjr","kr9cjb","Ff9ifp","Bmclvqj","psczho","B0tx59b","sk7i8k","zlwzm7","Bkp2nk","gy0h4g","neutral","none","p","a","h","m","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"mappings":"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"}
@@ -143,12 +143,12 @@ const useFlexLayoutStyles = (0, _react.makeStyles)({
143
143
  none: {}
144
144
  });
145
145
  const useTableRowStyles_unstable = (state)=>{
146
- 'use no memo';
147
146
  const styles = useStyles();
148
147
  const layoutStyles = {
149
148
  table: useTableLayoutStyles(),
150
149
  flex: useFlexLayoutStyles()
151
150
  };
151
+ // eslint-disable-next-line react-hooks/immutability
152
152
  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);
153
153
  return state;
154
154
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/TableRow/useTableRowStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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\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":["makeStyles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","display","useFlexLayoutStyles","alignItems","useStyles","color","colorNeutralForeground1","boxSizing","opacity","selector","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","rootInteractive","backgroundColor","colorSubtleBackgroundPressed","colorNeutralForeground1Pressed","colorSubtleBackgroundHover","colorNeutralForeground1Hover","borderColor","medium","borderBottom","strokeWidthThin","colorNeutralStroke2","small","fontSize","fontSizeBase200","brand","colorBrandBackground2","colorTransparentStrokeInteractive","border","outlineOffset","neutral","colorSubtleBackgroundSelected","colorNeutralStrokeOnBrand","none","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/TableRow/useTableRowStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { 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\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 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 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":["makeStyles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","display","useFlexLayoutStyles","alignItems","useStyles","color","colorNeutralForeground1","boxSizing","opacity","selector","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","rootInteractive","backgroundColor","colorSubtleBackgroundPressed","colorNeutralForeground1Pressed","colorSubtleBackgroundHover","colorNeutralForeground1Hover","borderColor","medium","borderBottom","strokeWidthThin","colorNeutralStroke2","small","fontSize","fontSizeBase200","brand","colorBrandBackground2","colorTransparentStrokeInteractive","border","outlineOffset","neutral","colorSubtleBackgroundSelected","colorNeutralStrokeOnBrand","none","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"mappings":"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"}
@@ -128,17 +128,19 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
128
128
  ]
129
129
  });
130
130
  const useTableSelectionCellStyles_unstable = (state)=>{
131
- 'use no memo';
132
131
  const styles = useStyles();
133
132
  const layoutStyles = {
134
133
  table: useTableLayoutStyles(),
135
134
  flex: useFlexLayoutStyles()
136
135
  };
136
+ // eslint-disable-next-line react-hooks/immutability
137
137
  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);
138
138
  if (state.checkboxIndicator) {
139
+ // eslint-disable-next-line react-hooks/immutability
139
140
  state.checkboxIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);
140
141
  }
141
142
  if (state.radioIndicator) {
143
+ // eslint-disable-next-line react-hooks/immutability
142
144
  state.radioIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.radioIndicator, styles.radioIndicator, state.radioIndicator.className);
143
145
  }
144
146
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["useTableSelectionCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const CELL_WIDTH = 44;\nexport const tableSelectionCellClassNames = {\n root: 'fui-TableSelectionCell',\n checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',\n radioIndicator: 'fui-TableSelectionCell__radioIndicator'\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n width: `${CELL_WIDTH}px`\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 * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n textAlign: 'center',\n whiteSpace: 'nowrap',\n padding: '0',\n ...createCustomFocusIndicatorStyle({\n outline: `2px solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n },\n radioIndicator: {\n display: 'flex',\n flexGrow: 1,\n alignItems: 'center',\n justifyContent: 'center'\n },\n subtle: {\n opacity: 0,\n ...createCustomFocusIndicatorStyle({\n opacity: 1\n }, {\n selector: 'focus-within'\n })\n },\n hidden: {\n opacity: 0\n }\n});\n/**\n * Apply styling to the TableSelectionCell slots based on the state\n */ export const useTableSelectionCellStyles_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(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);\n if (state.checkboxIndicator) {\n state.checkboxIndicator.className = mergeClasses(tableSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);\n }\n if (state.radioIndicator) {\n state.radioIndicator.className = mergeClasses(tableSelectionCellClassNames.radioIndicator, styles.radioIndicator, state.radioIndicator.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","createCustomFocusIndicatorStyle","tokens","CELL_WIDTH","tableSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useTableLayoutStyles","mc9l5x","a9b677","d","useFlexLayoutStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","Bf4jedk","B2u0y6b","Brf1p80","p","useStyles","fsow6f","Huce71","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","Bt984gj","subtle","abs64n","B8a84jv","hidden","useTableSelectionCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements","checked"],"mappings":"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"}
1
+ {"version":3,"sources":["useTableSelectionCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const CELL_WIDTH = 44;\nexport const tableSelectionCellClassNames = {\n root: 'fui-TableSelectionCell',\n checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',\n radioIndicator: 'fui-TableSelectionCell__radioIndicator'\n};\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n width: `${CELL_WIDTH}px`\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 * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n textAlign: 'center',\n whiteSpace: 'nowrap',\n padding: '0',\n ...createCustomFocusIndicatorStyle({\n outline: `2px solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n },\n radioIndicator: {\n display: 'flex',\n flexGrow: 1,\n alignItems: 'center',\n justifyContent: 'center'\n },\n subtle: {\n opacity: 0,\n ...createCustomFocusIndicatorStyle({\n opacity: 1\n }, {\n selector: 'focus-within'\n })\n },\n hidden: {\n opacity: 0\n }\n});\n/**\n * Apply styling to the TableSelectionCell slots based on the state\n */ export const useTableSelectionCellStyles_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(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);\n if (state.checkboxIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkboxIndicator.className = mergeClasses(tableSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);\n }\n if (state.radioIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.radioIndicator.className = mergeClasses(tableSelectionCellClassNames.radioIndicator, styles.radioIndicator, state.radioIndicator.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","createCustomFocusIndicatorStyle","tokens","CELL_WIDTH","tableSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useTableLayoutStyles","mc9l5x","a9b677","d","useFlexLayoutStyles","xawz","Bh6795r","Bnnss6s","fkmc3a","Bf4jedk","B2u0y6b","Brf1p80","p","useStyles","fsow6f","Huce71","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","Bfpq7zp","g9k6zt","Bn4voq9","giviqs","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","Bt984gj","subtle","abs64n","B8a84jv","hidden","useTableSelectionCellStyles_unstable","state","styles","layoutStyles","table","flex","className","noNativeElements","checked"],"mappings":"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"}
@@ -77,17 +77,19 @@ const useFlexLayoutStyles = (0, _react.makeStyles)({
77
77
  }
78
78
  });
79
79
  const useTableSelectionCellStyles_unstable = (state)=>{
80
- 'use no memo';
81
80
  const styles = useStyles();
82
81
  const layoutStyles = {
83
82
  table: useTableLayoutStyles(),
84
83
  flex: useFlexLayoutStyles()
85
84
  };
85
+ // eslint-disable-next-line react-hooks/immutability
86
86
  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);
87
87
  if (state.checkboxIndicator) {
88
+ // eslint-disable-next-line react-hooks/immutability
88
89
  state.checkboxIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.checkboxIndicator, state.checkboxIndicator.className);
89
90
  }
90
91
  if (state.radioIndicator) {
92
+ // eslint-disable-next-line react-hooks/immutability
91
93
  state.radioIndicator.className = (0, _react.mergeClasses)(tableSelectionCellClassNames.radioIndicator, styles.radioIndicator, state.radioIndicator.className);
92
94
  }
93
95
  return state;