@fluentui/react-table 9.0.0-alpha.1

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 (188) hide show
  1. package/CHANGELOG.json +80 -0
  2. package/CHANGELOG.md +36 -0
  3. package/LICENSE +15 -0
  4. package/README.md +5 -0
  5. package/Spec.md +63 -0
  6. package/dist/index.d.ts +321 -0
  7. package/dist/tsdoc-metadata.json +11 -0
  8. package/lib/Table.js +2 -0
  9. package/lib/Table.js.map +1 -0
  10. package/lib/TableBody.js +2 -0
  11. package/lib/TableBody.js.map +1 -0
  12. package/lib/TableCell.js +2 -0
  13. package/lib/TableCell.js.map +1 -0
  14. package/lib/TableHeader.js +2 -0
  15. package/lib/TableHeader.js.map +1 -0
  16. package/lib/TableHeaderCell.js +2 -0
  17. package/lib/TableHeaderCell.js.map +1 -0
  18. package/lib/TableRow.js +2 -0
  19. package/lib/TableRow.js.map +1 -0
  20. package/lib/components/Table/Table.js +16 -0
  21. package/lib/components/Table/Table.js.map +1 -0
  22. package/lib/components/Table/Table.types.js +2 -0
  23. package/lib/components/Table/Table.types.js.map +1 -0
  24. package/lib/components/Table/index.js +6 -0
  25. package/lib/components/Table/index.js.map +1 -0
  26. package/lib/components/Table/renderTable.js +18 -0
  27. package/lib/components/Table/renderTable.js.map +1 -0
  28. package/lib/components/Table/useTable.js +30 -0
  29. package/lib/components/Table/useTable.js.map +1 -0
  30. package/lib/components/Table/useTableContextValues.js +15 -0
  31. package/lib/components/Table/useTableContextValues.js.map +1 -0
  32. package/lib/components/Table/useTableStyles.js +27 -0
  33. package/lib/components/Table/useTableStyles.js.map +1 -0
  34. package/lib/components/TableBody/TableBody.js +15 -0
  35. package/lib/components/TableBody/TableBody.js.map +1 -0
  36. package/lib/components/TableBody/TableBody.types.js +2 -0
  37. package/lib/components/TableBody/TableBody.types.js.map +1 -0
  38. package/lib/components/TableBody/index.js +6 -0
  39. package/lib/components/TableBody/index.js.map +1 -0
  40. package/lib/components/TableBody/renderTableBody.js +16 -0
  41. package/lib/components/TableBody/renderTableBody.js.map +1 -0
  42. package/lib/components/TableBody/useTableBody.js +29 -0
  43. package/lib/components/TableBody/useTableBody.js.map +1 -0
  44. package/lib/components/TableBody/useTableBodyStyles.js +14 -0
  45. package/lib/components/TableBody/useTableBodyStyles.js.map +1 -0
  46. package/lib/components/TableCell/TableCell.js +15 -0
  47. package/lib/components/TableCell/TableCell.js.map +1 -0
  48. package/lib/components/TableCell/TableCell.types.js +2 -0
  49. package/lib/components/TableCell/TableCell.types.js.map +1 -0
  50. package/lib/components/TableCell/index.js +6 -0
  51. package/lib/components/TableCell/index.js.map +1 -0
  52. package/lib/components/TableCell/renderTableCell.js +17 -0
  53. package/lib/components/TableCell/renderTableCell.js.map +1 -0
  54. package/lib/components/TableCell/useTableCell.js +31 -0
  55. package/lib/components/TableCell/useTableCell.js.map +1 -0
  56. package/lib/components/TableCell/useTableCellStyles.js +48 -0
  57. package/lib/components/TableCell/useTableCellStyles.js.map +1 -0
  58. package/lib/components/TableHeader/TableHeader.js +15 -0
  59. package/lib/components/TableHeader/TableHeader.js.map +1 -0
  60. package/lib/components/TableHeader/TableHeader.types.js +2 -0
  61. package/lib/components/TableHeader/TableHeader.types.js.map +1 -0
  62. package/lib/components/TableHeader/index.js +6 -0
  63. package/lib/components/TableHeader/index.js.map +1 -0
  64. package/lib/components/TableHeader/renderTableHeader.js +15 -0
  65. package/lib/components/TableHeader/renderTableHeader.js.map +1 -0
  66. package/lib/components/TableHeader/useTableHeader.js +36 -0
  67. package/lib/components/TableHeader/useTableHeader.js.map +1 -0
  68. package/lib/components/TableHeader/useTableHeaderStyles.js +14 -0
  69. package/lib/components/TableHeader/useTableHeaderStyles.js.map +1 -0
  70. package/lib/components/TableHeaderCell/TableHeaderCell.js +15 -0
  71. package/lib/components/TableHeaderCell/TableHeaderCell.js.map +1 -0
  72. package/lib/components/TableHeaderCell/TableHeaderCell.types.js +2 -0
  73. package/lib/components/TableHeaderCell/TableHeaderCell.types.js.map +1 -0
  74. package/lib/components/TableHeaderCell/index.js +6 -0
  75. package/lib/components/TableHeaderCell/index.js.map +1 -0
  76. package/lib/components/TableHeaderCell/renderTableHeaderCell.js +17 -0
  77. package/lib/components/TableHeaderCell/renderTableHeaderCell.js.map +1 -0
  78. package/lib/components/TableHeaderCell/useTableHeaderCell.js +59 -0
  79. package/lib/components/TableHeaderCell/useTableHeaderCell.js.map +1 -0
  80. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.js +80 -0
  81. package/lib/components/TableHeaderCell/useTableHeaderCellStyles.js.map +1 -0
  82. package/lib/components/TableRow/TableRow.js +15 -0
  83. package/lib/components/TableRow/TableRow.js.map +1 -0
  84. package/lib/components/TableRow/TableRow.types.js +2 -0
  85. package/lib/components/TableRow/TableRow.types.js.map +1 -0
  86. package/lib/components/TableRow/index.js +6 -0
  87. package/lib/components/TableRow/index.js.map +1 -0
  88. package/lib/components/TableRow/renderTableRow.js +16 -0
  89. package/lib/components/TableRow/renderTableRow.js.map +1 -0
  90. package/lib/components/TableRow/useTableRow.js +31 -0
  91. package/lib/components/TableRow/useTableRow.js.map +1 -0
  92. package/lib/components/TableRow/useTableRowStyles.js +47 -0
  93. package/lib/components/TableRow/useTableRowStyles.js.map +1 -0
  94. package/lib/contexts/tableContext.js +10 -0
  95. package/lib/contexts/tableContext.js.map +1 -0
  96. package/lib/index.js +8 -0
  97. package/lib/index.js.map +1 -0
  98. package/lib-commonjs/Table.js +10 -0
  99. package/lib-commonjs/Table.js.map +1 -0
  100. package/lib-commonjs/TableBody.js +10 -0
  101. package/lib-commonjs/TableBody.js.map +1 -0
  102. package/lib-commonjs/TableCell.js +10 -0
  103. package/lib-commonjs/TableCell.js.map +1 -0
  104. package/lib-commonjs/TableHeader.js +10 -0
  105. package/lib-commonjs/TableHeader.js.map +1 -0
  106. package/lib-commonjs/TableHeaderCell.js +10 -0
  107. package/lib-commonjs/TableHeaderCell.js.map +1 -0
  108. package/lib-commonjs/TableRow.js +10 -0
  109. package/lib-commonjs/TableRow.js.map +1 -0
  110. package/lib-commonjs/components/Table/Table.js +28 -0
  111. package/lib-commonjs/components/Table/Table.js.map +1 -0
  112. package/lib-commonjs/components/Table/Table.types.js +6 -0
  113. package/lib-commonjs/components/Table/Table.types.js.map +1 -0
  114. package/lib-commonjs/components/Table/index.js +18 -0
  115. package/lib-commonjs/components/Table/index.js.map +1 -0
  116. package/lib-commonjs/components/Table/renderTable.js +30 -0
  117. package/lib-commonjs/components/Table/renderTable.js.map +1 -0
  118. package/lib-commonjs/components/Table/useTable.js +40 -0
  119. package/lib-commonjs/components/Table/useTable.js.map +1 -0
  120. package/lib-commonjs/components/Table/useTableContextValues.js +24 -0
  121. package/lib-commonjs/components/Table/useTableContextValues.js.map +1 -0
  122. package/lib-commonjs/components/Table/useTableStyles.js +37 -0
  123. package/lib-commonjs/components/Table/useTableStyles.js.map +1 -0
  124. package/lib-commonjs/components/TableBody/TableBody.js +26 -0
  125. package/lib-commonjs/components/TableBody/TableBody.js.map +1 -0
  126. package/lib-commonjs/components/TableBody/TableBody.types.js +6 -0
  127. package/lib-commonjs/components/TableBody/TableBody.types.js.map +1 -0
  128. package/lib-commonjs/components/TableBody/index.js +18 -0
  129. package/lib-commonjs/components/TableBody/index.js.map +1 -0
  130. package/lib-commonjs/components/TableBody/renderTableBody.js +27 -0
  131. package/lib-commonjs/components/TableBody/renderTableBody.js.map +1 -0
  132. package/lib-commonjs/components/TableBody/useTableBody.js +40 -0
  133. package/lib-commonjs/components/TableBody/useTableBody.js.map +1 -0
  134. package/lib-commonjs/components/TableBody/useTableBodyStyles.js +24 -0
  135. package/lib-commonjs/components/TableBody/useTableBodyStyles.js.map +1 -0
  136. package/lib-commonjs/components/TableCell/TableCell.js +26 -0
  137. package/lib-commonjs/components/TableCell/TableCell.js.map +1 -0
  138. package/lib-commonjs/components/TableCell/TableCell.types.js +6 -0
  139. package/lib-commonjs/components/TableCell/TableCell.types.js.map +1 -0
  140. package/lib-commonjs/components/TableCell/index.js +18 -0
  141. package/lib-commonjs/components/TableCell/index.js.map +1 -0
  142. package/lib-commonjs/components/TableCell/renderTableCell.js +28 -0
  143. package/lib-commonjs/components/TableCell/renderTableCell.js.map +1 -0
  144. package/lib-commonjs/components/TableCell/useTableCell.js +42 -0
  145. package/lib-commonjs/components/TableCell/useTableCell.js.map +1 -0
  146. package/lib-commonjs/components/TableCell/useTableCellStyles.js +59 -0
  147. package/lib-commonjs/components/TableCell/useTableCellStyles.js.map +1 -0
  148. package/lib-commonjs/components/TableHeader/TableHeader.js +26 -0
  149. package/lib-commonjs/components/TableHeader/TableHeader.js.map +1 -0
  150. package/lib-commonjs/components/TableHeader/TableHeader.types.js +6 -0
  151. package/lib-commonjs/components/TableHeader/TableHeader.types.js.map +1 -0
  152. package/lib-commonjs/components/TableHeader/index.js +18 -0
  153. package/lib-commonjs/components/TableHeader/index.js.map +1 -0
  154. package/lib-commonjs/components/TableHeader/renderTableHeader.js +26 -0
  155. package/lib-commonjs/components/TableHeader/renderTableHeader.js.map +1 -0
  156. package/lib-commonjs/components/TableHeader/useTableHeader.js +48 -0
  157. package/lib-commonjs/components/TableHeader/useTableHeader.js.map +1 -0
  158. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.js +24 -0
  159. package/lib-commonjs/components/TableHeader/useTableHeaderStyles.js.map +1 -0
  160. package/lib-commonjs/components/TableHeaderCell/TableHeaderCell.js +26 -0
  161. package/lib-commonjs/components/TableHeaderCell/TableHeaderCell.js.map +1 -0
  162. package/lib-commonjs/components/TableHeaderCell/TableHeaderCell.types.js +6 -0
  163. package/lib-commonjs/components/TableHeaderCell/TableHeaderCell.types.js.map +1 -0
  164. package/lib-commonjs/components/TableHeaderCell/index.js +18 -0
  165. package/lib-commonjs/components/TableHeaderCell/index.js.map +1 -0
  166. package/lib-commonjs/components/TableHeaderCell/renderTableHeaderCell.js +28 -0
  167. package/lib-commonjs/components/TableHeaderCell/renderTableHeaderCell.js.map +1 -0
  168. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js +73 -0
  169. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js.map +1 -0
  170. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.js +91 -0
  171. package/lib-commonjs/components/TableHeaderCell/useTableHeaderCellStyles.js.map +1 -0
  172. package/lib-commonjs/components/TableRow/TableRow.js +26 -0
  173. package/lib-commonjs/components/TableRow/TableRow.js.map +1 -0
  174. package/lib-commonjs/components/TableRow/TableRow.types.js +6 -0
  175. package/lib-commonjs/components/TableRow/TableRow.types.js.map +1 -0
  176. package/lib-commonjs/components/TableRow/index.js +18 -0
  177. package/lib-commonjs/components/TableRow/index.js.map +1 -0
  178. package/lib-commonjs/components/TableRow/renderTableRow.js +27 -0
  179. package/lib-commonjs/components/TableRow/renderTableRow.js.map +1 -0
  180. package/lib-commonjs/components/TableRow/useTableRow.js +42 -0
  181. package/lib-commonjs/components/TableRow/useTableRow.js.map +1 -0
  182. package/lib-commonjs/components/TableRow/useTableRowStyles.js +58 -0
  183. package/lib-commonjs/components/TableRow/useTableRowStyles.js.map +1 -0
  184. package/lib-commonjs/contexts/tableContext.js +21 -0
  185. package/lib-commonjs/contexts/tableContext.js.map +1 -0
  186. package/lib-commonjs/index.js +256 -0
  187. package/lib-commonjs/index.js.map +1 -0
  188. package/package.json +56 -0
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.TableHeaderCell = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const useTableHeaderCell_1 = /*#__PURE__*/require("./useTableHeaderCell");
11
+
12
+ const renderTableHeaderCell_1 = /*#__PURE__*/require("./renderTableHeaderCell");
13
+
14
+ const useTableHeaderCellStyles_1 = /*#__PURE__*/require("./useTableHeaderCellStyles");
15
+ /**
16
+ * TableHeaderCell component - TODO: add more docs
17
+ */
18
+
19
+
20
+ exports.TableHeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
21
+ const state = useTableHeaderCell_1.useTableHeaderCell_unstable(props, ref);
22
+ useTableHeaderCellStyles_1.useTableHeaderCellStyles_unstable(state);
23
+ return renderTableHeaderCell_1.renderTableHeaderCell_unstable(state);
24
+ });
25
+ exports.TableHeaderCell.displayName = 'TableHeaderCell';
26
+ //# sourceMappingURL=TableHeaderCell.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableHeaderCell/TableHeaderCell.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,0BAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,eAAA,gBAA6D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxG,MAAM,KAAK,GAAG,oBAAA,CAAA,2BAAA,CAA4B,KAA5B,EAAmC,GAAnC,CAAd;EAEA,0BAAA,CAAA,iCAAA,CAAkC,KAAlC;EACA,OAAO,uBAAA,CAAA,8BAAA,CAA+B,KAA/B,CAAP;AACD,CALyE,CAA7D;AAOb,OAAA,CAAA,eAAA,CAAgB,WAAhB,GAA8B,iBAA9B","sourcesContent":["import * as React from 'react';\nimport { useTableHeaderCell_unstable } from './useTableHeaderCell';\nimport { renderTableHeaderCell_unstable } from './renderTableHeaderCell';\nimport { useTableHeaderCellStyles_unstable } from './useTableHeaderCellStyles';\nimport type { TableHeaderCellProps } from './TableHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TableHeaderCell component - TODO: add more docs\n */\nexport const TableHeaderCell: ForwardRefComponent<TableHeaderCellProps> = React.forwardRef((props, ref) => {\n const state = useTableHeaderCell_unstable(props, ref);\n\n useTableHeaderCellStyles_unstable(state);\n return renderTableHeaderCell_unstable(state);\n});\n\nTableHeaderCell.displayName = 'TableHeaderCell';\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=TableHeaderCell.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+
7
+ const tslib_1 = /*#__PURE__*/require("tslib");
8
+
9
+ tslib_1.__exportStar(require("./TableHeaderCell"), exports);
10
+
11
+ tslib_1.__exportStar(require("./TableHeaderCell.types"), exports);
12
+
13
+ tslib_1.__exportStar(require("./renderTableHeaderCell"), exports);
14
+
15
+ tslib_1.__exportStar(require("./useTableHeaderCell"), exports);
16
+
17
+ tslib_1.__exportStar(require("./useTableHeaderCellStyles"), exports);
18
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableHeaderCell/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './TableHeaderCell';\nexport * from './TableHeaderCell.types';\nexport * from './renderTableHeaderCell';\nexport * from './useTableHeaderCell';\nexport * from './useTableHeaderCellStyles';\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.renderTableHeaderCell_unstable = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
+ /**
12
+ * Render the final JSX of TableHeaderCell
13
+ */
14
+
15
+
16
+ const renderTableHeaderCell_unstable = state => {
17
+ const {
18
+ slots,
19
+ slotProps
20
+ } = react_utilities_1.getSlots(state);
21
+ return React.createElement(slots.root, { ...slotProps.root
22
+ }, React.createElement(slots.button, { ...slotProps.button
23
+ }, slotProps.root.children, slots.sortIcon && React.createElement(slots.sortIcon, { ...slotProps.sortIcon
24
+ })));
25
+ };
26
+
27
+ exports.renderTableHeaderCell_unstable = renderTableHeaderCell_unstable;
28
+ //# sourceMappingURL=renderTableHeaderCell.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableHeaderCell/renderTableHeaderCell.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,8BAA8B,GAAI,KAAD,IAAgC;EAC5E,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAA+B,KAA/B,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,EAAA,GAAK,SAAS,CAAC;EAAf,CAAb,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,EAEG,KAAK,CAAC,QAAN,IAAkB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,QAAP,EAAe,EAAA,GAAK,SAAS,CAAC;EAAf,CAAf,CAFrB,CADF,CADF;AAQD,CAXM;;AAAM,OAAA,CAAA,8BAAA,GAA8B,8BAA9B","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TableHeaderCellState, TableHeaderCellSlots } from './TableHeaderCell.types';\n\n/**\n * Render the final JSX of TableHeaderCell\n */\nexport const renderTableHeaderCell_unstable = (state: TableHeaderCellState) => {\n const { slots, slotProps } = getSlots<TableHeaderCellSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.button {...slotProps.button}>\n {slotProps.root.children}\n {slots.sortIcon && <slots.sortIcon {...slotProps.sortIcon} />}\n </slots.button>\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useTableHeaderCell_unstable = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
+
12
+ const react_icons_1 = /*#__PURE__*/require("@fluentui/react-icons");
13
+
14
+ const tableContext_1 = /*#__PURE__*/require("../../contexts/tableContext");
15
+
16
+ const react_aria_1 = /*#__PURE__*/require("@fluentui/react-aria");
17
+
18
+ const sortIcons = {
19
+ ascending: /*#__PURE__*/React.createElement(react_icons_1.ArrowUpRegular, null),
20
+ descending: /*#__PURE__*/React.createElement(react_icons_1.ArrowDownRegular, null)
21
+ };
22
+ /**
23
+ * Create the state required to render TableHeaderCell.
24
+ *
25
+ * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,
26
+ * before being passed to renderTableHeaderCell_unstable.
27
+ *
28
+ * @param props - props from this instance of TableHeaderCell
29
+ * @param ref - reference to root HTMLElement of TableHeaderCell
30
+ */
31
+
32
+ const useTableHeaderCell_unstable = (props, ref) => {
33
+ var _a;
34
+
35
+ const noNativeElements = tableContext_1.useTableContext(ctx => ctx.noNativeElements);
36
+ const sortable = tableContext_1.useTableContext(ctx => ctx.sortable);
37
+ const rootComponent = ((_a = props.as) !== null && _a !== void 0 ? _a : noNativeElements) ? 'div' : 'th';
38
+ return {
39
+ components: {
40
+ root: rootComponent,
41
+ button: 'button',
42
+ sortIcon: 'span'
43
+ },
44
+ root: react_utilities_1.getNativeElementProps(rootComponent, {
45
+ ref,
46
+ role: rootComponent === 'div' ? 'columnheader' : undefined,
47
+ 'aria-sort': props.sortDirection,
48
+ ...props
49
+ }),
50
+ sortIcon: react_utilities_1.resolveShorthand(props.sortIcon, {
51
+ required: !!props.sortDirection,
52
+ defaultProps: {
53
+ children: props.sortDirection ? sortIcons[props.sortDirection] : undefined
54
+ }
55
+ }),
56
+ button: react_aria_1.useARIAButtonShorthand(props.button, {
57
+ required: true,
58
+ defaultProps: {
59
+ role: 'presentation',
60
+ tabIndex: -1,
61
+ type: 'button',
62
+ ...(sortable && {
63
+ role: undefined,
64
+ tabIndex: undefined
65
+ })
66
+ }
67
+ }),
68
+ sortable
69
+ };
70
+ };
71
+
72
+ exports.useTableHeaderCell_unstable = useTableHeaderCell_unstable;
73
+ //# sourceMappingURL=useTableHeaderCell.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableHeaderCell/useTableHeaderCell.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAEA,MAAA,cAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AAEA,MAAM,SAAS,GAAG;EAChB,SAAS,eAAE,KAAA,CAAA,aAAA,CAAC,aAAA,CAAA,cAAD,EAAe,IAAf,CADK;EAEhB,UAAU,eAAE,KAAA,CAAA,aAAA,CAAC,aAAA,CAAA,gBAAD,EAAiB,IAAjB;AAFI,CAAlB;AAKA;;;;;;;;AAQG;;AACI,MAAM,2BAA2B,GAAG,CACzC,KADyC,EAEzC,GAFyC,KAGjB;;;EACxB,MAAM,gBAAgB,GAAG,cAAA,CAAA,eAAA,CAAgB,GAAG,IAAI,GAAG,CAAC,gBAA3B,CAAzB;EACA,MAAM,QAAQ,GAAG,cAAA,CAAA,eAAA,CAAgB,GAAG,IAAI,GAAG,CAAC,QAA3B,CAAjB;EAEA,MAAM,aAAa,GAAG,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,EAAN,MAAQ,IAAR,IAAQ,EAAA,KAAA,KAAA,CAAR,GAAQ,EAAR,GAAY,gBAAZ,IAA+B,KAA/B,GAAuC,IAA7D;EACA,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE,aADI;MAEV,MAAM,EAAE,QAFE;MAGV,QAAQ,EAAE;IAHA,CADP;IAML,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,aAAtB,EAAqC;MACzC,GADyC;MAEzC,IAAI,EAAE,aAAa,KAAK,KAAlB,GAA0B,cAA1B,GAA2C,SAFR;MAGzC,aAAa,KAAK,CAAC,aAHsB;MAIzC,GAAG;IAJsC,CAArC,CAND;IAYL,QAAQ,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,QAAvB,EAAiC;MACzC,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,aADuB;MAEzC,YAAY,EAAE;QAAE,QAAQ,EAAE,KAAK,CAAC,aAAN,GAAsB,SAAS,CAAC,KAAK,CAAC,aAAP,CAA/B,GAAuD;MAAnE;IAF2B,CAAjC,CAZL;IAgBL,MAAM,EAAE,YAAA,CAAA,sBAAA,CAAuB,KAAK,CAAC,MAA7B,EAAqC;MAC3C,QAAQ,EAAE,IADiC;MAE3C,YAAY,EAAE;QACZ,IAAI,EAAE,cADM;QAEZ,QAAQ,EAAE,CAAC,CAFC;QAGZ,IAAI,EAAE,QAHM;QAIZ,IAAI,QAAQ,IAAI;UACd,IAAI,EAAE,SADQ;UAEd,QAAQ,EAAE;QAFI,CAAhB;MAJY;IAF6B,CAArC,CAhBH;IA4BL;EA5BK,CAAP;AA8BD,CAtCM;;AAAM,OAAA,CAAA,2BAAA,GAA2B,2BAA3B","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { ArrowUpRegular, ArrowDownRegular } from '@fluentui/react-icons';\nimport type { TableHeaderCellProps, TableHeaderCellState } from './TableHeaderCell.types';\nimport { useTableContext } from '../../contexts/tableContext';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\n\nconst sortIcons = {\n ascending: <ArrowUpRegular />,\n descending: <ArrowDownRegular />,\n};\n\n/**\n * Create the state required to render TableHeaderCell.\n *\n * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,\n * before being passed to renderTableHeaderCell_unstable.\n *\n * @param props - props from this instance of TableHeaderCell\n * @param ref - reference to root HTMLElement of TableHeaderCell\n */\nexport const useTableHeaderCell_unstable = (\n props: TableHeaderCellProps,\n ref: React.Ref<HTMLElement>,\n): TableHeaderCellState => {\n const noNativeElements = useTableContext(ctx => ctx.noNativeElements);\n const sortable = useTableContext(ctx => ctx.sortable);\n\n const rootComponent = props.as ?? noNativeElements ? 'div' : 'th';\n return {\n components: {\n root: rootComponent,\n button: 'button',\n sortIcon: 'span',\n },\n root: getNativeElementProps(rootComponent, {\n ref,\n role: rootComponent === 'div' ? 'columnheader' : undefined,\n 'aria-sort': props.sortDirection,\n ...props,\n }),\n sortIcon: resolveShorthand(props.sortIcon, {\n required: !!props.sortDirection,\n defaultProps: { children: props.sortDirection ? sortIcons[props.sortDirection] : undefined },\n }),\n button: useARIAButtonShorthand(props.button, {\n required: true,\n defaultProps: {\n role: 'presentation',\n tabIndex: -1,\n type: 'button',\n ...(sortable && {\n role: undefined,\n tabIndex: undefined,\n }),\n },\n }),\n sortable,\n };\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,91 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useTableHeaderCellStyles_unstable = exports.tableHeaderCellClassNames = exports.tableHeaderCellClassName = void 0;
7
+
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
+
10
+ const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
+
12
+ exports.tableHeaderCellClassName = 'fui-TableHeaderCell';
13
+ exports.tableHeaderCellClassNames = {
14
+ root: 'fui-TableHeaderCell',
15
+ button: 'fui-TableHeaderCell__button',
16
+ sortIcon: 'fui-TableHeaderCell__sortIcon'
17
+ };
18
+ /**
19
+ * Styles for the root slot
20
+ */
21
+
22
+ const useStyles = /*#__PURE__*/react_1.__styles({
23
+ "root": {
24
+ "sshi5w": "f5pgtk9",
25
+ "z8tnut": "f1nbblvp",
26
+ "z189sj": ["f1vdfbxk", "f1f5gg8d"],
27
+ "Byoj8tv": "f1ov4xf1",
28
+ "uwmqm3": ["f1f5gg8d", "f1vdfbxk"],
29
+ "mc9l5x": "f22iagw",
30
+ "Bt984gj": "f122n59",
31
+ "Bh6795r": "fqerorx",
32
+ "Bnnss6s": "f1neuvcm",
33
+ "xawz": "fkjuxzh"
34
+ },
35
+ "resetButton": {
36
+ "B7ck84d": "f1e4lqlz",
37
+ "De3pzq": "f1u2r49w",
38
+ "sj55zd": "f1ym3bx4",
39
+ "Bahqtrf": "f1mo0ibp",
40
+ "Be2twd7": "fjoy568",
41
+ "Bg96gwp": "fytdu2e",
42
+ "B68tc82": "f1mtd64y",
43
+ "Bmxbyg5": "f1y7q3j9",
44
+ "z8tnut": "f1g0x7ka",
45
+ "z189sj": ["fhxju0i", "f1cnd47f"],
46
+ "Byoj8tv": "f1qch9an",
47
+ "uwmqm3": ["f1cnd47f", "fhxju0i"],
48
+ "icvyot": "f1ern45e",
49
+ "vrafjx": ["f1n71otn", "f1deefiw"],
50
+ "oivjwe": "f1h8hb77",
51
+ "wvpqe5": ["f1deefiw", "f1n71otn"],
52
+ "Bv0vk6g": "f37px4s",
53
+ "fsow6f": "fgusgyc"
54
+ },
55
+ "button": {
56
+ "mc9l5x": "f22iagw",
57
+ "Bh6795r": "fqerorx",
58
+ "Bqenvij": "f1l02sjl",
59
+ "Bt984gj": "f122n59",
60
+ "i8kkvl": "fsnqrgy",
61
+ "Belr9w4": "fylz90v"
62
+ },
63
+ "sortable": {
64
+ "Bceei9c": "f1k6fduh"
65
+ },
66
+ "sortIcon": {
67
+ "mc9l5x": "f22iagw",
68
+ "Bt984gj": "f122n59"
69
+ }
70
+ }, {
71
+ "d": [".f5pgtk9{min-height:44px;}", ".f1nbblvp{padding-top:0px;}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f1ov4xf1{padding-bottom:0px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", ".fkjuxzh{-webkit-flex-basis:0px;-ms-flex-preferred-size:0px;flex-basis:0px;}", ".f1e4lqlz{box-sizing:content-box;}", ".f1u2r49w{background-color:inherit;}", ".f1ym3bx4{color:inherit;}", ".f1mo0ibp{font-family:inherit;}", ".fjoy568{font-size:inherit;}", ".fytdu2e{line-height:normal;}", ".f1mtd64y{overflow-x:visible;}", ".f1y7q3j9{overflow-y:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f37px4s{-webkit-appearance:button;}", ".fgusgyc{text-align:unset;}", ".f1l02sjl{height:100%;}", ".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}", ".fylz90v{row-gap:var(--spacingHorizontalS);}", ".f1k6fduh{cursor:pointer;}"]
72
+ });
73
+ /**
74
+ * Apply styling to the TableHeaderCell slots based on the state
75
+ */
76
+
77
+
78
+ const useTableHeaderCellStyles_unstable = state => {
79
+ const styles = useStyles();
80
+ state.root.className = react_1.mergeClasses(exports.tableHeaderCellClassNames.root, styles.root, state.root.className);
81
+ state.button.className = react_1.mergeClasses(exports.tableHeaderCellClassNames.button, styles.resetButton, styles.button, state.sortable && styles.sortable, state.button.className);
82
+
83
+ if (state.sortIcon) {
84
+ state.sortIcon.className = react_1.mergeClasses(exports.tableHeaderCellClassNames.sortIcon, styles.sortIcon, state.sortIcon.className);
85
+ }
86
+
87
+ return state;
88
+ };
89
+
90
+ exports.useTableHeaderCellStyles_unstable = useTableHeaderCellStyles_unstable;
91
+ //# sourceMappingURL=useTableHeaderCellStyles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableHeaderCell/useTableHeaderCellStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,wBAAA,GAA2B,qBAA3B;AACA,OAAA,CAAA,yBAAA,GAAkE;EAC7E,IAAI,EAAE,qBADuE;EAE7E,MAAM,EAAE,6BAFqE;EAG7E,QAAQ,EAAE;AAHmE,CAAlE;AAMb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;AAuCA;;AAEG;;;AACI,MAAM,iCAAiC,GAAI,KAAD,IAAsD;EACrG,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,yBAAA,CAA0B,IAAvC,EAA6C,MAAM,CAAC,IAApD,EAA0D,KAAK,CAAC,IAAN,CAAW,SAArE,CAAvB;EACA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,OAAA,CAAA,YAAA,CACvB,OAAA,CAAA,yBAAA,CAA0B,MADH,EAEvB,MAAM,CAAC,WAFgB,EAGvB,MAAM,CAAC,MAHgB,EAIvB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAJF,EAKvB,KAAK,CAAC,MAAN,CAAa,SALU,CAAzB;;EAQA,IAAI,KAAK,CAAC,QAAV,EAAoB;IAClB,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,OAAA,CAAA,YAAA,CACzB,OAAA,CAAA,yBAAA,CAA0B,QADD,EAEzB,MAAM,CAAC,QAFkB,EAGzB,KAAK,CAAC,QAAN,CAAe,SAHU,CAA3B;EAKD;;EAED,OAAO,KAAP;AACD,CApBM;;AAAM,OAAA,CAAA,iCAAA,GAAiC,iCAAjC","sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\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};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n minHeight: '44px',\n ...shorthands.padding('0px', tokens.spacingHorizontalS),\n display: 'flex',\n alignItems: 'center',\n ...shorthands.flex(1, 1, '0px'),\n },\n\n resetButton: {\n boxSizing: 'content-box',\n backgroundColor: 'inherit',\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'normal',\n ...shorthands.overflow('visible'),\n ...shorthands.padding(0),\n ...shorthands.borderStyle('none'),\n WebkitAppearance: 'button',\n textAlign: 'unset',\n },\n button: {\n display: 'flex',\n flexGrow: 1,\n height: '100%',\n alignItems: 'center',\n ...shorthands.gap(tokens.spacingHorizontalS),\n },\n sortable: {\n cursor: 'pointer',\n },\n\n sortIcon: {\n display: 'flex',\n alignItems: 'center',\n },\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 state.root.className = mergeClasses(tableHeaderCellClassNames.root, styles.root, state.root.className);\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 return state;\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,26 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.TableRow = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const useTableRow_1 = /*#__PURE__*/require("./useTableRow");
11
+
12
+ const renderTableRow_1 = /*#__PURE__*/require("./renderTableRow");
13
+
14
+ const useTableRowStyles_1 = /*#__PURE__*/require("./useTableRowStyles");
15
+ /**
16
+ * TableRow component - TODO: add more docs
17
+ */
18
+
19
+
20
+ exports.TableRow = /*#__PURE__*/React.forwardRef((props, ref) => {
21
+ const state = useTableRow_1.useTableRow_unstable(props, ref);
22
+ useTableRowStyles_1.useTableRowStyles_unstable(state);
23
+ return renderTableRow_1.renderTableRow_unstable(state);
24
+ });
25
+ exports.TableRow.displayName = 'TableRow';
26
+ //# sourceMappingURL=TableRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableRow/TableRow.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,QAAA,gBAA+C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAC1F,MAAM,KAAK,GAAG,aAAA,CAAA,oBAAA,CAAqB,KAArB,EAA4B,GAA5B,CAAd;EAEA,mBAAA,CAAA,0BAAA,CAA2B,KAA3B;EACA,OAAO,gBAAA,CAAA,uBAAA,CAAwB,KAAxB,CAAP;AACD,CAL2D,CAA/C;AAOb,OAAA,CAAA,QAAA,CAAS,WAAT,GAAuB,UAAvB","sourcesContent":["import * as React from 'react';\nimport { useTableRow_unstable } from './useTableRow';\nimport { renderTableRow_unstable } from './renderTableRow';\nimport { useTableRowStyles_unstable } from './useTableRowStyles';\nimport type { TableRowProps } from './TableRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * TableRow component - TODO: add more docs\n */\nexport const TableRow: ForwardRefComponent<TableRowProps> = React.forwardRef((props, ref) => {\n const state = useTableRow_unstable(props, ref);\n\n useTableRowStyles_unstable(state);\n return renderTableRow_unstable(state);\n});\n\nTableRow.displayName = 'TableRow';\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=TableRow.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+
7
+ const tslib_1 = /*#__PURE__*/require("tslib");
8
+
9
+ tslib_1.__exportStar(require("./TableRow"), exports);
10
+
11
+ tslib_1.__exportStar(require("./TableRow.types"), exports);
12
+
13
+ tslib_1.__exportStar(require("./renderTableRow"), exports);
14
+
15
+ tslib_1.__exportStar(require("./useTableRow"), exports);
16
+
17
+ tslib_1.__exportStar(require("./useTableRowStyles"), exports);
18
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableRow/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './TableRow';\nexport * from './TableRow.types';\nexport * from './renderTableRow';\nexport * from './useTableRow';\nexport * from './useTableRowStyles';\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.renderTableRow_unstable = void 0;
7
+
8
+ const React = /*#__PURE__*/require("react");
9
+
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
+ /**
12
+ * Render the final JSX of TableRow
13
+ */
14
+
15
+
16
+ const renderTableRow_unstable = state => {
17
+ const {
18
+ slots,
19
+ slotProps
20
+ } = react_utilities_1.getSlots(state); // TODO Add additional slots in the appropriate place
21
+
22
+ return React.createElement(slots.root, { ...slotProps.root
23
+ });
24
+ };
25
+
26
+ exports.renderTableRow_unstable = renderTableRow_unstable;
27
+ //# sourceMappingURL=renderTableRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableRow/renderTableRow.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,uBAAuB,GAAI,KAAD,IAAyB;EAC9D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAwB,KAAxB,CAA7B,CAD8D,CAG9D;;EACA,OAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CALM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TableRowState, TableRowSlots } from './TableRow.types';\n\n/**\n * Render the final JSX of TableRow\n */\nexport const renderTableRow_unstable = (state: TableRowState) => {\n const { slots, slotProps } = getSlots<TableRowSlots>(state);\n\n // TODO Add additional slots in the appropriate place\n return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,42 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useTableRow_unstable = void 0;
7
+
8
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
+
10
+ const tableContext_1 = /*#__PURE__*/require("../../contexts/tableContext");
11
+ /**
12
+ * Create the state required to render TableRow.
13
+ *
14
+ * The returned state can be modified with hooks such as useTableRowStyles_unstable,
15
+ * before being passed to renderTableRow_unstable.
16
+ *
17
+ * @param props - props from this instance of TableRow
18
+ * @param ref - reference to root HTMLElement of TableRow
19
+ */
20
+
21
+
22
+ const useTableRow_unstable = (props, ref) => {
23
+ var _a;
24
+
25
+ const noNativeElements = tableContext_1.useTableContext(ctx => ctx.noNativeElements);
26
+ const size = tableContext_1.useTableContext(ctx => ctx.size);
27
+ const rootComponent = ((_a = props.as) !== null && _a !== void 0 ? _a : noNativeElements) ? 'div' : 'tr';
28
+ return {
29
+ components: {
30
+ root: rootComponent
31
+ },
32
+ root: react_utilities_1.getNativeElementProps(rootComponent, {
33
+ ref,
34
+ role: rootComponent === 'div' ? 'row' : undefined,
35
+ ...props
36
+ }),
37
+ size
38
+ };
39
+ };
40
+
41
+ exports.useTableRow_unstable = useTableRow_unstable;
42
+ //# sourceMappingURL=useTableRow.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableRow/useTableRow.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,cAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,oBAAoB,GAAG,CAAC,KAAD,EAAuB,GAAvB,KAAqE;;;EACvG,MAAM,gBAAgB,GAAG,cAAA,CAAA,eAAA,CAAgB,GAAG,IAAI,GAAG,CAAC,gBAA3B,CAAzB;EACA,MAAM,IAAI,GAAG,cAAA,CAAA,eAAA,CAAgB,GAAG,IAAI,GAAG,CAAC,IAA3B,CAAb;EACA,MAAM,aAAa,GAAG,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,EAAN,MAAQ,IAAR,IAAQ,EAAA,KAAA,KAAA,CAAR,GAAQ,EAAR,GAAY,gBAAZ,IAA+B,KAA/B,GAAuC,IAA7D;EAEA,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CADP;IAIL,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,aAAtB,EAAqC;MACzC,GADyC;MAEzC,IAAI,EAAE,aAAa,KAAK,KAAlB,GAA0B,KAA1B,GAAkC,SAFC;MAGzC,GAAG;IAHsC,CAArC,CAJD;IASL;EATK,CAAP;AAWD,CAhBM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { TableRowProps, TableRowState } from './TableRow.types';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render TableRow.\n *\n * The returned state can be modified with hooks such as useTableRowStyles_unstable,\n * before being passed to renderTableRow_unstable.\n *\n * @param props - props from this instance of TableRow\n * @param ref - reference to root HTMLElement of TableRow\n */\nexport const useTableRow_unstable = (props: TableRowProps, ref: React.Ref<HTMLElement>): TableRowState => {\n const noNativeElements = useTableContext(ctx => ctx.noNativeElements);\n const size = useTableContext(ctx => ctx.size);\n const rootComponent = props.as ?? noNativeElements ? 'div' : 'tr';\n\n return {\n components: {\n root: rootComponent,\n },\n root: getNativeElementProps(rootComponent, {\n ref,\n role: rootComponent === 'div' ? 'row' : undefined,\n ...props,\n }),\n size,\n };\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,58 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useTableRowStyles_unstable = exports.tableRowClassNames = exports.tableRowClassName = void 0;
7
+
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
+
10
+ const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
+
12
+ exports.tableRowClassName = 'fui-TableRow';
13
+ exports.tableRowClassNames = {
14
+ root: exports.tableRowClassName
15
+ };
16
+ /**
17
+ * Styles for the root slot
18
+ */
19
+
20
+ const useStyles = /*#__PURE__*/react_1.__styles({
21
+ "root": {
22
+ "mc9l5x": "f22iagw",
23
+ "sj55zd": "f19n0e5",
24
+ "Jwef8y": "f1knas48"
25
+ },
26
+ "medium": {
27
+ "sshi5w": "f5pgtk9",
28
+ "Bn0qgzm": "f1vxd6vx",
29
+ "oivjwe": "fg706s2",
30
+ "B9xav0g": "frpde29"
31
+ },
32
+ "small": {
33
+ "sshi5w": "fcep9tg",
34
+ "Bn0qgzm": "f1vxd6vx",
35
+ "oivjwe": "fg706s2",
36
+ "B9xav0g": "frpde29"
37
+ },
38
+ "smaller": {
39
+ "sshi5w": "f1pha7fy",
40
+ "Be2twd7": "fy9rknc"
41
+ }
42
+ }, {
43
+ "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f5pgtk9{min-height:44px;}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fg706s2{border-bottom-style:solid;}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".fcep9tg{min-height:34px;}", ".f1pha7fy{min-height:24px;}", ".fy9rknc{font-size:var(--fontSizeBase200);}"],
44
+ "h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}"]
45
+ });
46
+ /**
47
+ * Apply styling to the TableRow slots based on the state
48
+ */
49
+
50
+
51
+ const useTableRowStyles_unstable = state => {
52
+ const styles = useStyles();
53
+ state.root.className = react_1.mergeClasses(exports.tableRowClassNames.root, styles.root, styles[state.size], state.root.className);
54
+ return state;
55
+ };
56
+
57
+ exports.useTableRowStyles_unstable = useTableRowStyles_unstable;
58
+ //# sourceMappingURL=useTableRowStyles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["components/TableRow/useTableRowStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,iBAAA,GAAoB,cAApB;AACA,OAAA,CAAA,kBAAA,GAAoD;EAC/D,IAAI,EAAE,OAAA,CAAA;AADyD,CAApD;AAIb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;AAAA,EAAlB;AAyBA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAAwC;EAChF,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,kBAAA,CAAmB,IAAhC,EAAsC,MAAM,CAAC,IAA7C,EAAmD,MAAM,CAAC,KAAK,CAAC,IAAP,CAAzD,EAAuE,KAAK,CAAC,IAAN,CAAW,SAAlF,CAAvB;EAEA,OAAO,KAAP;AACD,CALM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { TableRowSlots, TableRowState } from './TableRow.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames: SlotClassNames<TableRowSlots> = {\n root: tableRowClassName,\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n color: tokens.colorNeutralForeground1,\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n },\n },\n\n medium: {\n minHeight: '44px',\n ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n },\n\n small: {\n minHeight: '34px',\n ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n },\n\n smaller: {\n minHeight: '24px',\n fontSize: tokens.fontSizeBase200,\n },\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 state.root.className = mergeClasses(tableRowClassNames.root, styles.root, styles[state.size], state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useTableContext = exports.TableContextProvider = exports.tableContextDefaultValue = void 0;
7
+
8
+ const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector");
9
+
10
+ const tableContext = /*#__PURE__*/react_context_selector_1.createContext(undefined);
11
+ exports.tableContextDefaultValue = {
12
+ size: 'medium',
13
+ noNativeElements: false,
14
+ sortable: false
15
+ };
16
+ exports.TableContextProvider = tableContext.Provider;
17
+
18
+ const useTableContext = selector => react_context_selector_1.useContextSelector(tableContext, (ctx = exports.tableContextDefaultValue) => selector(ctx));
19
+
20
+ exports.useTableContext = useTableContext;
21
+ //# sourceMappingURL=tableContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["contexts/tableContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAGA,MAAM,YAAY,gBAAG,wBAAA,CAAA,aAAA,CAA6C,SAA7C,CAArB;AAEa,OAAA,CAAA,wBAAA,GAA8C;EACzD,IAAI,EAAE,QADmD;EAEzD,gBAAgB,EAAE,KAFuC;EAGzD,QAAQ,EAAE;AAH+C,CAA9C;AAMA,OAAA,CAAA,oBAAA,GAAuB,YAAY,CAAC,QAApC;;AACN,MAAM,eAAe,GAAO,QAAJ,IAC7B,wBAAA,CAAA,kBAAA,CAAmB,YAAnB,EAAiC,CAAC,GAAG,GAAG,OAAA,CAAA,wBAAP,KAAoC,QAAQ,CAAC,GAAD,CAA7E,CADK;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import { createContext, useContextSelector, ContextSelector } from '@fluentui/react-context-selector';\nimport { TableContextValue } from '../components/Table/Table.types';\n\nconst tableContext = createContext<TableContextValue | undefined>(undefined);\n\nexport const tableContextDefaultValue: TableContextValue = {\n size: 'medium',\n noNativeElements: false,\n sortable: false,\n};\n\nexport const TableContextProvider = tableContext.Provider;\nexport const useTableContext = <T>(selector: ContextSelector<TableContextValue, T>) =>\n useContextSelector(tableContext, (ctx = tableContextDefaultValue) => selector(ctx));\n"],"sourceRoot":"../src/"}