@veeqo/ui 9.9.3 → 9.9.5

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 (105) hide show
  1. package/dist/_virtual/____insertStyle.cjs +14 -0
  2. package/dist/_virtual/____insertStyle.cjs.map +1 -0
  3. package/dist/_virtual/____insertStyle.js +12 -0
  4. package/dist/_virtual/____insertStyle.js.map +1 -0
  5. package/dist/components/DataGrid/DataGrid.module.scss.cjs +9 -0
  6. package/dist/components/DataGrid/DataGrid.module.scss.cjs.map +1 -0
  7. package/dist/components/DataGrid/DataGrid.module.scss.js +7 -0
  8. package/dist/components/DataGrid/DataGrid.module.scss.js.map +1 -0
  9. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs +6 -2
  10. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs.map +1 -1
  11. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js +6 -2
  12. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js.map +1 -1
  13. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss.cjs +9 -0
  14. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss.cjs.map +1 -0
  15. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss.js +7 -0
  16. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss.js.map +1 -0
  17. package/dist/components/DataGrid/components/CellContent/CellContent.cjs +1 -1
  18. package/dist/components/DataGrid/components/CellContent/CellContent.cjs.map +1 -1
  19. package/dist/components/DataGrid/components/CellContent/CellContent.js +2 -2
  20. package/dist/components/DataGrid/components/CellContent/CellContent.js.map +1 -1
  21. package/dist/components/DataGrid/components/CellContent/CellContent.module.scss.cjs +9 -0
  22. package/dist/components/DataGrid/components/CellContent/CellContent.module.scss.cjs.map +1 -0
  23. package/dist/components/DataGrid/components/CellContent/CellContent.module.scss.js +7 -0
  24. package/dist/components/DataGrid/components/CellContent/CellContent.module.scss.js.map +1 -0
  25. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.cjs +1 -1
  26. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.cjs.map +1 -1
  27. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.js +2 -2
  28. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.js.map +1 -1
  29. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss.cjs +9 -0
  30. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss.cjs.map +1 -0
  31. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss.js +7 -0
  32. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss.js.map +1 -0
  33. package/dist/components/DataGrid/components/GridContainer/Container/Container.cjs +1 -1
  34. package/dist/components/DataGrid/components/GridContainer/Container/Container.cjs.map +1 -1
  35. package/dist/components/DataGrid/components/GridContainer/Container/Container.js +5 -5
  36. package/dist/components/DataGrid/components/GridContainer/Container/Container.js.map +1 -1
  37. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.scss.cjs +9 -0
  38. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.scss.cjs.map +1 -0
  39. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.scss.js +7 -0
  40. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.scss.js.map +1 -0
  41. package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs +1 -1
  42. package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map +1 -1
  43. package/dist/components/DataGrid/components/GridContainer/GridContainer.js +2 -2
  44. package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map +1 -1
  45. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.scss.cjs +9 -0
  46. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.scss.cjs.map +1 -0
  47. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.scss.js +7 -0
  48. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.scss.js.map +1 -0
  49. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs +1 -1
  50. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs.map +1 -1
  51. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js +4 -4
  52. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js.map +1 -1
  53. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.scss.cjs +9 -0
  54. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.scss.cjs.map +1 -0
  55. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.scss.js +7 -0
  56. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.scss.js.map +1 -0
  57. package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs +1 -1
  58. package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs.map +1 -1
  59. package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js +2 -2
  60. package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js.map +1 -1
  61. package/dist/components/DataGrid/components/Header/Resizer/Resizer.cjs +1 -1
  62. package/dist/components/DataGrid/components/Header/Resizer/Resizer.cjs.map +1 -1
  63. package/dist/components/DataGrid/components/Header/Resizer/Resizer.js +2 -2
  64. package/dist/components/DataGrid/components/Header/Resizer/Resizer.js.map +1 -1
  65. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.scss.cjs +9 -0
  66. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.scss.cjs.map +1 -0
  67. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.scss.js +7 -0
  68. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.scss.js.map +1 -0
  69. package/dist/components/DataGrid/utils/pinnedColumnUtils.cjs +1 -1
  70. package/dist/components/DataGrid/utils/pinnedColumnUtils.cjs.map +1 -1
  71. package/dist/components/DataGrid/utils/pinnedColumnUtils.js +3 -3
  72. package/dist/components/DataGrid/utils/pinnedColumnUtils.js.map +1 -1
  73. package/package.json +2 -1
  74. package/dist/components/DataGrid/DataGrid.module.css.cjs +0 -13
  75. package/dist/components/DataGrid/DataGrid.module.css.cjs.map +0 -1
  76. package/dist/components/DataGrid/DataGrid.module.css.js +0 -10
  77. package/dist/components/DataGrid/DataGrid.module.css.js.map +0 -1
  78. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.cjs +0 -11
  79. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.cjs.map +0 -1
  80. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.js +0 -9
  81. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.module.css.js.map +0 -1
  82. package/dist/components/DataGrid/components/CellContent/CellContent.module.css.cjs +0 -11
  83. package/dist/components/DataGrid/components/CellContent/CellContent.module.css.cjs.map +0 -1
  84. package/dist/components/DataGrid/components/CellContent/CellContent.module.css.js +0 -9
  85. package/dist/components/DataGrid/components/CellContent/CellContent.module.css.js.map +0 -1
  86. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.cjs +0 -11
  87. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.cjs.map +0 -1
  88. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.js +0 -9
  89. package/dist/components/DataGrid/components/Footer/FooterCell/FooterCell.module.css.js.map +0 -1
  90. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.cjs +0 -17
  91. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.cjs.map +0 -1
  92. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.js +0 -12
  93. package/dist/components/DataGrid/components/GridContainer/Container/Container.module.css.js.map +0 -1
  94. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.cjs +0 -11
  95. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.cjs.map +0 -1
  96. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.js +0 -9
  97. package/dist/components/DataGrid/components/GridContainer/GridContainer.module.css.js.map +0 -1
  98. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.cjs +0 -19
  99. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.cjs.map +0 -1
  100. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.js +0 -13
  101. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.module.css.js.map +0 -1
  102. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.cjs +0 -11
  103. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.cjs.map +0 -1
  104. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.js +0 -9
  105. package/dist/components/DataGrid/components/Header/Resizer/Resizer.module.css.js.map +0 -1
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ function insertStyle(css) {
4
+ if (!css || typeof window === 'undefined')
5
+ return;
6
+ const style = document.createElement('style');
7
+ style.setAttribute('type', 'text/css');
8
+ style.innerHTML = css;
9
+ document.head.appendChild(style);
10
+ return css;
11
+ }
12
+
13
+ module.exports = insertStyle;
14
+ //# sourceMappingURL=____insertStyle.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"____insertStyle.cjs","sources":["../../___$insertStyle"],"sourcesContent":["export default function insertStyle(css) {\n if (!css || typeof window === 'undefined')\n return;\n const style = document.createElement('style');\n style.setAttribute('type', 'text/css');\n style.innerHTML = css;\n document.head.appendChild(style);\n return css;\n}"],"names":[],"mappings":";;AAAe,SAAS,WAAW,CAAC,GAAG,EAAE;AACzC,IAAI,IAAI,CAAC,GAAG,IAAI,OAAO,MAAM,KAAK,WAAW;AAC7C,QAAQ;AACR,IAAI,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AACjD,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC;AAC1C,IAAI,KAAK,CAAC,SAAS,GAAG,GAAG;AACzB,IAAI,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AACpC,IAAI,OAAO,GAAG;AACd;;;;"}
@@ -0,0 +1,12 @@
1
+ function insertStyle(css) {
2
+ if (!css || typeof window === 'undefined')
3
+ return;
4
+ const style = document.createElement('style');
5
+ style.setAttribute('type', 'text/css');
6
+ style.innerHTML = css;
7
+ document.head.appendChild(style);
8
+ return css;
9
+ }
10
+
11
+ export { insertStyle as default };
12
+ //# sourceMappingURL=____insertStyle.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"____insertStyle.js","sources":["../../___$insertStyle"],"sourcesContent":["export default function insertStyle(css) {\n if (!css || typeof window === 'undefined')\n return;\n const style = document.createElement('style');\n style.setAttribute('type', 'text/css');\n style.innerHTML = css;\n document.head.appendChild(style);\n return css;\n}"],"names":[],"mappings":"AAAe,SAAS,WAAW,CAAC,GAAG,EAAE;AACzC,IAAI,IAAI,CAAC,GAAG,IAAI,OAAO,MAAM,KAAK,WAAW;AAC7C,QAAQ;AACR,IAAI,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AACjD,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC;AAC1C,IAAI,KAAK,CAAC,SAAS,GAAG,GAAG;AACzB,IAAI,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AACpC,IAAI,OAAO,GAAG;AACd;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._baseCell_t7iek_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_t7iek_1:focus, ._baseCell_t7iek_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_t7iek_10::after, ._pinnedColumnRight_t7iek_10::after, ._pinnedColumnLeft_t7iek_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_t7iek_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_t7iek_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}");
6
+ var styles = {"baseCell":"_baseCell_t7iek_1","pinnedColumnBase":"_pinnedColumnBase_t7iek_10","pinnedColumnRight":"_pinnedColumnRight_t7iek_10","pinnedColumnLeft":"_pinnedColumnLeft_t7iek_10"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=DataGrid.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataGrid.module.scss.cjs","sources":["../../../src/components/DataGrid/DataGrid.module.scss"],"sourcesContent":[".baseCell {\n position: relative;\n box-sizing: border-box;\n\n &:focus,\n &:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n }\n}\n\n.pinnedColumnBase {\n &::after {\n position: absolute;\n\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n\n content: '';\n pointer-events: none;\n\n box-sizing: border-box;\n }\n}\n\n.pinnedColumnLeft {\n @extend .pinnedColumnBase;\n\n &::after {\n transform: translate(100%);\n\n right: var(--sizes-none);\n\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 25%);\n }\n}\n\n.pinnedColumnRight {\n @extend .pinnedColumnBase;\n\n &::after {\n transform: translate(-100%);\n\n left: var(--sizes-none);\n\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 25%);\n }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,k4BAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._baseCell_t7iek_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_t7iek_1:focus, ._baseCell_t7iek_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_t7iek_10::after, ._pinnedColumnRight_t7iek_10::after, ._pinnedColumnLeft_t7iek_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_t7iek_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_t7iek_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}");
4
+ var styles = {"baseCell":"_baseCell_t7iek_1","pinnedColumnBase":"_pinnedColumnBase_t7iek_10","pinnedColumnRight":"_pinnedColumnRight_t7iek_10","pinnedColumnLeft":"_pinnedColumnLeft_t7iek_10"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=DataGrid.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataGrid.module.scss.js","sources":["../../../src/components/DataGrid/DataGrid.module.scss"],"sourcesContent":[".baseCell {\n position: relative;\n box-sizing: border-box;\n\n &:focus,\n &:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n }\n}\n\n.pinnedColumnBase {\n &::after {\n position: absolute;\n\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n\n content: '';\n pointer-events: none;\n\n box-sizing: border-box;\n }\n}\n\n.pinnedColumnLeft {\n @extend .pinnedColumnBase;\n\n &::after {\n transform: translate(100%);\n\n right: var(--sizes-none);\n\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 25%);\n }\n}\n\n.pinnedColumnRight {\n @extend .pinnedColumnBase;\n\n &::after {\n transform: translate(-100%);\n\n left: var(--sizes-none);\n\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 25%);\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,k4BAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -6,7 +6,7 @@ var buildClassnames = require('../../../../../utils/buildClassnames.cjs');
6
6
  require('uid/secure');
7
7
  var CellContent = require('../../CellContent/CellContent.cjs');
8
8
  var usePinnedColumnStyles = require('../../../hooks/usePinnedColumnStyles.cjs');
9
- var BodyCell_module = require('./BodyCell.module.css.cjs');
9
+ var BodyCell_module = require('./BodyCell.module.scss.cjs');
10
10
 
11
11
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
12
12
 
@@ -19,7 +19,11 @@ const BodyCell = ({ cell, ariaRoles }) => {
19
19
  const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta;
20
20
  const CellElement = rowHeader ? 'th' : 'td';
21
21
  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles.usePinnedColumnStyles({ column: cell.column });
22
- const bodyCellClassname = buildClassnames.buildClassnames([BodyCell_module.bodyCell, pinnedCellClassName, 'data-grid-cell']);
22
+ const bodyCellClassname = buildClassnames.buildClassnames([
23
+ BodyCell_module.bodyCell,
24
+ pinnedCellClassName,
25
+ 'data-grid-cell',
26
+ ]);
23
27
  return (React__default.default.createElement(CellElement, { className: bodyCellClassname, "aria-colindex": cell.column.getIndex() + 1, scope: rowHeader ? 'row' : undefined, role: rowHeader ? 'rowheader' : ariaRoles.cell, style: pinnedCellStyles },
24
28
  React__default.default.createElement(CellContent.CellContent, { contentStyle: {
25
29
  justifyContent,
@@ -1 +1 @@
1
- {"version":3,"file":"BodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { bodyCell } from './BodyCell.module.css';\n\ntype ColumnCellProps = {\n /**\n * Cell within the TanStack Table instance.\n */\n cell: Cell<any, any>;\n\n /**\n * ARIA roles for the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({ cell, ariaRoles }: ColumnCellProps) => {\n const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta!;\n const CellElement = rowHeader ? 'th' : 'td';\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n const bodyCellClassname = buildClassnames([bodyCell, pinnedCellClassName, 'data-grid-cell']);\n\n return (\n <CellElement\n className={bodyCellClassname}\n aria-colindex={cell.column.getIndex() + 1}\n scope={rowHeader ? 'row' : undefined}\n role={rowHeader ? 'rowheader' : ariaRoles.cell}\n style={pinnedCellStyles}\n >\n <CellContent\n contentStyle={\n {\n justifyContent,\n textAlign,\n } as React.CSSProperties\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </CellContent>\n </CellElement>\n );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","bodyCell","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;AAwBA;;AAEG;AACU,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAmB,KAAI;AAC/D,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAC5E,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,iBAAiB,GAAGC,+BAAe,CAAC,CAACC,wBAAQ,EAAE,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;IAE5F,QACEC,qCAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA;QAEvBA,sBAAC,CAAA,aAAA,CAAAC,uBAAW,EACV,EAAA,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA,EAGzBC,qBAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAC9C,CACF;AAElB;;;;"}
1
+ {"version":3,"file":"BodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n /**\n * Cell within the TanStack Table instance.\n */\n cell: Cell<any, any>;\n\n /**\n * ARIA roles for the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({ cell, ariaRoles }: ColumnCellProps) => {\n const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta!;\n const CellElement = rowHeader ? 'th' : 'td';\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n const bodyCellClassname = buildClassnames([\n styles.bodyCell,\n pinnedCellClassName,\n 'data-grid-cell',\n ]);\n\n return (\n <CellElement\n className={bodyCellClassname}\n aria-colindex={cell.column.getIndex() + 1}\n scope={rowHeader ? 'row' : undefined}\n role={rowHeader ? 'rowheader' : ariaRoles.cell}\n style={pinnedCellStyles}\n >\n <CellContent\n contentStyle={\n {\n justifyContent,\n textAlign,\n } as React.CSSProperties\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </CellContent>\n </CellElement>\n );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","styles","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;AAwBA;;AAEG;AACU,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAmB,KAAI;AAC/D,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAC5E,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;IAEhG,MAAM,iBAAiB,GAAGC,+BAAe,CAAC;AACxC,QAAAC,eAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;IAEF,QACEC,qCAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA;QAEvBA,sBAAC,CAAA,aAAA,CAAAC,uBAAW,EACV,EAAA,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA,EAGzBC,qBAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAC9C,CACF;AAElB;;;;"}
@@ -4,7 +4,7 @@ import { buildClassnames } from '../../../../../utils/buildClassnames.js';
4
4
  import 'uid/secure';
5
5
  import { CellContent } from '../../CellContent/CellContent.js';
6
6
  import { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles.js';
7
- import { bodyCell } from './BodyCell.module.css.js';
7
+ import styles from './BodyCell.module.scss.js';
8
8
 
9
9
  /**
10
10
  * Renders a cell element, and its content, for a given column and row, within the grid body.
@@ -13,7 +13,11 @@ const BodyCell = ({ cell, ariaRoles }) => {
13
13
  const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta;
14
14
  const CellElement = rowHeader ? 'th' : 'td';
15
15
  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });
16
- const bodyCellClassname = buildClassnames([bodyCell, pinnedCellClassName, 'data-grid-cell']);
16
+ const bodyCellClassname = buildClassnames([
17
+ styles.bodyCell,
18
+ pinnedCellClassName,
19
+ 'data-grid-cell',
20
+ ]);
17
21
  return (React__default.createElement(CellElement, { className: bodyCellClassname, "aria-colindex": cell.column.getIndex() + 1, scope: rowHeader ? 'row' : undefined, role: rowHeader ? 'rowheader' : ariaRoles.cell, style: pinnedCellStyles },
18
22
  React__default.createElement(CellContent, { contentStyle: {
19
23
  justifyContent,
@@ -1 +1 @@
1
- {"version":3,"file":"BodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { bodyCell } from './BodyCell.module.css';\n\ntype ColumnCellProps = {\n /**\n * Cell within the TanStack Table instance.\n */\n cell: Cell<any, any>;\n\n /**\n * ARIA roles for the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({ cell, ariaRoles }: ColumnCellProps) => {\n const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta!;\n const CellElement = rowHeader ? 'th' : 'td';\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n const bodyCellClassname = buildClassnames([bodyCell, pinnedCellClassName, 'data-grid-cell']);\n\n return (\n <CellElement\n className={bodyCellClassname}\n aria-colindex={cell.column.getIndex() + 1}\n scope={rowHeader ? 'row' : undefined}\n role={rowHeader ? 'rowheader' : ariaRoles.cell}\n style={pinnedCellStyles}\n >\n <CellContent\n contentStyle={\n {\n justifyContent,\n textAlign,\n } as React.CSSProperties\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </CellContent>\n </CellElement>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAwBA;;AAEG;AACU,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAmB,KAAI;AAC/D,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAC5E,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,iBAAiB,GAAG,eAAe,CAAC,CAAC,QAAQ,EAAE,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;IAE5F,QACEA,6BAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA;QAEvBA,cAAC,CAAA,aAAA,CAAA,WAAW,EACV,EAAA,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA,EAGzB,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAC9C,CACF;AAElB;;;;"}
1
+ {"version":3,"file":"BodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n /**\n * Cell within the TanStack Table instance.\n */\n cell: Cell<any, any>;\n\n /**\n * ARIA roles for the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({ cell, ariaRoles }: ColumnCellProps) => {\n const { justifyContent, textAlign, rowHeader } = cell.column.columnDef.meta!;\n const CellElement = rowHeader ? 'th' : 'td';\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n const bodyCellClassname = buildClassnames([\n styles.bodyCell,\n pinnedCellClassName,\n 'data-grid-cell',\n ]);\n\n return (\n <CellElement\n className={bodyCellClassname}\n aria-colindex={cell.column.getIndex() + 1}\n scope={rowHeader ? 'row' : undefined}\n role={rowHeader ? 'rowheader' : ariaRoles.cell}\n style={pinnedCellStyles}\n >\n <CellContent\n contentStyle={\n {\n justifyContent,\n textAlign,\n } as React.CSSProperties\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </CellContent>\n </CellElement>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAwBA;;AAEG;AACU,MAAA,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAmB,KAAI;AAC/D,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAC5E,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;IAEhG,MAAM,iBAAiB,GAAG,eAAe,CAAC;AACxC,QAAA,MAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;IAEF,QACEA,6BAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA;QAEvBA,cAAC,CAAA,aAAA,CAAA,WAAW,EACV,EAAA,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA,EAGzB,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAC9C,CACF;AAElB;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../../../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._baseCell_1r4wp_1, ._bodyCell_1r4wp_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_1r4wp_1:focus, ._bodyCell_1r4wp_1:focus, ._baseCell_1r4wp_1:focus-visible, ._bodyCell_1r4wp_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_1r4wp_10::after, ._pinnedColumnRight_1r4wp_10::after, ._pinnedColumnLeft_1r4wp_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_1r4wp_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_1r4wp_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._bodyCell_1r4wp_1 {\n background-color: white;\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n}\n\n.data-grid-row.striped:nth-of-type(odd) > ._bodyCell_1r4wp_1 {\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n.data-grid-row.selected > ._bodyCell_1r4wp_1 {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.data-grid-row + .data-grid-row > ._bodyCell_1r4wp_1 {\n border-top: 1px solid var(--colors-neutral-grey-base);\n}");
6
+ var styles = {"baseCell":"_baseCell_1r4wp_1","bodyCell":"_bodyCell_1r4wp_1","pinnedColumnBase":"_pinnedColumnBase_1r4wp_10","pinnedColumnRight":"_pinnedColumnRight_1r4wp_10","pinnedColumnLeft":"_pinnedColumnLeft_1r4wp_10"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=BodyCell.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BodyCell.module.scss.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss"],"sourcesContent":["@use '../../../DataGrid.module.scss';\n\n.bodyCell {\n @extend .baseCell;\n\n background-color: white;\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n}\n\n:global(.data-grid-row.striped:nth-of-type(odd)) > .bodyCell {\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n:global(.data-grid-row.selected) > .bodyCell {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n:global(.data-grid-row + .data-grid-row) > .bodyCell {\n border-top: 1px solid var(--colors-neutral-grey-base);\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,gmDAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../../../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._baseCell_1r4wp_1, ._bodyCell_1r4wp_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_1r4wp_1:focus, ._bodyCell_1r4wp_1:focus, ._baseCell_1r4wp_1:focus-visible, ._bodyCell_1r4wp_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_1r4wp_10::after, ._pinnedColumnRight_1r4wp_10::after, ._pinnedColumnLeft_1r4wp_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_1r4wp_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_1r4wp_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._bodyCell_1r4wp_1 {\n background-color: white;\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n}\n\n.data-grid-row.striped:nth-of-type(odd) > ._bodyCell_1r4wp_1 {\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n.data-grid-row.selected > ._bodyCell_1r4wp_1 {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n.data-grid-row + .data-grid-row > ._bodyCell_1r4wp_1 {\n border-top: 1px solid var(--colors-neutral-grey-base);\n}");
4
+ var styles = {"baseCell":"_baseCell_1r4wp_1","bodyCell":"_bodyCell_1r4wp_1","pinnedColumnBase":"_pinnedColumnBase_1r4wp_10","pinnedColumnRight":"_pinnedColumnRight_1r4wp_10","pinnedColumnLeft":"_pinnedColumnLeft_1r4wp_10"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=BodyCell.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BodyCell.module.scss.js","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.module.scss"],"sourcesContent":["@use '../../../DataGrid.module.scss';\n\n.bodyCell {\n @extend .baseCell;\n\n background-color: white;\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-size: var(--text-body-small-font-size);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n}\n\n:global(.data-grid-row.striped:nth-of-type(odd)) > .bodyCell {\n background-color: var(--colors-neutral-grey-lightest);\n}\n\n:global(.data-grid-row.selected) > .bodyCell {\n background-color: var(--colors-brand-blue-lightest);\n}\n\n:global(.data-grid-row + .data-grid-row) > .bodyCell {\n border-top: 1px solid var(--colors-neutral-grey-base);\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,gmDAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -3,7 +3,7 @@
3
3
  var React = require('react');
4
4
  var buildClassnames = require('../../../../utils/buildClassnames.cjs');
5
5
  require('uid/secure');
6
- var CellContent_module = require('./CellContent.module.css.cjs');
6
+ var CellContent_module = require('./CellContent.module.scss.cjs');
7
7
 
8
8
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
9
9
 
@@ -1 +1 @@
1
- {"version":3,"file":"CellContent.cjs","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../utils';\n\nimport { cellContent } from './CellContent.module.css';\n\nexport interface CellContentProps {\n /**\n * Styles to be applied to the cell content wrapper.\n */\n contentStyle: Pick<React.CSSProperties, 'marginLeft' | 'justifyContent' | 'textAlign'>;\n\n /**\n * Child elements.\n */\n children?: React.ReactNode;\n}\n\nconst cellContentClassname = buildClassnames([cellContent, 'data-grid-cell-content']);\n\n/**\n * Wrapper for content displayed within a non-header cell in the grid.\n */\nexport const CellContent = ({ contentStyle, children }: CellContentProps) => {\n return (\n <div data-testid=\"data-grid-cell-content\" className={cellContentClassname} style={contentStyle}>\n {children}\n </div>\n );\n};\n"],"names":["buildClassnames","cellContent","React"],"mappings":";;;;;;;;;;;AAkBA,MAAM,oBAAoB,GAAGA,+BAAe,CAAC,CAACC,8BAAW,EAAE,wBAAwB,CAAC,CAAC;AAErF;;AAEG;AACU,MAAA,WAAW,GAAG,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAoB,KAAI;AAC1E,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAiB,wBAAwB,EAAC,SAAS,EAAE,oBAAoB,EAAE,KAAK,EAAE,YAAY,EAAA,EAC3F,QAAQ,CACL;AAEV;;;;"}
1
+ {"version":3,"file":"CellContent.cjs","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../utils';\n\nimport styles from './CellContent.module.scss';\n\nexport interface CellContentProps {\n /**\n * Styles to be applied to the cell content wrapper.\n */\n contentStyle: Pick<React.CSSProperties, 'marginLeft' | 'justifyContent' | 'textAlign'>;\n\n /**\n * Child elements.\n */\n children?: React.ReactNode;\n}\n\nconst cellContentClassname = buildClassnames([styles.cellContent, 'data-grid-cell-content']);\n\n/**\n * Wrapper for content displayed within a non-header cell in the grid.\n */\nexport const CellContent = ({ contentStyle, children }: CellContentProps) => {\n return (\n <div data-testid=\"data-grid-cell-content\" className={cellContentClassname} style={contentStyle}>\n {children}\n </div>\n );\n};\n"],"names":["buildClassnames","styles","React"],"mappings":";;;;;;;;;;;AAkBA,MAAM,oBAAoB,GAAGA,+BAAe,CAAC,CAACC,kBAAM,CAAC,WAAW,EAAE,wBAAwB,CAAC,CAAC;AAE5F;;AAEG;AACU,MAAA,WAAW,GAAG,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAoB,KAAI;AAC1E,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAiB,wBAAwB,EAAC,SAAS,EAAE,oBAAoB,EAAE,KAAK,EAAE,YAAY,EAAA,EAC3F,QAAQ,CACL;AAEV;;;;"}
@@ -1,9 +1,9 @@
1
1
  import React__default from 'react';
2
2
  import { buildClassnames } from '../../../../utils/buildClassnames.js';
3
3
  import 'uid/secure';
4
- import { cellContent } from './CellContent.module.css.js';
4
+ import styles from './CellContent.module.scss.js';
5
5
 
6
- const cellContentClassname = buildClassnames([cellContent, 'data-grid-cell-content']);
6
+ const cellContentClassname = buildClassnames([styles.cellContent, 'data-grid-cell-content']);
7
7
  /**
8
8
  * Wrapper for content displayed within a non-header cell in the grid.
9
9
  */
@@ -1 +1 @@
1
- {"version":3,"file":"CellContent.js","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../utils';\n\nimport { cellContent } from './CellContent.module.css';\n\nexport interface CellContentProps {\n /**\n * Styles to be applied to the cell content wrapper.\n */\n contentStyle: Pick<React.CSSProperties, 'marginLeft' | 'justifyContent' | 'textAlign'>;\n\n /**\n * Child elements.\n */\n children?: React.ReactNode;\n}\n\nconst cellContentClassname = buildClassnames([cellContent, 'data-grid-cell-content']);\n\n/**\n * Wrapper for content displayed within a non-header cell in the grid.\n */\nexport const CellContent = ({ contentStyle, children }: CellContentProps) => {\n return (\n <div data-testid=\"data-grid-cell-content\" className={cellContentClassname} style={contentStyle}>\n {children}\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;AAkBA,MAAM,oBAAoB,GAAG,eAAe,CAAC,CAAC,WAAW,EAAE,wBAAwB,CAAC,CAAC;AAErF;;AAEG;AACU,MAAA,WAAW,GAAG,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAoB,KAAI;AAC1E,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAiB,wBAAwB,EAAC,SAAS,EAAE,oBAAoB,EAAE,KAAK,EAAE,YAAY,EAAA,EAC3F,QAAQ,CACL;AAEV;;;;"}
1
+ {"version":3,"file":"CellContent.js","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../utils';\n\nimport styles from './CellContent.module.scss';\n\nexport interface CellContentProps {\n /**\n * Styles to be applied to the cell content wrapper.\n */\n contentStyle: Pick<React.CSSProperties, 'marginLeft' | 'justifyContent' | 'textAlign'>;\n\n /**\n * Child elements.\n */\n children?: React.ReactNode;\n}\n\nconst cellContentClassname = buildClassnames([styles.cellContent, 'data-grid-cell-content']);\n\n/**\n * Wrapper for content displayed within a non-header cell in the grid.\n */\nexport const CellContent = ({ contentStyle, children }: CellContentProps) => {\n return (\n <div data-testid=\"data-grid-cell-content\" className={cellContentClassname} style={contentStyle}>\n {children}\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;AAkBA,MAAM,oBAAoB,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,WAAW,EAAE,wBAAwB,CAAC,CAAC;AAE5F;;AAEG;AACU,MAAA,WAAW,GAAG,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAoB,KAAI;AAC1E,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAiB,wBAAwB,EAAC,SAAS,EAAE,oBAAoB,EAAE,KAAK,EAAE,YAAY,EAAA,EAC3F,QAAQ,CACL;AAEV;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._cellContent_un8dp_1 {\n display: flex;\n padding: var(--density);\n align-items: center;\n gap: var(--sizes-sm);\n}");
6
+ var styles = {"cellContent":"_cellContent_un8dp_1"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=CellContent.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CellContent.module.scss.cjs","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.module.scss"],"sourcesContent":[".cellContent {\n display: flex;\n padding: var(--density);\n align-items: center;\n gap: var(--sizes-sm);\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,2HAAA;AACA,aAAA,CAAA,aAAA,CAAA,sBAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._cellContent_un8dp_1 {\n display: flex;\n padding: var(--density);\n align-items: center;\n gap: var(--sizes-sm);\n}");
4
+ var styles = {"cellContent":"_cellContent_un8dp_1"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=CellContent.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CellContent.module.scss.js","sources":["../../../../../src/components/DataGrid/components/CellContent/CellContent.module.scss"],"sourcesContent":[".cellContent {\n display: flex;\n padding: var(--density);\n align-items: center;\n gap: var(--sizes-sm);\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,2HAAA;AACA,aAAA,CAAA,aAAA,CAAA,sBAAA;;;;"}
@@ -6,7 +6,7 @@ var buildClassnames = require('../../../../../utils/buildClassnames.cjs');
6
6
  require('uid/secure');
7
7
  var usePinnedColumnStyles = require('../../../hooks/usePinnedColumnStyles.cjs');
8
8
  var CellContent = require('../../CellContent/CellContent.cjs');
9
- var FooterCell_module = require('./FooterCell.module.css.cjs');
9
+ var FooterCell_module = require('./FooterCell.module.scss.cjs');
10
10
 
11
11
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
12
12
 
@@ -1 +1 @@
1
- {"version":3,"file":"FooterCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { flexRender, Header } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\n\nimport { footerCell } from './FooterCell.module.css';\n\ntype FooterCellProps = {\n /**\n * The Header within the TanStack Table instance.\n */\n header: Header<any, any>;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a footer cell element, and its content, for a given column.\n */\nexport const FooterCell = ({ header, ariaRoles }: FooterCellProps) => {\n const { justifyContent, textAlign } = header.column.columnDef.meta!;\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n column: header.column,\n });\n\n const footerCellClassname = buildClassnames([\n footerCell,\n pinnedCellClassName,\n 'data-grid-footer-cell',\n ]);\n\n return (\n <th\n scope=\"row\"\n role={ariaRoles.cell}\n aria-colindex={header.column.getIndex() + 1}\n className={footerCellClassname}\n style={pinnedCellStyles}\n >\n <CellContent contentStyle={{ justifyContent, textAlign } as React.CSSProperties}>\n {flexRender(header.column.columnDef.footer, header.getContext())}\n </CellContent>\n </th>\n );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","footerCell","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;AAyBA;;AAEG;AACU,MAAA,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,KAAI;AACnE,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;AAEnE,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC;QACtE,MAAM,EAAE,MAAM,CAAC,MAAM;AACtB,KAAA,CAAC;IAEF,MAAM,mBAAmB,GAAGC,+BAAe,CAAC;QAC1CC,4BAAU;QACV,mBAAmB;QACnB,uBAAuB;AACxB,KAAA,CAAC;IAEF,QACEC,sBACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,KAAK,EAAC,KAAK,EACX,IAAI,EAAE,SAAS,CAAC,IAAI,EACL,eAAA,EAAA,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAC3C,SAAS,EAAE,mBAAmB,EAC9B,KAAK,EAAE,gBAAgB,EAAA;AAEvB,QAAAA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EAAC,YAAY,EAAE,EAAE,cAAc,EAAE,SAAS,EAAyB,EAAA,EAC5EC,qBAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,CAAC,CACpD,CACX;AAET;;;;"}
1
+ {"version":3,"file":"FooterCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { flexRender, Header } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\n\nimport styles from './FooterCell.module.scss';\n\ntype FooterCellProps = {\n /**\n * The Header within the TanStack Table instance.\n */\n header: Header<any, any>;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a footer cell element, and its content, for a given column.\n */\nexport const FooterCell = ({ header, ariaRoles }: FooterCellProps) => {\n const { justifyContent, textAlign } = header.column.columnDef.meta!;\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n column: header.column,\n });\n\n const footerCellClassname = buildClassnames([\n styles.footerCell,\n pinnedCellClassName,\n 'data-grid-footer-cell',\n ]);\n\n return (\n <th\n scope=\"row\"\n role={ariaRoles.cell}\n aria-colindex={header.column.getIndex() + 1}\n className={footerCellClassname}\n style={pinnedCellStyles}\n >\n <CellContent contentStyle={{ justifyContent, textAlign } as React.CSSProperties}>\n {flexRender(header.column.columnDef.footer, header.getContext())}\n </CellContent>\n </th>\n );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","styles","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;AAyBA;;AAEG;AACU,MAAA,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,KAAI;AACnE,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;AAEnE,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC;QACtE,MAAM,EAAE,MAAM,CAAC,MAAM;AACtB,KAAA,CAAC;IAEF,MAAM,mBAAmB,GAAGC,+BAAe,CAAC;AAC1C,QAAAC,iBAAM,CAAC,UAAU;QACjB,mBAAmB;QACnB,uBAAuB;AACxB,KAAA,CAAC;IAEF,QACEC,sBACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,KAAK,EAAC,KAAK,EACX,IAAI,EAAE,SAAS,CAAC,IAAI,EACL,eAAA,EAAA,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAC3C,SAAS,EAAE,mBAAmB,EAC9B,KAAK,EAAE,gBAAgB,EAAA;AAEvB,QAAAA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EAAC,YAAY,EAAE,EAAE,cAAc,EAAE,SAAS,EAAyB,EAAA,EAC5EC,qBAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,CAAC,CACpD,CACX;AAET;;;;"}
@@ -4,7 +4,7 @@ import { buildClassnames } from '../../../../../utils/buildClassnames.js';
4
4
  import 'uid/secure';
5
5
  import { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles.js';
6
6
  import { CellContent } from '../../CellContent/CellContent.js';
7
- import { footerCell } from './FooterCell.module.css.js';
7
+ import styles from './FooterCell.module.scss.js';
8
8
 
9
9
  /**
10
10
  * Renders a footer cell element, and its content, for a given column.
@@ -15,7 +15,7 @@ const FooterCell = ({ header, ariaRoles }) => {
15
15
  column: header.column,
16
16
  });
17
17
  const footerCellClassname = buildClassnames([
18
- footerCell,
18
+ styles.footerCell,
19
19
  pinnedCellClassName,
20
20
  'data-grid-footer-cell',
21
21
  ]);
@@ -1 +1 @@
1
- {"version":3,"file":"FooterCell.js","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { flexRender, Header } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\n\nimport { footerCell } from './FooterCell.module.css';\n\ntype FooterCellProps = {\n /**\n * The Header within the TanStack Table instance.\n */\n header: Header<any, any>;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a footer cell element, and its content, for a given column.\n */\nexport const FooterCell = ({ header, ariaRoles }: FooterCellProps) => {\n const { justifyContent, textAlign } = header.column.columnDef.meta!;\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n column: header.column,\n });\n\n const footerCellClassname = buildClassnames([\n footerCell,\n pinnedCellClassName,\n 'data-grid-footer-cell',\n ]);\n\n return (\n <th\n scope=\"row\"\n role={ariaRoles.cell}\n aria-colindex={header.column.getIndex() + 1}\n className={footerCellClassname}\n style={pinnedCellStyles}\n >\n <CellContent contentStyle={{ justifyContent, textAlign } as React.CSSProperties}>\n {flexRender(header.column.columnDef.footer, header.getContext())}\n </CellContent>\n </th>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAyBA;;AAEG;AACU,MAAA,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,KAAI;AACnE,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;AAEnE,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC;QACtE,MAAM,EAAE,MAAM,CAAC,MAAM;AACtB,KAAA,CAAC;IAEF,MAAM,mBAAmB,GAAG,eAAe,CAAC;QAC1C,UAAU;QACV,mBAAmB;QACnB,uBAAuB;AACxB,KAAA,CAAC;IAEF,QACEA,cACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,KAAK,EAAC,KAAK,EACX,IAAI,EAAE,SAAS,CAAC,IAAI,EACL,eAAA,EAAA,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAC3C,SAAS,EAAE,mBAAmB,EAC9B,KAAK,EAAE,gBAAgB,EAAA;AAEvB,QAAAA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAC,YAAY,EAAE,EAAE,cAAc,EAAE,SAAS,EAAyB,EAAA,EAC5E,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,CAAC,CACpD,CACX;AAET;;;;"}
1
+ {"version":3,"file":"FooterCell.js","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport { flexRender, Header } from '@tanstack/react-table';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { usePinnedColumnStyles } from '../../../hooks/usePinnedColumnStyles';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\n\nimport styles from './FooterCell.module.scss';\n\ntype FooterCellProps = {\n /**\n * The Header within the TanStack Table instance.\n */\n header: Header<any, any>;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n};\n\n/**\n * Renders a footer cell element, and its content, for a given column.\n */\nexport const FooterCell = ({ header, ariaRoles }: FooterCellProps) => {\n const { justifyContent, textAlign } = header.column.columnDef.meta!;\n\n const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n column: header.column,\n });\n\n const footerCellClassname = buildClassnames([\n styles.footerCell,\n pinnedCellClassName,\n 'data-grid-footer-cell',\n ]);\n\n return (\n <th\n scope=\"row\"\n role={ariaRoles.cell}\n aria-colindex={header.column.getIndex() + 1}\n className={footerCellClassname}\n style={pinnedCellStyles}\n >\n <CellContent contentStyle={{ justifyContent, textAlign } as React.CSSProperties}>\n {flexRender(header.column.columnDef.footer, header.getContext())}\n </CellContent>\n </th>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAyBA;;AAEG;AACU,MAAA,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAmB,KAAI;AACnE,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;AAEnE,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC;QACtE,MAAM,EAAE,MAAM,CAAC,MAAM;AACtB,KAAA,CAAC;IAEF,MAAM,mBAAmB,GAAG,eAAe,CAAC;AAC1C,QAAA,MAAM,CAAC,UAAU;QACjB,mBAAmB;QACnB,uBAAuB;AACxB,KAAA,CAAC;IAEF,QACEA,cACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,KAAK,EAAC,KAAK,EACX,IAAI,EAAE,SAAS,CAAC,IAAI,EACL,eAAA,EAAA,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAC3C,SAAS,EAAE,mBAAmB,EAC9B,KAAK,EAAE,gBAAgB,EAAA;AAEvB,QAAAA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAC,YAAY,EAAE,EAAE,cAAc,EAAE,SAAS,EAAyB,EAAA,EAC5E,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,CAAC,CACpD,CACX;AAET;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../../../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._baseCell_1v1wo_1, ._footerCell_1v1wo_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_1v1wo_1:focus, ._footerCell_1v1wo_1:focus, ._baseCell_1v1wo_1:focus-visible, ._footerCell_1v1wo_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_1v1wo_10::after, ._pinnedColumnRight_1v1wo_10::after, ._pinnedColumnLeft_1v1wo_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_1v1wo_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_1v1wo_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._footerCell_1v1wo_1 {\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n border-top: var(--sizes-line) solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}");
6
+ var styles = {"baseCell":"_baseCell_1v1wo_1","footerCell":"_footerCell_1v1wo_1","pinnedColumnBase":"_pinnedColumnBase_1v1wo_10","pinnedColumnRight":"_pinnedColumnRight_1v1wo_10","pinnedColumnLeft":"_pinnedColumnLeft_1v1wo_10"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=FooterCell.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FooterCell.module.scss.cjs","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss"],"sourcesContent":["@use '../../../DataGrid.module.scss';\n\n.footerCell {\n @extend .baseCell;\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n border-top: var(--sizes-line) solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,+2CAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,YAAA,CAAA,qBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../../../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._baseCell_1v1wo_1, ._footerCell_1v1wo_1 {\n position: relative;\n box-sizing: border-box;\n}\n._baseCell_1v1wo_1:focus, ._footerCell_1v1wo_1:focus, ._baseCell_1v1wo_1:focus-visible, ._footerCell_1v1wo_1:focus-visible {\n outline: var(--sizes-none);\n box-shadow: inset var(--sizes-none) var(--sizes-none) var(--sizes-none) var(--sizes-line) var(--colors-secondary-blue-base);\n}\n\n._pinnedColumnBase_1v1wo_10::after, ._pinnedColumnRight_1v1wo_10::after, ._pinnedColumnLeft_1v1wo_10::after {\n position: absolute;\n top: var(--sizes-none);\n bottom: -1px;\n width: 30px;\n content: \"\";\n pointer-events: none;\n box-sizing: border-box;\n}\n\n._pinnedColumnLeft_1v1wo_10::after {\n transform: translate(100%);\n right: var(--sizes-none);\n box-shadow: inset 10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._pinnedColumnRight_1v1wo_10::after {\n transform: translate(-100%);\n left: var(--sizes-none);\n box-shadow: inset -10px 0px 10px -8px rgba(0, 0, 0, 0.25);\n}\n\n._footerCell_1v1wo_1 {\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n border-top: var(--sizes-line) solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}");
4
+ var styles = {"baseCell":"_baseCell_1v1wo_1","footerCell":"_footerCell_1v1wo_1","pinnedColumnBase":"_pinnedColumnBase_1v1wo_10","pinnedColumnRight":"_pinnedColumnRight_1v1wo_10","pinnedColumnLeft":"_pinnedColumnLeft_1v1wo_10"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=FooterCell.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FooterCell.module.scss.js","sources":["../../../../../../src/components/DataGrid/components/Footer/FooterCell/FooterCell.module.scss"],"sourcesContent":["@use '../../../DataGrid.module.scss';\n\n.footerCell {\n @extend .baseCell;\n\n color: var(--text-body-small-color);\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n line-height: var(--text-body-small-line-height);\n\n border-top: var(--sizes-line) solid var(--colors-secondary-blue-base);\n background-color: var(--colors-neutral-grey-lightest);\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,+2CAAA;AACA,aAAA,CAAA,UAAA,CAAA,mBAAA,CAAA,YAAA,CAAA,qBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA;;;;"}
@@ -3,7 +3,7 @@
3
3
  var React = require('react');
4
4
  var buildClassnames = require('../../../../../utils/buildClassnames.cjs');
5
5
  require('uid/secure');
6
- var Container_module = require('./Container.module.css.cjs');
6
+ var Container_module = require('./Container.module.scss.cjs');
7
7
 
8
8
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
9
9
 
@@ -1 +1 @@
1
- {"version":3,"file":"Container.cjs","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../../utils';\nimport { BorderMode } from '../../../types/enums';\n\nimport {\n container,\n borderModeFull,\n borderModeVertical,\n borderModeNone,\n} from './Container.module.css';\n\ntype ContainerProps = {\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n style?: React.CSSProperties;\n\n /**\n * Child elements.\n */\n children: React.ReactNode;\n};\n\nconst borderModeClassMap = {\n full: borderModeFull,\n vertical: borderModeVertical,\n none: borderModeNone,\n};\n\n/**\n * A container element, which wraps the grid and applies a border and overflow.\n */\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(\n ({ borderMode, style, children }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([container, borderModeClassMap[borderMode]])}\n style={style}\n >\n {children}\n </div>\n ),\n);\n"],"names":["borderModeFull","borderModeVertical","borderModeNone","React","buildClassnames","container"],"mappings":";;;;;;;;;;;AA6BA,MAAM,kBAAkB,GAAG;AACzB,IAAA,IAAI,EAAEA,+BAAc;AACpB,IAAA,QAAQ,EAAEC,mCAAkB;AAC5B,IAAA,IAAI,EAAEC,+BAAc;CACrB;AAED;;AAEG;MACU,SAAS,GAAGC,sBAAK,CAAC,UAAU,CACvC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,MACnCA,sBACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,+BAAe,CAAC,CAACC,0BAAS,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,EACvE,KAAK,EAAE,KAAK,IAEX,QAAQ,CACL,CACP;;;;"}
1
+ {"version":3,"file":"Container.cjs","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../../utils';\nimport { BorderMode } from '../../../types/enums';\n\nimport styles from './Container.module.scss';\n\ntype ContainerProps = {\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n style?: React.CSSProperties;\n\n /**\n * Child elements.\n */\n children: React.ReactNode;\n};\n\nconst borderModeClassMap = {\n full: styles.borderModeFull,\n vertical: styles.borderModeVertical,\n none: styles.borderModeNone,\n};\n\n/**\n * A container element, which wraps the grid and applies a border and overflow.\n */\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(\n ({ borderMode, style, children }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.container, borderModeClassMap[borderMode]])}\n style={style}\n >\n {children}\n </div>\n ),\n);\n"],"names":["styles","React","buildClassnames"],"mappings":";;;;;;;;;;;AAwBA,MAAM,kBAAkB,GAAG;IACzB,IAAI,EAAEA,gBAAM,CAAC,cAAc;IAC3B,QAAQ,EAAEA,gBAAM,CAAC,kBAAkB;IACnC,IAAI,EAAEA,gBAAM,CAAC,cAAc;CAC5B;AAED;;AAEG;MACU,SAAS,GAAGC,sBAAK,CAAC,UAAU,CACvC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,MACnCA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAEC,+BAAe,CAAC,CAACF,gBAAM,CAAC,SAAS,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,EAC9E,KAAK,EAAE,KAAK,IAEX,QAAQ,CACL,CACP;;;;"}
@@ -1,17 +1,17 @@
1
1
  import React__default from 'react';
2
2
  import { buildClassnames } from '../../../../../utils/buildClassnames.js';
3
3
  import 'uid/secure';
4
- import { container, borderModeFull, borderModeVertical, borderModeNone } from './Container.module.css.js';
4
+ import styles from './Container.module.scss.js';
5
5
 
6
6
  const borderModeClassMap = {
7
- full: borderModeFull,
8
- vertical: borderModeVertical,
9
- none: borderModeNone,
7
+ full: styles.borderModeFull,
8
+ vertical: styles.borderModeVertical,
9
+ none: styles.borderModeNone,
10
10
  };
11
11
  /**
12
12
  * A container element, which wraps the grid and applies a border and overflow.
13
13
  */
14
- const Container = React__default.forwardRef(({ borderMode, style, children }, ref) => (React__default.createElement("div", { ref: ref, className: buildClassnames([container, borderModeClassMap[borderMode]]), style: style }, children)));
14
+ const Container = React__default.forwardRef(({ borderMode, style, children }, ref) => (React__default.createElement("div", { ref: ref, className: buildClassnames([styles.container, borderModeClassMap[borderMode]]), style: style }, children)));
15
15
 
16
16
  export { Container };
17
17
  //# sourceMappingURL=Container.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Container.js","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../../utils';\nimport { BorderMode } from '../../../types/enums';\n\nimport {\n container,\n borderModeFull,\n borderModeVertical,\n borderModeNone,\n} from './Container.module.css';\n\ntype ContainerProps = {\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n style?: React.CSSProperties;\n\n /**\n * Child elements.\n */\n children: React.ReactNode;\n};\n\nconst borderModeClassMap = {\n full: borderModeFull,\n vertical: borderModeVertical,\n none: borderModeNone,\n};\n\n/**\n * A container element, which wraps the grid and applies a border and overflow.\n */\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(\n ({ borderMode, style, children }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([container, borderModeClassMap[borderMode]])}\n style={style}\n >\n {children}\n </div>\n ),\n);\n"],"names":["React"],"mappings":";;;;;AA6BA,MAAM,kBAAkB,GAAG;AACzB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,QAAQ,EAAE,kBAAkB;AAC5B,IAAA,IAAI,EAAE,cAAc;CACrB;AAED;;AAEG;MACU,SAAS,GAAGA,cAAK,CAAC,UAAU,CACvC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,MACnCA,cACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,SAAS,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,EACvE,KAAK,EAAE,KAAK,IAEX,QAAQ,CACL,CACP;;;;"}
1
+ {"version":3,"file":"Container.js","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../../../../utils';\nimport { BorderMode } from '../../../types/enums';\n\nimport styles from './Container.module.scss';\n\ntype ContainerProps = {\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n style?: React.CSSProperties;\n\n /**\n * Child elements.\n */\n children: React.ReactNode;\n};\n\nconst borderModeClassMap = {\n full: styles.borderModeFull,\n vertical: styles.borderModeVertical,\n none: styles.borderModeNone,\n};\n\n/**\n * A container element, which wraps the grid and applies a border and overflow.\n */\nexport const Container = React.forwardRef<HTMLDivElement, ContainerProps>(\n ({ borderMode, style, children }, ref) => (\n <div\n ref={ref}\n className={buildClassnames([styles.container, borderModeClassMap[borderMode]])}\n style={style}\n >\n {children}\n </div>\n ),\n);\n"],"names":["React"],"mappings":";;;;;AAwBA,MAAM,kBAAkB,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC,cAAc;IAC3B,QAAQ,EAAE,MAAM,CAAC,kBAAkB;IACnC,IAAI,EAAE,MAAM,CAAC,cAAc;CAC5B;AAED;;AAEG;MACU,SAAS,GAAGA,cAAK,CAAC,UAAU,CACvC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,MACnCA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,EAC9E,KAAK,EAAE,KAAK,IAEX,QAAQ,CACL,CACP;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../../../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._container_1grno_1 {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n overflow-x: auto;\n overflow-y: hidden;\n}\n._container_1grno_1._borderModeFull_1grno_9 {\n border-width: var(--sizes-line);\n border-radius: var(--radius-base);\n}\n._container_1grno_1._borderModeVertical_1grno_13 {\n border-width: var(--sizes-none);\n border-left-width: var(--sizes-line);\n border-right-width: var(--sizes-line);\n}\n._container_1grno_1._borderModeNone_1grno_18 {\n border-width: var(--sizes-none);\n}");
6
+ var styles = {"container":"_container_1grno_1","borderModeFull":"_borderModeFull_1grno_9","borderModeVertical":"_borderModeVertical_1grno_13","borderModeNone":"_borderModeNone_1grno_18"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=Container.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Container.module.scss.cjs","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.module.scss"],"sourcesContent":[".container {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n overflow-x: auto;\n overflow-y: hidden;\n\n &.borderModeFull {\n border-width: var(--sizes-line);\n border-radius: var(--radius-base);\n }\n\n &.borderModeVertical {\n border-width: var(--sizes-none);\n border-left-width: var(--sizes-line);\n border-right-width: var(--sizes-line);\n }\n\n &.borderModeNone {\n border-width: var(--sizes-none);\n }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,wjBAAA;AACA,aAAA,CAAA,WAAA,CAAA,oBAAA,CAAA,gBAAA,CAAA,yBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,gBAAA,CAAA,0BAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../../../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._container_1grno_1 {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n overflow-x: auto;\n overflow-y: hidden;\n}\n._container_1grno_1._borderModeFull_1grno_9 {\n border-width: var(--sizes-line);\n border-radius: var(--radius-base);\n}\n._container_1grno_1._borderModeVertical_1grno_13 {\n border-width: var(--sizes-none);\n border-left-width: var(--sizes-line);\n border-right-width: var(--sizes-line);\n}\n._container_1grno_1._borderModeNone_1grno_18 {\n border-width: var(--sizes-none);\n}");
4
+ var styles = {"container":"_container_1grno_1","borderModeFull":"_borderModeFull_1grno_9","borderModeVertical":"_borderModeVertical_1grno_13","borderModeNone":"_borderModeNone_1grno_18"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=Container.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Container.module.scss.js","sources":["../../../../../../src/components/DataGrid/components/GridContainer/Container/Container.module.scss"],"sourcesContent":[".container {\n width: 100%;\n position: relative;\n border-style: solid;\n border-color: var(--colors-neutral-grey-dark);\n\n overflow-x: auto;\n overflow-y: hidden;\n\n &.borderModeFull {\n border-width: var(--sizes-line);\n border-radius: var(--radius-base);\n }\n\n &.borderModeVertical {\n border-width: var(--sizes-none);\n border-left-width: var(--sizes-line);\n border-right-width: var(--sizes-line);\n }\n\n &.borderModeNone {\n border-width: var(--sizes-none);\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,wjBAAA;AACA,aAAA,CAAA,WAAA,CAAA,oBAAA,CAAA,gBAAA,CAAA,yBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,gBAAA,CAAA,0BAAA;;;;"}
@@ -4,7 +4,7 @@ var React = require('react');
4
4
  var index = require('../../../../theme/index.cjs');
5
5
  var buildClassnames = require('../../../../utils/buildClassnames.cjs');
6
6
  var Container = require('./Container/Container.cjs');
7
- var GridContainer_module = require('./GridContainer.module.css.cjs');
7
+ var GridContainer_module = require('./GridContainer.module.scss.cjs');
8
8
  var usePinnedColumnLayout = require('../../hooks/usePinnedColumnLayout.cjs');
9
9
 
10
10
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -1 +1 @@
1
- {"version":3,"file":"GridContainer.cjs","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport { dataGridStyle } from './GridContainer.module.css';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> & {\n /**\n * Reference to be used for the outer container element.\n */\n containerRef?: RefObject<HTMLDivElement>;\n\n /**\n * Reference to be used for the table element.\n */\n tableRef?: RefObject<HTMLTableElement>;\n\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n containerStyles?: CSSProperties;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n\n /**\n * Whether resizeable columns are enabled or not.\n */\n enableResizeableColumns: boolean;\n\n /**\n * Density of the grid.\n */\n density: keyof SizeScale;\n\n /**\n * The TanStack Table instance.\n */\n table: Table<any>;\n\n /**\n * Child elements (table contents).\n */\n children: ReactNode;\n};\n\nconst gridContainerClassname = buildClassnames([dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n containerRef,\n tableRef,\n borderMode,\n containerStyles,\n ariaRoles,\n enableResizeableColumns,\n density,\n table,\n children,\n 'aria-label': ariaLabel,\n}: GridContainerProps) => {\n const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n\n return (\n <Container ref={containerRef} borderMode={borderMode} style={containerStyles}>\n <table\n ref={tableRef}\n className={gridContainerClassname}\n role={ariaRoles.table}\n style={\n {\n tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n '--density': theme.sizes[density],\n ...pinnedColumnLayoutStyles,\n } as CSSProperties\n }\n aria-colcount={table.getFlatHeaders().length}\n aria-rowcount={table.getRowCount()}\n aria-label={ariaLabel}\n >\n {children}\n </table>\n </Container>\n );\n};\n"],"names":["buildClassnames","dataGridStyle","usePinnedColumnLayout","React","Container","theme"],"mappings":";;;;;;;;;;;;;AA8DA,MAAM,sBAAsB,GAAGA,+BAAe,CAAC,CAACC,kCAAa,EAAE,WAAW,CAAC,CAAC;AAE5E;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAGC,2CAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AAErE,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,mBAAS,EAAA,EAAC,GAAG,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,eAAe,EAAA;AAC1E,QAAAD,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,sBAAsB,EACjC,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAEE,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AACX,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
1
+ {"version":3,"file":"GridContainer.cjs","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> & {\n /**\n * Reference to be used for the outer container element.\n */\n containerRef?: RefObject<HTMLDivElement>;\n\n /**\n * Reference to be used for the table element.\n */\n tableRef?: RefObject<HTMLTableElement>;\n\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n containerStyles?: CSSProperties;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n\n /**\n * Whether resizeable columns are enabled or not.\n */\n enableResizeableColumns: boolean;\n\n /**\n * Density of the grid.\n */\n density: keyof SizeScale;\n\n /**\n * The TanStack Table instance.\n */\n table: Table<any>;\n\n /**\n * Child elements (table contents).\n */\n children: ReactNode;\n};\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n containerRef,\n tableRef,\n borderMode,\n containerStyles,\n ariaRoles,\n enableResizeableColumns,\n density,\n table,\n children,\n 'aria-label': ariaLabel,\n}: GridContainerProps) => {\n const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n\n return (\n <Container ref={containerRef} borderMode={borderMode} style={containerStyles}>\n <table\n ref={tableRef}\n className={gridContainerClassname}\n role={ariaRoles.table}\n style={\n {\n tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n '--density': theme.sizes[density],\n ...pinnedColumnLayoutStyles,\n } as CSSProperties\n }\n aria-colcount={table.getFlatHeaders().length}\n aria-rowcount={table.getRowCount()}\n aria-label={ariaLabel}\n >\n {children}\n </table>\n </Container>\n );\n};\n"],"names":["buildClassnames","styles","usePinnedColumnLayout","React","Container","theme"],"mappings":";;;;;;;;;;;;;AA8DA,MAAM,sBAAsB,GAAGA,+BAAe,CAAC,CAACC,oBAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAGC,2CAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AAErE,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,mBAAS,EAAA,EAAC,GAAG,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,eAAe,EAAA;AAC1E,QAAAD,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,sBAAsB,EACjC,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAEE,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AACX,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
@@ -2,10 +2,10 @@ import React__default from 'react';
2
2
  import { theme } from '../../../../theme/index.js';
3
3
  import { buildClassnames } from '../../../../utils/buildClassnames.js';
4
4
  import { Container } from './Container/Container.js';
5
- import { dataGridStyle } from './GridContainer.module.css.js';
5
+ import styles from './GridContainer.module.scss.js';
6
6
  import { usePinnedColumnLayout } from '../../hooks/usePinnedColumnLayout.js';
7
7
 
8
- const gridContainerClassname = buildClassnames([dataGridStyle, 'data-grid']);
8
+ const gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);
9
9
  /**
10
10
  * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies
11
11
  * styling and sets table-specific CSS variables (such as density).
@@ -1 +1 @@
1
- {"version":3,"file":"GridContainer.js","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport { dataGridStyle } from './GridContainer.module.css';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> & {\n /**\n * Reference to be used for the outer container element.\n */\n containerRef?: RefObject<HTMLDivElement>;\n\n /**\n * Reference to be used for the table element.\n */\n tableRef?: RefObject<HTMLTableElement>;\n\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n containerStyles?: CSSProperties;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n\n /**\n * Whether resizeable columns are enabled or not.\n */\n enableResizeableColumns: boolean;\n\n /**\n * Density of the grid.\n */\n density: keyof SizeScale;\n\n /**\n * The TanStack Table instance.\n */\n table: Table<any>;\n\n /**\n * Child elements (table contents).\n */\n children: ReactNode;\n};\n\nconst gridContainerClassname = buildClassnames([dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n containerRef,\n tableRef,\n borderMode,\n containerStyles,\n ariaRoles,\n enableResizeableColumns,\n density,\n table,\n children,\n 'aria-label': ariaLabel,\n}: GridContainerProps) => {\n const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n\n return (\n <Container ref={containerRef} borderMode={borderMode} style={containerStyles}>\n <table\n ref={tableRef}\n className={gridContainerClassname}\n role={ariaRoles.table}\n style={\n {\n tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n '--density': theme.sizes[density],\n ...pinnedColumnLayoutStyles,\n } as CSSProperties\n }\n aria-colcount={table.getFlatHeaders().length}\n aria-rowcount={table.getRowCount()}\n aria-label={ariaLabel}\n >\n {children}\n </table>\n </Container>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;AA8DA,MAAM,sBAAsB,GAAG,eAAe,CAAC,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAE5E;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAG,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AAErE,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,GAAG,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,eAAe,EAAA;AAC1E,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,sBAAsB,EACjC,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AACX,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
1
+ {"version":3,"file":"GridContainer.js","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> & {\n /**\n * Reference to be used for the outer container element.\n */\n containerRef?: RefObject<HTMLDivElement>;\n\n /**\n * Reference to be used for the table element.\n */\n tableRef?: RefObject<HTMLTableElement>;\n\n /**\n * Border mode.\n */\n borderMode: BorderMode;\n\n /**\n * Additional container styles.\n */\n containerStyles?: CSSProperties;\n\n /**\n * ARIA roles used in the grid.\n */\n ariaRoles: AriaRoles;\n\n /**\n * Whether resizeable columns are enabled or not.\n */\n enableResizeableColumns: boolean;\n\n /**\n * Density of the grid.\n */\n density: keyof SizeScale;\n\n /**\n * The TanStack Table instance.\n */\n table: Table<any>;\n\n /**\n * Child elements (table contents).\n */\n children: ReactNode;\n};\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n containerRef,\n tableRef,\n borderMode,\n containerStyles,\n ariaRoles,\n enableResizeableColumns,\n density,\n table,\n children,\n 'aria-label': ariaLabel,\n}: GridContainerProps) => {\n const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n\n return (\n <Container ref={containerRef} borderMode={borderMode} style={containerStyles}>\n <table\n ref={tableRef}\n className={gridContainerClassname}\n role={ariaRoles.table}\n style={\n {\n tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n '--density': theme.sizes[density],\n ...pinnedColumnLayoutStyles,\n } as CSSProperties\n }\n aria-colcount={table.getFlatHeaders().length}\n aria-rowcount={table.getRowCount()}\n aria-label={ariaLabel}\n >\n {children}\n </table>\n </Container>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;AA8DA,MAAM,sBAAsB,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAG,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AAErE,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,GAAG,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,eAAe,EAAA;AAC1E,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,sBAAsB,EACjC,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AACX,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ var ___$insertStyle = require('../../../../_virtual/____insertStyle.cjs');
4
+
5
+ ___$insertStyle("._dataGridStyle_1irlp_1 {\n position: relative;\n border-spacing: var(--sizes-none);\n box-sizing: border-box;\n inline-size: 100%;\n}");
6
+ var styles = {"dataGridStyle":"_dataGridStyle_1irlp_1"};
7
+
8
+ module.exports = styles;
9
+ //# sourceMappingURL=GridContainer.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"GridContainer.module.scss.cjs","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.module.scss"],"sourcesContent":[".dataGridStyle {\n position: relative;\n\n border-spacing: var(--sizes-none);\n box-sizing: border-box;\n\n inline-size: 100%;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,4IAAA;AAEA,aAAA,CAAA,eAAA,CAAA,wBAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import insertStyle from '../../../../_virtual/____insertStyle.js';
2
+
3
+ insertStyle("._dataGridStyle_1irlp_1 {\n position: relative;\n border-spacing: var(--sizes-none);\n box-sizing: border-box;\n inline-size: 100%;\n}");
4
+ var styles = {"dataGridStyle":"_dataGridStyle_1irlp_1"};
5
+
6
+ export { styles as default };
7
+ //# sourceMappingURL=GridContainer.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"GridContainer.module.scss.js","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.module.scss"],"sourcesContent":[".dataGridStyle {\n position: relative;\n\n border-spacing: var(--sizes-none);\n box-sizing: border-box;\n\n inline-size: 100%;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,4IAAA;AAEA,aAAA,CAAA,eAAA,CAAA,wBAAA;;;;"}
@@ -7,7 +7,7 @@ require('uid/secure');
7
7
  var isLastColumn = require('../../../utils/isLastColumn.cjs');
8
8
  var usePinnedColumnStyles = require('../../../hooks/usePinnedColumnStyles.cjs');
9
9
  var Resizer = require('../Resizer/Resizer.cjs');
10
- var HeaderCell_module = require('./HeaderCell.module.css.cjs');
10
+ var HeaderCell_module = require('./HeaderCell.module.scss.cjs');
11
11
  var SortIcon = require('./SortIcon/SortIcon.cjs');
12
12
 
13
13
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }