@m4l/components 3.1.7 → 3.1.8

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 (201) hide show
  1. package/index.js +183 -340
  2. package/node_modules-CQtkw0uG.js +7350 -0
  3. package/package.json +1 -1
  4. package/vendor-AfIOyqRr.js +24636 -0
  5. package/components/AccountPopover/index-Dm2-k-Mv.js +0 -334
  6. package/components/AppBar/index-i0rhG3J1.js +0 -93
  7. package/components/BaseModule/index-CiNNlxzS.js +0 -30
  8. package/components/CommonActions/components/ActionCancel/index-CIdpDXkr.js +0 -12
  9. package/components/CommonActions/components/ActionFormCancel/index-CpyASN3q.js +0 -56
  10. package/components/CommonActions/components/ActionFormIntro/index-7KKtcUra.js +0 -33
  11. package/components/CommonActions/components/ActionIntro/index-CqqDZZcG.js +0 -25
  12. package/components/CommonActions/components/Actions/index-CuG1pnXW.js +0 -70
  13. package/components/DataGrid/constants-8L7QgBKi.js +0 -10
  14. package/components/DataGrid/formatters/ColumnBooleanFormatter/index-CveSCbq_.js +0 -26
  15. package/components/DataGrid/formatters/ColumnConcatenatedValueFormatter/index-CHqvieM2.js +0 -22
  16. package/components/DataGrid/formatters/ColumnDateFormatter/index-CKg8CJ6A.js +0 -19
  17. package/components/DataGrid/formatters/ColumnInteractiveCheckFormatter/index-DE6bwaKP.js +0 -23
  18. package/components/DataGrid/formatters/ColumnNestedValueFormatter/index-BslXGK-A.js +0 -14
  19. package/components/DataGrid/formatters/ColumnPointsFormatter/index-BXGW2CsK.js +0 -10
  20. package/components/DataGrid/formatters/ColumnPriceFormatter/index-O11tBykn.js +0 -10
  21. package/components/DataGrid/formatters/ColumnSetCheckFormatter/index-BaCawLr1.js +0 -36
  22. package/components/DataGrid/formatters/ColumnUncertaintyFormatter/index-Cq7a-jnE.js +0 -10
  23. package/components/DataGrid/formatters/index-CrZXPa0e.js +0 -13
  24. package/components/DataGrid/index-BZ-lbmuU.js +0 -908
  25. package/components/DataGrid/subcomponents/Actions/index-CHvPZ4Ru.js +0 -549
  26. package/components/DataGrid/subcomponents/editors/TextEditor/index-BIFm8akr.js +0 -80
  27. package/components/DragResizeWindow/index-D2jLYExo.js +0 -505
  28. package/components/DynamicFilter/constants-ByqmFATV.js +0 -31
  29. package/components/DynamicFilter/dictionary-PrbXU3VZ.js +0 -51
  30. package/components/DynamicFilter/index-DZiJc9h7.js +0 -116
  31. package/components/DynamicFilter/slots/SlotsEnum-cawFeNzx.js +0 -34
  32. package/components/DynamicFilter/slots/dynamicFilterSlots-DHxelhXP.js +0 -151
  33. package/components/DynamicFilter/slots/index-l0sNRNKZ.js +0 -1
  34. package/components/DynamicFilter/store/index-BT-eWVnJ.js +0 -254
  35. package/components/DynamicFilter/subcomponents/AppliedFilterChip/index-B32bAzi-.js +0 -60
  36. package/components/DynamicFilter/subcomponents/AppliedFilters/index-Bha19drV.js +0 -26
  37. package/components/DynamicFilter/subcomponents/DynamicFilterBase/index-BmvzoHit.js +0 -40
  38. package/components/DynamicFilter/subcomponents/FieldTypes/BooleanFilter/index-BcO3SlP5.js +0 -129
  39. package/components/DynamicFilter/subcomponents/FieldTypes/DateTimeFilter/index-BCJhpNS8.js +0 -171
  40. package/components/DynamicFilter/subcomponents/FieldTypes/NumberFilter/index-DCNhz68u.js +0 -153
  41. package/components/DynamicFilter/subcomponents/FieldTypes/SelectFilter/index-BdypjM1Y.js +0 -146
  42. package/components/DynamicFilter/subcomponents/FieldTypes/StringFilter/index-D-NFIVnK.js +0 -114
  43. package/components/DynamicFilter/subcomponents/FieldTypes/index-BwQHJqk9.js +0 -38
  44. package/components/DynamicFilter/subcomponents/FilterActions/index-B9UWmk07.js +0 -88
  45. package/components/DynamicFilter/subcomponents/InputFilter/index-CfGb1TfV.js +0 -188
  46. package/components/DynamicFilter/subcomponents/PopoverFilter/index-DkfRGrlO.js +0 -158
  47. package/components/DynamicFilter/subcomponents/PopoverMenuFields/index-DSegwAm2.js +0 -63
  48. package/components/FieldLabel/index-CI57EizR.js +0 -54
  49. package/components/GridLayout/index-C4HyxNYX.js +0 -1044
  50. package/components/GridLayout/subcomponents/Griditem/index-C7jT4s8t.js +0 -395
  51. package/components/GridLayout/subcomponents/Responsive/index-BKcU2OnF.js +0 -348
  52. package/components/GridLayout/subcomponents/SizeProvider/index-1aJ-e_54.js +0 -71
  53. package/components/HelperText/index-Crn_XIPF.js +0 -50
  54. package/components/Icon/index-C89MAkeH.js +0 -176
  55. package/components/Image/index-COp8vP0X.js +0 -175
  56. package/components/LanguagePopover/index-BA2Igs9L.js +0 -179
  57. package/components/LinearProgressIndeterminate/index-BwI756Mb.js +0 -55
  58. package/components/Loadable/index-BMbi9ISF.js +0 -9
  59. package/components/LoadingError/index-Cf0oGUrL.js +0 -89
  60. package/components/MFIsolationApp/index-V4R55hNU.js +0 -169
  61. package/components/MFLoader/index-BI8vQZSH.js +0 -299
  62. package/components/ModalDialog/index-CEVQBQ7W.js +0 -77
  63. package/components/NavLink/index-D1S_vtFO.js +0 -55
  64. package/components/NoItemSelected/index-B9oM26AX.js +0 -54
  65. package/components/ObjectLogs/index-CiXOJpS4.js +0 -233
  66. package/components/PDFViewer/index-GVN2rfd6.js +0 -51
  67. package/components/Page/index-DZMkYmr4.js +0 -117
  68. package/components/PaperForm/index-DwgAfjci.js +0 -59
  69. package/components/Period/index-2pJG3VmY.js +0 -238
  70. package/components/PrintingSystem/index-B2qcnfw0.js +0 -187
  71. package/components/PrintingSystem/subcomponents/BodyNode/index-Cv2aoy8S.js +0 -49
  72. package/components/PrintingSystem/subcomponents/ChartNode/index-BmJm8v_C.js +0 -105
  73. package/components/PrintingSystem/subcomponents/DividerNode/index-MpFhE-H0.js +0 -20
  74. package/components/PrintingSystem/subcomponents/FooterNode/index-ZEcWdMSM.js +0 -49
  75. package/components/PrintingSystem/subcomponents/GridNode/index-SsKax2xu.js +0 -74
  76. package/components/PrintingSystem/subcomponents/HeaderNode/index-Cs8TOOBL.js +0 -49
  77. package/components/PrintingSystem/subcomponents/PaperNode/index-DBb25Ecg.js +0 -30
  78. package/components/PrintingSystem/subcomponents/PropertyValueNode/index-CTVn7J9Q.js +0 -47
  79. package/components/PrintingSystem/subcomponents/SectionNode/index-iYPM3EaS.js +0 -49
  80. package/components/PrintingSystem/subcomponents/TextBoxNode/index-DGjXCFKJ.js +0 -24
  81. package/components/PropertyValue/index-Bh-Jnrte.js +0 -264
  82. package/components/Resizeable/index-DdP1xfE9.js +0 -20
  83. package/components/ScrollBar/index-f2URPPE2.js +0 -35
  84. package/components/ScrollToTop/index-TxORk5dB.js +0 -12
  85. package/components/SideBar/index-PUBBe0yH.js +0 -758
  86. package/components/SplitLayout/index-Bu1hcO6G.js +0 -89
  87. package/components/ToastContainer/index-DK1d8NNd.js +0 -191
  88. package/components/WrapperComponent/index-BHV-CsDU.js +0 -14
  89. package/components/animate/LoadingScreen/index-CkVLOrMz.js +0 -70
  90. package/components/animate/MotionContainer/index-eartnWyO.js +0 -34
  91. package/components/animate/MotionLazyContainer/index-Be8osTiG.js +0 -9
  92. package/components/animate/PropagateLoader/index-Bkq8V2SN.js +0 -23
  93. package/components/animate/features-BbnE33u3.js +0 -5
  94. package/components/animate/index-BsWiJfzp.js +0 -89
  95. package/components/animate/variants/bounce-DanQqHAX.js +0 -101
  96. package/components/animate/variants/container-Dmpr6tg5.js +0 -22
  97. package/components/animate/variants/fade-CAOJNn06.js +0 -65
  98. package/components/animate/variants/index-l0sNRNKZ.js +0 -1
  99. package/components/animate/variants/transition-B9W5SWTa.js +0 -20
  100. package/components/areas/components/AreasAdmin/index-OxQU3P8Y.js +0 -699
  101. package/components/areas/components/AreasViewer/index-DQ0aPioP.js +0 -805
  102. package/components/areas/components/index-l0sNRNKZ.js +0 -1
  103. package/components/areas/constants-rqODZNZe.js +0 -6
  104. package/components/areas/contexts/AreasContext/index-BqRlA7JA.js +0 -1110
  105. package/components/areas/contexts/DynamicMFParmsContext/index-22c6E7vK.js +0 -36
  106. package/components/areas/contexts/WindowToolsMFContext/index-DkE30fhm.js +0 -12
  107. package/components/areas/contexts/index-l0sNRNKZ.js +0 -1
  108. package/components/areas/dictionary-YUsP9beq.js +0 -36
  109. package/components/areas/hooks/index-l0sNRNKZ.js +0 -1
  110. package/components/areas/hooks/useAreas/index-BSbwbJLS.js +0 -11
  111. package/components/areas/hooks/useDynamicMFParameters/index-DhbcZPs9.js +0 -12
  112. package/components/areas/hooks/useSetWindowsTitle/useSetWindowsTitle-BzPD-miW.js +0 -31
  113. package/components/areas/hooks/useWindowToolsMF/index-BECQfhbC.js +0 -10
  114. package/components/areas/icons-CwFr-alN.js +0 -24
  115. package/components/areas/index-B_Odny9h.js +0 -22
  116. package/components/commercial/AppBarCommercial/index-CHq3P3GY.js +0 -28
  117. package/components/commercial/SectionCommercial/index-BeABGtdr.js +0 -56
  118. package/components/commercial/TopBar/index-F1repmti.js +0 -232
  119. package/components/commercial/index-CxDzs6Ax.js +0 -81
  120. package/components/formatters/BooleanFormatter/index-DktIidqW.js +0 -44
  121. package/components/formatters/DateFormatter/index-CGcRZ8BA.js +0 -43
  122. package/components/formatters/PointsFormatter/index-C7sR8iqk.js +0 -25
  123. package/components/formatters/PriceFormatter/index-CsvRawmc.js +0 -35
  124. package/components/formatters/UncertaintyFormatter/index-B9ESVEVp.js +0 -29
  125. package/components/formatters/index-pnJhDYKe.js +0 -109
  126. package/components/hook-form/HelperError/index-BVnmUazV.js +0 -19
  127. package/components/hook-form/RHFAutocomplete/index-BtPL16HR.js +0 -657
  128. package/components/hook-form/RHFAutocompleteAsync/index-BfzjLHG8.js +0 -226
  129. package/components/hook-form/RHFCheckbox/index-Vyttu8Vx.js +0 -132
  130. package/components/hook-form/RHFColorPicker/index-Cxxb5Wa_.js +0 -191
  131. package/components/hook-form/RHFDateTime/index-CW1Slb-f.js +0 -190
  132. package/components/hook-form/RHFMultiCheckbox/index-BARudV1A.js +0 -34
  133. package/components/hook-form/RHFPeriod/index-r-HeIOoZ.js +0 -98
  134. package/components/hook-form/RHFRadioGroup/index-CTD-0zKo.js +0 -52
  135. package/components/hook-form/RHFSelect/index-LdwRuFz-.js +0 -29
  136. package/components/hook-form/RHFTextField/index-B6ufruSB.js +0 -337
  137. package/components/hook-form/RHFUpload/index-CDPbm8NR.js +0 -253
  138. package/components/maps/components/GpsTools/index-5MXlhIEt.js +0 -1948
  139. package/components/maps/components/Map/index-2Lx5ARXa.js +0 -2546
  140. package/components/maps/index-Ci-7-FHg.js +0 -7
  141. package/components/modal/WindowBase-Gd27v5FU.js +0 -44
  142. package/components/modal/WindowConfirm-u6vAMFo7.js +0 -73
  143. package/components/modal/index-CydPIpKZ.js +0 -65
  144. package/components/mui_extended/Accordion/index-DMLYJL7o.js +0 -124
  145. package/components/mui_extended/Avatar/index-ClBa-6eF.js +0 -64
  146. package/components/mui_extended/Badge/index-zI-F_Qkq.js +0 -29
  147. package/components/mui_extended/BoxIcon/index-BUTJ2tKw.js +0 -22
  148. package/components/mui_extended/Breadcrumbs/index-DTS7rOZH.js +0 -86
  149. package/components/mui_extended/Button/index-CGfZbaea.js +0 -222
  150. package/components/mui_extended/CheckBox-BXUrbonB.js +0 -76
  151. package/components/mui_extended/CircularProgress/index-Bnnti_G6.js +0 -8
  152. package/components/mui_extended/IconButton/classes/constants-ChY2jKkp.js +0 -4
  153. package/components/mui_extended/IconButton/classes/index-BxjJGAqZ.js +0 -45
  154. package/components/mui_extended/IconButton/index-CusYFjie.js +0 -97
  155. package/components/mui_extended/IconButton/styledIconButton-fAsbGoFS.js +0 -7
  156. package/components/mui_extended/LinearProgress/index-CGgW8jq2.js +0 -9
  157. package/components/mui_extended/LinkWithRoute/index-BC2miUjR.js +0 -15
  158. package/components/mui_extended/MenuActions/MenuActions-C6CjSU6C.js +0 -149
  159. package/components/mui_extended/MenuActions/constants-BwsU9chA.js +0 -10
  160. package/components/mui_extended/MenuActions/dictionary-Dj_07puT.js +0 -11
  161. package/components/mui_extended/MenuActions/slots/MenuActionsEnum-Bu-L6eWU.js +0 -13
  162. package/components/mui_extended/MenuActions/slots/MenuActionsSlots-D65KZAKF.js +0 -46
  163. package/components/mui_extended/Pager/index-DCbxiTZA.js +0 -257
  164. package/components/mui_extended/Popover/index-DfrJAQkV.js +0 -153
  165. package/components/mui_extended/Stack/index-DzEeCYfp.js +0 -31
  166. package/components/mui_extended/Tab/index-Bu3dPidV.js +0 -129
  167. package/components/mui_extended/ToggleButton/index-C9cBkT1V.js +0 -18
  168. package/components/mui_extended/ToggleIconButton/index--0b3Td6C.js +0 -26
  169. package/components/mui_extended/Tooltip/index-B8QUytCK.js +0 -42
  170. package/components/mui_extended/Typography/index-Cf_4Zw8f.js +0 -54
  171. package/components/mui_extended/index-l0sNRNKZ.js +0 -1
  172. package/components/popups/PopupsProvider/index-DhSxmtfJ.js +0 -172
  173. package/components/popups/PopupsViewer/constants-DuyD7aCn.js +0 -4
  174. package/components/popups/PopupsViewer/icons-BUujqqbu.js +0 -7
  175. package/components/popups/PopupsViewer/index-BecevSns.js +0 -172
  176. package/components/popups/PopupsViewer/slots/index-B98CiRLa.js +0 -14
  177. package/components/popups/PopupsViewer/slots/popupsViewerSlots-BXH77nCF.js +0 -46
  178. package/components/popups/index-l0sNRNKZ.js +0 -1
  179. package/contexts/ModalContext/index-CPfNnfTL.js +0 -39
  180. package/contexts/RHFormContext/index-D_nK759o.js +0 -78
  181. package/hocs/withToggle/index-C1_DMZD3.js +0 -14
  182. package/hooks/useFormAddEdit/index-D9oSjUn1.js +0 -90
  183. package/hooks/useFormReadyForUpdate/index-B3HygFCM.js +0 -20
  184. package/hooks/useModal/index-BJSQOX3U.js +0 -10
  185. package/hooks/useSizeContainer/index-D4hDjM1P.js +0 -37
  186. package/hooks/useStateRef/index-C3P6ZK3m.js +0 -15
  187. package/hooks/useTab/index-B_GEQFOP.js +0 -12
  188. package/react-data-grid-BfYuZ6AK.js +0 -2606
  189. package/react-draggable-DsCPdgQP.js +0 -811
  190. package/react-json-view-bhqIAaNg.js +0 -2576
  191. package/react-resizable-eBbFl2dX.js +0 -618
  192. package/react-spinners-TpKN9lZg.js +0 -123
  193. package/react-splitter-layout-C-JTsNGs.js +0 -158
  194. package/styles/DynamicFilter-CJFsIegc.js +0 -319
  195. package/styles/MenuActions-lTi-ynPM.js +0 -42
  196. package/styles/index-DKj6m8SL.js +0 -1691
  197. package/test/constants_no_mock-CF-669v-.js +0 -4
  198. package/test/getNameDataTestId-BaBTWhBr.js +0 -10
  199. package/utils/index-DiMrtgIu.js +0 -502
  200. /package/components/GridLayout/subcomponents/{Griditem → GridItem}/index.d.ts +0 -0
  201. /package/components/GridLayout/subcomponents/{Griditem → GridItem}/types.d.ts +0 -0
@@ -1,2606 +0,0 @@
1
- import { forwardRef, useRef, createContext, useContext, useState, useMemo, useImperativeHandle, useCallback, useEffect, useLayoutEffect as useLayoutEffect$1, memo } from "react";
2
- import clsx from "clsx";
3
- import { jsx, jsxs, Fragment } from "react/jsx-runtime";
4
- function styleInject(css, ref) {
5
- if (ref === void 0) ref = {};
6
- var insertAt = ref.insertAt;
7
- if (!css || typeof document === "undefined") {
8
- return;
9
- }
10
- var head = document.head || document.getElementsByTagName("head")[0];
11
- var style = document.createElement("style");
12
- style.type = "text/css";
13
- if (insertAt === "top") {
14
- if (head.firstChild) {
15
- head.insertBefore(style, head.firstChild);
16
- } else {
17
- head.appendChild(style);
18
- }
19
- } else {
20
- head.appendChild(style);
21
- }
22
- if (style.styleSheet) {
23
- style.styleSheet.cssText = css;
24
- } else {
25
- style.appendChild(document.createTextNode(css));
26
- }
27
- }
28
- var css_248z$f = ".c1wupbe700-beta13{background-color:inherit;border-block-end:1px solid var(--rdg-border-color);border-inline-end:1px solid var(--rdg-border-color);contain:size style;grid-row-start:var(--rdg-grid-row-start);outline:none;overflow:hidden;overflow:clip;padding-block:0;padding-inline:8px;position:relative;text-overflow:ellipsis;white-space:nowrap}.c1wupbe700-beta13[aria-selected=true]{outline:2px solid var(--rdg-selection-color);outline-offset:-2px}.cd0kgiy700-beta13 .c1wupbe700-beta13{contain:content}.c1730fa4700-beta13{position:sticky;z-index:1}.c9dpaye700-beta13{box-shadow:calc(2px*var(--rdg-sign)) 0 5px -2px hsla(0,0%,53%,.3)}";
29
- styleInject(css_248z$f, { "insertAt": "top" });
30
- const cell = "c1wupbe700-beta13";
31
- const cellClassname = `rdg-cell ${cell}`;
32
- const cellAutoResizeClassname = "cd0kgiy700-beta13";
33
- const cellFrozen = "c1730fa4700-beta13";
34
- const cellFrozenClassname = `rdg-cell-frozen ${cellFrozen}`;
35
- const cellFrozenLast = "c9dpaye700-beta13";
36
- const cellFrozenLastClassname = `rdg-cell-frozen-last ${cellFrozenLast}`;
37
- var css_248z$e = '.r104f42s700-beta13{--rdg-color:#000;--rdg-border-color:#ddd;--rdg-summary-border-color:#aaa;--rdg-background-color:#fff;--rdg-header-background-color:#f9f9f9;--rdg-row-hover-background-color:#f5f5f5;--rdg-row-selected-background-color:#dbecfa;--row-selected-hover-background-color:#c9e3f8;--rdg-checkbox-color:#005194;--rdg-checkbox-focus-color:#61b8ff;--rdg-checkbox-disabled-border-color:#ccc;--rdg-checkbox-disabled-background-color:#ddd;--rdg-selection-color:#66afe9;--rdg-font-size:14px;content-visibility:auto;background-color:var(--rdg-background-color);block-size:350px;border:1px solid var(--rdg-border-color);box-sizing:border-box;color:var(--rdg-color);color-scheme:var(--rdg-color-scheme,light dark);contain:strict;contain:size layout style paint;display:grid;font-size:var(--rdg-font-size);overflow:auto;user-select:none}@supports not (contain:strict){.r104f42s700-beta13{position:relative;z-index:0}}.r104f42s700-beta13 *,.r104f42s700-beta13 :after,.r104f42s700-beta13 :before{box-sizing:inherit}.r104f42s700-beta13:before{content:"";grid-column:1/-1;grid-row:1/-1}.r104f42s700-beta13.rdg-dark{--rdg-color-scheme:dark;--rdg-color:#ddd;--rdg-border-color:#444;--rdg-summary-border-color:#555;--rdg-background-color:#212121;--rdg-header-background-color:#1b1b1b;--rdg-row-hover-background-color:#171717;--rdg-row-selected-background-color:#1a73bc;--row-selected-hover-background-color:#1768ab;--rdg-checkbox-color:#94cfff;--rdg-checkbox-focus-color:#c7e6ff;--rdg-checkbox-disabled-border-color:#000;--rdg-checkbox-disabled-background-color:#333}.r104f42s700-beta13.rdg-light{--rdg-color-scheme:light}@media (prefers-color-scheme:dark){.r104f42s700-beta13:not(.rdg-light){--rdg-color:#ddd;--rdg-border-color:#444;--rdg-summary-border-color:#555;--rdg-background-color:#212121;--rdg-header-background-color:#1b1b1b;--rdg-row-hover-background-color:#171717;--rdg-row-selected-background-color:#1a73bc;--row-selected-hover-background-color:#1768ab;--rdg-checkbox-color:#94cfff;--rdg-checkbox-focus-color:#c7e6ff;--rdg-checkbox-disabled-border-color:#000;--rdg-checkbox-disabled-background-color:#333}}.v7ly7s700-beta13.r1otpg64700-beta13{cursor:move}.fc4f4zb700-beta13{grid-column:1/-1;pointer-events:none;z-index:4}';
38
- styleInject(css_248z$e, { "insertAt": "top" });
39
- const root = "r104f42s700-beta13";
40
- const rootClassname = `rdg ${root}`;
41
- const viewportDragging = "v7ly7s700-beta13";
42
- const viewportDraggingClassname = `rdg-viewport-dragging ${viewportDragging}`;
43
- const focusSinkClassname = "fc4f4zb700-beta13";
44
- var css_248z$d = '.r1otpg64700-beta13{background-color:var(--rdg-background-color);display:contents;line-height:var(--rdg-row-height)}.r1otpg64700-beta13:hover{background-color:var(--rdg-row-hover-background-color)}.r1otpg64700-beta13[aria-selected=true]{background-color:var(--rdg-row-selected-background-color)}.r1otpg64700-beta13[aria-selected=true]:hover{background-color:var(--row-selected-hover-background-color)}.rel5gk2700-beta13{outline:2px solid var(--rdg-selection-color);outline-offset:-2px}.r1qymf1z700-beta13:before{border-inline-start:2px solid var(--rdg-selection-color);content:"";display:inline-block;height:100%;inset-inline-start:0;position:sticky}';
45
- styleInject(css_248z$d, { "insertAt": "top" });
46
- const row = "r1otpg64700-beta13";
47
- const rowClassname = `rdg-row ${row}`;
48
- const rowSelected = "rel5gk2700-beta13";
49
- const rowSelectedClassname = `rdg-row-selected`;
50
- const rowSelectedWithFrozenCell = "r1qymf1z700-beta13";
51
- var css_248z$c = '.cd9l4jz700-beta13{align-items:center;cursor:pointer;display:flex;inset:0;justify-content:center;margin-inline-end:1px;position:absolute}.c1noyk41700-beta13{all:unset}.cdwjxv8700-beta13{background-color:var(--rdg-background-color);block-size:20px;border:2px solid var(--rdg-border-color);content:"";inline-size:20px}.c1noyk41700-beta13:checked+.cdwjxv8700-beta13{background-color:var(--rdg-checkbox-color);outline:4px solid var(--rdg-background-color);outline-offset:-6px}.c1noyk41700-beta13:focus+.cdwjxv8700-beta13{border-color:var(--rdg-checkbox-focus-color)}.cca4mwn700-beta13{cursor:default}.cca4mwn700-beta13 .cdwjxv8700-beta13{background-color:var(--rdg-checkbox-disabled-background-color);border-color:var(--rdg-checkbox-disabled-border-color)}';
52
- styleInject(css_248z$c, { "insertAt": "top" });
53
- const checkboxLabel = "cd9l4jz700-beta13";
54
- const checkboxLabelClassname = `rdg-checkbox-label ${checkboxLabel}`;
55
- const checkboxInput = "c1noyk41700-beta13";
56
- const checkboxInputClassname = `rdg-checkbox-input ${checkboxInput}`;
57
- const checkbox = "cdwjxv8700-beta13";
58
- const checkboxClassname = `rdg-checkbox ${checkbox}`;
59
- const checkboxLabelDisabled = "cca4mwn700-beta13";
60
- const checkboxLabelDisabledClassname = `rdg-checkbox-label-disabled ${checkboxLabelDisabled}`;
61
- const CheckboxFormatter = /* @__PURE__ */ forwardRef(function CheckboxFormatter2({
62
- onChange,
63
- ...props
64
- }, ref) {
65
- function handleChange(e) {
66
- onChange(e.target.checked, e.nativeEvent.shiftKey);
67
- }
68
- return /* @__PURE__ */ jsxs("label", {
69
- className: clsx(checkboxLabelClassname, props.disabled && checkboxLabelDisabledClassname),
70
- children: [/* @__PURE__ */ jsx("input", {
71
- type: "checkbox",
72
- ref,
73
- ...props,
74
- className: checkboxInputClassname,
75
- onChange: handleChange
76
- }), /* @__PURE__ */ jsx("div", {
77
- className: checkboxClassname
78
- })]
79
- });
80
- });
81
- const useLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect$1;
82
- function useFocusRef(isSelected) {
83
- const ref = useRef(null);
84
- useLayoutEffect(() => {
85
- if (!isSelected) return;
86
- ref.current?.focus({
87
- preventScroll: true
88
- });
89
- }, [isSelected]);
90
- return {
91
- ref,
92
- tabIndex: isSelected ? 0 : -1
93
- };
94
- }
95
- const DataGridDefaultComponentsContext = /* @__PURE__ */ createContext(void 0);
96
- const DataGridDefaultComponentsProvider = DataGridDefaultComponentsContext.Provider;
97
- function useDefaultComponents() {
98
- return useContext(DataGridDefaultComponentsContext);
99
- }
100
- function SelectCellFormatter({
101
- value,
102
- isCellSelected,
103
- disabled,
104
- onChange,
105
- "aria-label": ariaLabel,
106
- "aria-labelledby": ariaLabelledBy
107
- }) {
108
- const {
109
- ref,
110
- tabIndex
111
- } = useFocusRef(isCellSelected);
112
- const Formatter = useDefaultComponents().checkboxFormatter;
113
- return /* @__PURE__ */ jsx(Formatter, {
114
- "aria-label": ariaLabel,
115
- "aria-labelledby": ariaLabelledBy,
116
- ref,
117
- tabIndex,
118
- disabled,
119
- checked: value,
120
- onChange
121
- });
122
- }
123
- function ValueFormatter(props) {
124
- try {
125
- return /* @__PURE__ */ jsx(Fragment, {
126
- children: props.row[props.column.key]
127
- });
128
- } catch {
129
- return null;
130
- }
131
- }
132
- var css_248z$b = ".gch972y700-beta13{outline:none}.cz2qf0d700-beta13{stroke:currentColor;stroke-width:1.5px;fill:transparent;margin-inline-start:4px;vertical-align:middle}.cz2qf0d700-beta13>path{transition:d .1s}";
133
- styleInject(css_248z$b, { "insertAt": "top" });
134
- const groupCellContent = "gch972y700-beta13";
135
- const groupCellContentClassname = `rdg-group-cell-content ${groupCellContent}`;
136
- const caret = "cz2qf0d700-beta13";
137
- const caretClassname = `rdg-caret ${caret}`;
138
- function ToggleGroupFormatter({
139
- groupKey,
140
- isExpanded,
141
- isCellSelected,
142
- toggleGroup
143
- }) {
144
- const {
145
- ref,
146
- tabIndex
147
- } = useFocusRef(isCellSelected);
148
- function handleKeyDown({
149
- key
150
- }) {
151
- if (key === "Enter") {
152
- toggleGroup();
153
- }
154
- }
155
- const d = isExpanded ? "M1 1 L 7 7 L 13 1" : "M1 7 L 7 1 L 13 7";
156
- return /* @__PURE__ */ jsxs("span", {
157
- ref,
158
- className: groupCellContentClassname,
159
- tabIndex,
160
- onKeyDown: handleKeyDown,
161
- children: [groupKey, /* @__PURE__ */ jsx("svg", {
162
- viewBox: "0 0 14 8",
163
- width: "14",
164
- height: "8",
165
- className: caretClassname,
166
- "aria-hidden": true,
167
- children: /* @__PURE__ */ jsx("path", {
168
- d
169
- })
170
- })]
171
- });
172
- }
173
- const RowSelectionContext = /* @__PURE__ */ createContext(void 0);
174
- const RowSelectionProvider = RowSelectionContext.Provider;
175
- const RowSelectionChangeContext = /* @__PURE__ */ createContext(void 0);
176
- const RowSelectionChangeProvider = RowSelectionChangeContext.Provider;
177
- function useRowSelection() {
178
- const rowSelectionContext = useContext(RowSelectionContext);
179
- const rowSelectionChangeContext = useContext(RowSelectionChangeContext);
180
- if (rowSelectionContext === void 0 || rowSelectionChangeContext === void 0) {
181
- throw new Error("useRowSelection must be used within DataGrid cells");
182
- }
183
- return [rowSelectionContext, rowSelectionChangeContext];
184
- }
185
- const SELECT_COLUMN_KEY = "select-row";
186
- function getColSpan(column, lastFrozenColumnIndex, args) {
187
- const colSpan = typeof column.colSpan === "function" ? column.colSpan(args) : 1;
188
- if (Number.isInteger(colSpan) && colSpan > 1 && (!column.frozen || column.idx + colSpan - 1 <= lastFrozenColumnIndex)) {
189
- return colSpan;
190
- }
191
- return void 0;
192
- }
193
- function scrollIntoView(element) {
194
- element?.scrollIntoView({
195
- inline: "nearest",
196
- block: "nearest"
197
- });
198
- }
199
- const nonInputKeys = /* @__PURE__ */ new Set(["Unidentified", "Alt", "AltGraph", "CapsLock", "Control", "Fn", "FnLock", "Meta", "NumLock", "ScrollLock", "Shift", "Tab", "ArrowDown", "ArrowLeft", "ArrowRight", "ArrowUp", "End", "Home", "PageDown", "PageUp", "Insert", "ContextMenu", "Escape", "Pause", "Play", "PrintScreen", "F1", "F3", "F4", "F5", "F6", "F7", "F8", "F9", "F10", "F11", "F12"]);
200
- function isCtrlKeyHeldDown(e) {
201
- return (e.ctrlKey || e.metaKey) && e.key !== "Control";
202
- }
203
- function isDefaultCellInput(event) {
204
- return !nonInputKeys.has(event.key);
205
- }
206
- function onEditorNavigation({
207
- key,
208
- target
209
- }) {
210
- if (key === "Tab" && (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement || target instanceof HTMLSelectElement)) {
211
- return target.matches(".rdg-editor-container > :only-child, .rdg-editor-container > label:only-child > :only-child");
212
- }
213
- return false;
214
- }
215
- function isSelectedCellEditable({
216
- selectedPosition,
217
- columns,
218
- rows,
219
- isGroupRow
220
- }) {
221
- const column = columns[selectedPosition.idx];
222
- const row2 = rows[selectedPosition.rowIdx];
223
- return !isGroupRow(row2) && isCellEditable(column, row2);
224
- }
225
- function isCellEditable(column, row2) {
226
- return column.editor != null && !column.rowGroup && (typeof column.editable === "function" ? column.editable(row2) : column.editable) !== false;
227
- }
228
- function getSelectedCellColSpan({
229
- rows,
230
- summaryRows,
231
- rowIdx,
232
- lastFrozenColumnIndex,
233
- column,
234
- isGroupRow
235
- }) {
236
- if (rowIdx === -1) {
237
- return getColSpan(column, lastFrozenColumnIndex, {
238
- type: "HEADER"
239
- });
240
- }
241
- if (rowIdx >= 0 && rowIdx < rows.length) {
242
- const row2 = rows[rowIdx];
243
- if (!isGroupRow(row2)) {
244
- return getColSpan(column, lastFrozenColumnIndex, {
245
- type: "ROW",
246
- row: row2
247
- });
248
- }
249
- return void 0;
250
- }
251
- if (summaryRows) {
252
- return getColSpan(column, lastFrozenColumnIndex, {
253
- type: "SUMMARY",
254
- row: summaryRows[rowIdx - rows.length]
255
- });
256
- }
257
- return void 0;
258
- }
259
- function getNextSelectedCellPosition({
260
- cellNavigationMode,
261
- columns,
262
- colSpanColumns,
263
- rows,
264
- summaryRows,
265
- minRowIdx,
266
- maxRowIdx,
267
- currentPosition: {
268
- idx: currentIdx
269
- },
270
- nextPosition,
271
- lastFrozenColumnIndex,
272
- isCellWithinBounds,
273
- isGroupRow
274
- }) {
275
- let {
276
- idx: nextIdx,
277
- rowIdx: nextRowIdx
278
- } = nextPosition;
279
- const setColSpan = (moveRight) => {
280
- if (nextRowIdx >= 0 && nextRowIdx < rows.length) {
281
- const row2 = rows[nextRowIdx];
282
- if (isGroupRow(row2)) return;
283
- }
284
- for (const column of colSpanColumns) {
285
- const colIdx = column.idx;
286
- if (colIdx > nextIdx) break;
287
- const colSpan = getSelectedCellColSpan({
288
- rows,
289
- summaryRows,
290
- rowIdx: nextRowIdx,
291
- lastFrozenColumnIndex,
292
- column,
293
- isGroupRow
294
- });
295
- if (colSpan && nextIdx > colIdx && nextIdx < colSpan + colIdx) {
296
- nextIdx = colIdx + (moveRight ? colSpan : 0);
297
- break;
298
- }
299
- }
300
- };
301
- if (isCellWithinBounds(nextPosition)) {
302
- setColSpan(nextIdx - currentIdx > 0);
303
- }
304
- if (cellNavigationMode !== "NONE") {
305
- const columnsCount = columns.length;
306
- const isAfterLastColumn = nextIdx === columnsCount;
307
- const isBeforeFirstColumn = nextIdx === -1;
308
- if (isAfterLastColumn) {
309
- if (cellNavigationMode === "CHANGE_ROW") {
310
- const isLastRow = nextRowIdx === maxRowIdx;
311
- if (!isLastRow) {
312
- nextIdx = 0;
313
- nextRowIdx += 1;
314
- }
315
- } else {
316
- nextIdx = 0;
317
- }
318
- } else if (isBeforeFirstColumn) {
319
- if (cellNavigationMode === "CHANGE_ROW") {
320
- const isFirstRow = nextRowIdx === minRowIdx;
321
- if (!isFirstRow) {
322
- nextRowIdx -= 1;
323
- nextIdx = columnsCount - 1;
324
- }
325
- } else {
326
- nextIdx = columnsCount - 1;
327
- }
328
- setColSpan(false);
329
- }
330
- }
331
- return {
332
- idx: nextIdx,
333
- rowIdx: nextRowIdx
334
- };
335
- }
336
- function canExitGrid({
337
- cellNavigationMode,
338
- maxColIdx,
339
- minRowIdx,
340
- maxRowIdx,
341
- selectedPosition: {
342
- rowIdx,
343
- idx
344
- },
345
- shiftKey
346
- }) {
347
- if (cellNavigationMode === "NONE" || cellNavigationMode === "CHANGE_ROW") {
348
- const atLastCellInRow = idx === maxColIdx;
349
- const atFirstCellInRow = idx === 0;
350
- const atLastRow = rowIdx === maxRowIdx;
351
- const atFirstRow = rowIdx === minRowIdx;
352
- return shiftKey ? atFirstCellInRow && atFirstRow : atLastCellInRow && atLastRow;
353
- }
354
- return false;
355
- }
356
- function getRowStyle(rowIdx, height) {
357
- if (height !== void 0) {
358
- return {
359
- "--rdg-grid-row-start": rowIdx,
360
- "--rdg-row-height": `${height}px`
361
- };
362
- }
363
- return {
364
- "--rdg-grid-row-start": rowIdx
365
- };
366
- }
367
- function getCellStyle(column, colSpan) {
368
- return {
369
- gridColumnStart: column.idx + 1,
370
- gridColumnEnd: colSpan !== void 0 ? `span ${colSpan}` : void 0,
371
- insetInlineStart: column.frozen ? `var(--rdg-frozen-left-${column.idx})` : void 0
372
- };
373
- }
374
- function getCellClassname(column, ...extraClasses) {
375
- return clsx(cellClassname, ...extraClasses, column.frozen && cellFrozenClassname, column.isLastFrozenColumn && cellFrozenLastClassname);
376
- }
377
- const {
378
- min,
379
- max,
380
- round,
381
- floor,
382
- sign,
383
- abs,
384
- ceil
385
- } = Math;
386
- function assertIsValidKeyGetter(keyGetter) {
387
- if (typeof keyGetter !== "function") {
388
- throw new Error("Please specify the rowKeyGetter prop to use selection");
389
- }
390
- }
391
- function clampColumnWidth(width, {
392
- minWidth,
393
- maxWidth
394
- }) {
395
- width = max(width, minWidth);
396
- if (typeof maxWidth === "number" && maxWidth >= minWidth) {
397
- return min(width, maxWidth);
398
- }
399
- return width;
400
- }
401
- function useCalculatedColumns({
402
- rawColumns,
403
- columnWidths,
404
- viewportWidth,
405
- scrollLeft,
406
- defaultColumnOptions,
407
- rawGroupBy,
408
- enableVirtualization
409
- }) {
410
- const defaultWidth = defaultColumnOptions?.width;
411
- const defaultMinWidth = defaultColumnOptions?.minWidth ?? 80;
412
- const defaultMaxWidth = defaultColumnOptions?.maxWidth;
413
- const defaultFormatter = defaultColumnOptions?.formatter ?? ValueFormatter;
414
- const defaultSortable = defaultColumnOptions?.sortable ?? false;
415
- const defaultResizable = defaultColumnOptions?.resizable ?? false;
416
- const {
417
- columns,
418
- colSpanColumns,
419
- lastFrozenColumnIndex,
420
- groupBy
421
- } = useMemo(() => {
422
- const groupBy2 = [];
423
- let lastFrozenColumnIndex2 = -1;
424
- const columns2 = rawColumns.map((rawColumn) => {
425
- const rowGroup = rawGroupBy?.includes(rawColumn.key) ?? false;
426
- const frozen = rowGroup || rawColumn.frozen || false;
427
- const column = {
428
- ...rawColumn,
429
- idx: 0,
430
- frozen,
431
- isLastFrozenColumn: false,
432
- rowGroup,
433
- width: rawColumn.width ?? defaultWidth,
434
- minWidth: rawColumn.minWidth ?? defaultMinWidth,
435
- maxWidth: rawColumn.maxWidth ?? defaultMaxWidth,
436
- sortable: rawColumn.sortable ?? defaultSortable,
437
- resizable: rawColumn.resizable ?? defaultResizable,
438
- formatter: rawColumn.formatter ?? defaultFormatter
439
- };
440
- if (rowGroup) {
441
- column.groupFormatter ?? (column.groupFormatter = ToggleGroupFormatter);
442
- }
443
- if (frozen) {
444
- lastFrozenColumnIndex2++;
445
- }
446
- return column;
447
- });
448
- columns2.sort(({
449
- key: aKey,
450
- frozen: frozenA
451
- }, {
452
- key: bKey,
453
- frozen: frozenB
454
- }) => {
455
- if (aKey === SELECT_COLUMN_KEY) return -1;
456
- if (bKey === SELECT_COLUMN_KEY) return 1;
457
- if (rawGroupBy?.includes(aKey)) {
458
- if (rawGroupBy.includes(bKey)) {
459
- return rawGroupBy.indexOf(aKey) - rawGroupBy.indexOf(bKey);
460
- }
461
- return -1;
462
- }
463
- if (rawGroupBy?.includes(bKey)) return 1;
464
- if (frozenA) {
465
- if (frozenB) return 0;
466
- return -1;
467
- }
468
- if (frozenB) return 1;
469
- return 0;
470
- });
471
- const colSpanColumns2 = [];
472
- columns2.forEach((column, idx) => {
473
- column.idx = idx;
474
- if (column.rowGroup) {
475
- groupBy2.push(column.key);
476
- }
477
- if (column.colSpan != null) {
478
- colSpanColumns2.push(column);
479
- }
480
- });
481
- if (lastFrozenColumnIndex2 !== -1) {
482
- columns2[lastFrozenColumnIndex2].isLastFrozenColumn = true;
483
- }
484
- return {
485
- columns: columns2,
486
- colSpanColumns: colSpanColumns2,
487
- lastFrozenColumnIndex: lastFrozenColumnIndex2,
488
- groupBy: groupBy2
489
- };
490
- }, [rawColumns, defaultWidth, defaultMinWidth, defaultMaxWidth, defaultFormatter, defaultResizable, defaultSortable, rawGroupBy]);
491
- const {
492
- layoutCssVars,
493
- totalFrozenColumnWidth,
494
- columnMetrics
495
- } = useMemo(() => {
496
- const columnMetrics2 = /* @__PURE__ */ new Map();
497
- let left = 0;
498
- let totalFrozenColumnWidth2 = 0;
499
- let templateColumns = "";
500
- let allocatedWidth = 0;
501
- let unassignedColumnsCount = 0;
502
- for (const column of columns) {
503
- let width = getSpecifiedWidth(column, columnWidths, viewportWidth);
504
- if (width === void 0) {
505
- unassignedColumnsCount++;
506
- } else {
507
- width = clampColumnWidth(width, column);
508
- allocatedWidth += width;
509
- columnMetrics2.set(column, {
510
- width,
511
- left: 0
512
- });
513
- }
514
- }
515
- for (const column of columns) {
516
- let width;
517
- if (columnMetrics2.has(column)) {
518
- const columnMetric = columnMetrics2.get(column);
519
- columnMetric.left = left;
520
- ({
521
- width
522
- } = columnMetric);
523
- } else {
524
- const unallocatedWidth = viewportWidth - allocatedWidth;
525
- const unallocatedColumnWidth = round(unallocatedWidth / unassignedColumnsCount);
526
- width = clampColumnWidth(unallocatedColumnWidth, column);
527
- allocatedWidth += width;
528
- unassignedColumnsCount--;
529
- columnMetrics2.set(column, {
530
- width,
531
- left
532
- });
533
- }
534
- left += width;
535
- templateColumns += `${width}px `;
536
- }
537
- if (lastFrozenColumnIndex !== -1) {
538
- const columnMetric = columnMetrics2.get(columns[lastFrozenColumnIndex]);
539
- totalFrozenColumnWidth2 = columnMetric.left + columnMetric.width;
540
- }
541
- const layoutCssVars2 = {
542
- gridTemplateColumns: templateColumns
543
- };
544
- for (let i = 0; i <= lastFrozenColumnIndex; i++) {
545
- const column = columns[i];
546
- layoutCssVars2[`--rdg-frozen-left-${column.idx}`] = `${columnMetrics2.get(column).left}px`;
547
- }
548
- return {
549
- layoutCssVars: layoutCssVars2,
550
- totalFrozenColumnWidth: totalFrozenColumnWidth2,
551
- columnMetrics: columnMetrics2
552
- };
553
- }, [columnWidths, columns, viewportWidth, lastFrozenColumnIndex]);
554
- const [colOverscanStartIdx, colOverscanEndIdx] = useMemo(() => {
555
- if (!enableVirtualization) {
556
- return [0, columns.length - 1];
557
- }
558
- const viewportLeft = scrollLeft + totalFrozenColumnWidth;
559
- const viewportRight = scrollLeft + viewportWidth;
560
- const lastColIdx = columns.length - 1;
561
- const firstUnfrozenColumnIdx = min(lastFrozenColumnIndex + 1, lastColIdx);
562
- if (viewportLeft >= viewportRight) {
563
- return [firstUnfrozenColumnIdx, firstUnfrozenColumnIdx];
564
- }
565
- let colVisibleStartIdx = firstUnfrozenColumnIdx;
566
- while (colVisibleStartIdx < lastColIdx) {
567
- const {
568
- left,
569
- width
570
- } = columnMetrics.get(columns[colVisibleStartIdx]);
571
- if (left + width > viewportLeft) {
572
- break;
573
- }
574
- colVisibleStartIdx++;
575
- }
576
- let colVisibleEndIdx = colVisibleStartIdx;
577
- while (colVisibleEndIdx < lastColIdx) {
578
- const {
579
- left,
580
- width
581
- } = columnMetrics.get(columns[colVisibleEndIdx]);
582
- if (left + width >= viewportRight) {
583
- break;
584
- }
585
- colVisibleEndIdx++;
586
- }
587
- const colOverscanStartIdx2 = max(firstUnfrozenColumnIdx, colVisibleStartIdx - 1);
588
- const colOverscanEndIdx2 = min(lastColIdx, colVisibleEndIdx + 1);
589
- return [colOverscanStartIdx2, colOverscanEndIdx2];
590
- }, [columnMetrics, columns, lastFrozenColumnIndex, scrollLeft, totalFrozenColumnWidth, viewportWidth, enableVirtualization]);
591
- return {
592
- columns,
593
- colSpanColumns,
594
- colOverscanStartIdx,
595
- colOverscanEndIdx,
596
- layoutCssVars,
597
- columnMetrics,
598
- lastFrozenColumnIndex,
599
- totalFrozenColumnWidth,
600
- groupBy
601
- };
602
- }
603
- function getSpecifiedWidth({
604
- key,
605
- width
606
- }, columnWidths, viewportWidth) {
607
- if (columnWidths.has(key)) {
608
- return columnWidths.get(key);
609
- }
610
- if (typeof width === "number") {
611
- return width;
612
- }
613
- if (typeof width === "string" && /^\d+%$/.test(width)) {
614
- return floor(viewportWidth * parseInt(width, 10) / 100);
615
- }
616
- return void 0;
617
- }
618
- function useGridDimensions() {
619
- const gridRef = useRef(null);
620
- const [inlineSize, setInlineSize] = useState(1);
621
- const [blockSize, setBlockSize] = useState(1);
622
- useLayoutEffect(() => {
623
- const {
624
- ResizeObserver
625
- } = window;
626
- if (ResizeObserver == null) return;
627
- const {
628
- clientWidth,
629
- clientHeight,
630
- offsetWidth,
631
- offsetHeight
632
- } = gridRef.current;
633
- const {
634
- width,
635
- height
636
- } = gridRef.current.getBoundingClientRect();
637
- const initialWidth = width - offsetWidth + clientWidth;
638
- const initialHeight = height - offsetHeight + clientHeight;
639
- setInlineSize(handleDevicePixelRatio(initialWidth));
640
- setBlockSize(initialHeight);
641
- const resizeObserver = new ResizeObserver((entries) => {
642
- const size = entries[0].contentBoxSize[0];
643
- setInlineSize(handleDevicePixelRatio(size.inlineSize));
644
- setBlockSize(size.blockSize);
645
- });
646
- resizeObserver.observe(gridRef.current);
647
- return () => {
648
- resizeObserver.disconnect();
649
- };
650
- }, []);
651
- return [gridRef, inlineSize, blockSize];
652
- }
653
- function handleDevicePixelRatio(size) {
654
- return size - (devicePixelRatio === 1 ? 0 : ceil(devicePixelRatio));
655
- }
656
- function useLatestFunc(fn) {
657
- const ref = useRef(fn);
658
- useEffect(() => {
659
- ref.current = fn;
660
- });
661
- return useCallback((...args) => {
662
- ref.current(...args);
663
- }, []);
664
- }
665
- function useRovingCellRef(isSelected) {
666
- const [isChildFocused, setIsChildFocused] = useState(false);
667
- if (isChildFocused && !isSelected) {
668
- setIsChildFocused(false);
669
- }
670
- const ref = useCallback((cell2) => {
671
- if (cell2 === null) return;
672
- scrollIntoView(cell2);
673
- if (cell2.contains(document.activeElement)) return;
674
- cell2.focus({
675
- preventScroll: true
676
- });
677
- }, []);
678
- function onFocus(event) {
679
- if (event.target !== event.currentTarget) {
680
- setIsChildFocused(true);
681
- }
682
- }
683
- const isFocused = isSelected && !isChildFocused;
684
- return {
685
- ref: isSelected ? ref : void 0,
686
- tabIndex: isFocused ? 0 : -1,
687
- onFocus: isSelected ? onFocus : void 0
688
- };
689
- }
690
- function useViewportColumns({
691
- columns,
692
- colSpanColumns,
693
- rows,
694
- summaryRows,
695
- colOverscanStartIdx,
696
- colOverscanEndIdx,
697
- lastFrozenColumnIndex,
698
- rowOverscanStartIdx,
699
- rowOverscanEndIdx,
700
- isGroupRow
701
- }) {
702
- const startIdx = useMemo(() => {
703
- if (colOverscanStartIdx === 0) return 0;
704
- let startIdx2 = colOverscanStartIdx;
705
- const updateStartIdx = (colIdx, colSpan) => {
706
- if (colSpan !== void 0 && colIdx + colSpan > colOverscanStartIdx) {
707
- startIdx2 = colIdx;
708
- return true;
709
- }
710
- return false;
711
- };
712
- for (const column of colSpanColumns) {
713
- const colIdx = column.idx;
714
- if (colIdx >= startIdx2) break;
715
- if (updateStartIdx(colIdx, getColSpan(column, lastFrozenColumnIndex, {
716
- type: "HEADER"
717
- }))) {
718
- break;
719
- }
720
- for (let rowIdx = rowOverscanStartIdx; rowIdx <= rowOverscanEndIdx; rowIdx++) {
721
- const row2 = rows[rowIdx];
722
- if (isGroupRow(row2)) continue;
723
- if (updateStartIdx(colIdx, getColSpan(column, lastFrozenColumnIndex, {
724
- type: "ROW",
725
- row: row2
726
- }))) {
727
- break;
728
- }
729
- }
730
- if (summaryRows != null) {
731
- for (const row2 of summaryRows) {
732
- if (updateStartIdx(colIdx, getColSpan(column, lastFrozenColumnIndex, {
733
- type: "SUMMARY",
734
- row: row2
735
- }))) {
736
- break;
737
- }
738
- }
739
- }
740
- }
741
- return startIdx2;
742
- }, [rowOverscanStartIdx, rowOverscanEndIdx, rows, summaryRows, colOverscanStartIdx, lastFrozenColumnIndex, colSpanColumns, isGroupRow]);
743
- return useMemo(() => {
744
- const viewportColumns = [];
745
- for (let colIdx = 0; colIdx <= colOverscanEndIdx; colIdx++) {
746
- const column = columns[colIdx];
747
- if (colIdx < startIdx && !column.frozen) continue;
748
- viewportColumns.push(column);
749
- }
750
- return viewportColumns;
751
- }, [startIdx, colOverscanEndIdx, columns]);
752
- }
753
- function isReadonlyArray(arr) {
754
- return Array.isArray(arr);
755
- }
756
- function useViewportRows({
757
- rawRows,
758
- rowHeight,
759
- clientHeight,
760
- scrollTop,
761
- groupBy,
762
- rowGrouper,
763
- expandedGroupIds,
764
- enableVirtualization
765
- }) {
766
- const [groupedRows, rowsCount] = useMemo(() => {
767
- if (groupBy.length === 0 || rowGrouper == null) return [void 0, rawRows.length];
768
- const groupRows = (rows2, [groupByKey, ...remainingGroupByKeys], startRowIndex) => {
769
- let groupRowsCount = 0;
770
- const groups = {};
771
- for (const [key, childRows] of Object.entries(rowGrouper(rows2, groupByKey))) {
772
- const [childGroups, childRowsCount] = remainingGroupByKeys.length === 0 ? [childRows, childRows.length] : groupRows(childRows, remainingGroupByKeys, startRowIndex + groupRowsCount + 1);
773
- groups[key] = {
774
- childRows,
775
- childGroups,
776
- startRowIndex: startRowIndex + groupRowsCount
777
- };
778
- groupRowsCount += childRowsCount + 1;
779
- }
780
- return [groups, groupRowsCount];
781
- };
782
- return groupRows(rawRows, groupBy, 0);
783
- }, [groupBy, rowGrouper, rawRows]);
784
- const [rows, isGroupRow] = useMemo(() => {
785
- const allGroupRows = /* @__PURE__ */ new Set();
786
- if (!groupedRows) return [rawRows, isGroupRow2];
787
- const flattenedRows = [];
788
- const expandGroup = (rows2, parentId, level) => {
789
- if (isReadonlyArray(rows2)) {
790
- flattenedRows.push(...rows2);
791
- return;
792
- }
793
- Object.keys(rows2).forEach((groupKey, posInSet, keys) => {
794
- const id = parentId !== void 0 ? `${parentId}__${groupKey}` : groupKey;
795
- const isExpanded = expandedGroupIds?.has(id) ?? false;
796
- const {
797
- childRows,
798
- childGroups,
799
- startRowIndex
800
- } = rows2[groupKey];
801
- const groupRow2 = {
802
- id,
803
- parentId,
804
- groupKey,
805
- isExpanded,
806
- childRows,
807
- level,
808
- posInSet,
809
- startRowIndex,
810
- setSize: keys.length
811
- };
812
- flattenedRows.push(groupRow2);
813
- allGroupRows.add(groupRow2);
814
- if (isExpanded) {
815
- expandGroup(childGroups, id, level + 1);
816
- }
817
- });
818
- };
819
- expandGroup(groupedRows, void 0, 0);
820
- return [flattenedRows, isGroupRow2];
821
- function isGroupRow2(row2) {
822
- return allGroupRows.has(row2);
823
- }
824
- }, [expandedGroupIds, groupedRows, rawRows]);
825
- const {
826
- totalRowHeight,
827
- gridTemplateRows,
828
- getRowTop,
829
- getRowHeight,
830
- findRowIdx
831
- } = useMemo(() => {
832
- if (typeof rowHeight === "number") {
833
- return {
834
- totalRowHeight: rowHeight * rows.length,
835
- gridTemplateRows: ` repeat(${rows.length}, ${rowHeight}px)`,
836
- getRowTop: (rowIdx) => rowIdx * rowHeight,
837
- getRowHeight: () => rowHeight,
838
- findRowIdx: (offset) => floor(offset / rowHeight)
839
- };
840
- }
841
- let totalRowHeight2 = 0;
842
- let gridTemplateRows2 = " ";
843
- const rowPositions = rows.map((row2) => {
844
- const currentRowHeight = isGroupRow(row2) ? rowHeight({
845
- type: "GROUP",
846
- row: row2
847
- }) : rowHeight({
848
- type: "ROW",
849
- row: row2
850
- });
851
- const position = {
852
- top: totalRowHeight2,
853
- height: currentRowHeight
854
- };
855
- gridTemplateRows2 += `${currentRowHeight}px `;
856
- totalRowHeight2 += currentRowHeight;
857
- return position;
858
- });
859
- const validateRowIdx = (rowIdx) => {
860
- return max(0, min(rows.length - 1, rowIdx));
861
- };
862
- return {
863
- totalRowHeight: totalRowHeight2,
864
- gridTemplateRows: gridTemplateRows2,
865
- getRowTop: (rowIdx) => rowPositions[validateRowIdx(rowIdx)].top,
866
- getRowHeight: (rowIdx) => rowPositions[validateRowIdx(rowIdx)].height,
867
- findRowIdx(offset) {
868
- let start = 0;
869
- let end = rowPositions.length - 1;
870
- while (start <= end) {
871
- const middle = start + floor((end - start) / 2);
872
- const currentOffset = rowPositions[middle].top;
873
- if (currentOffset === offset) return middle;
874
- if (currentOffset < offset) {
875
- start = middle + 1;
876
- } else if (currentOffset > offset) {
877
- end = middle - 1;
878
- }
879
- if (start > end) return end;
880
- }
881
- return 0;
882
- }
883
- };
884
- }, [isGroupRow, rowHeight, rows]);
885
- let rowOverscanStartIdx = 0;
886
- let rowOverscanEndIdx = rows.length - 1;
887
- if (enableVirtualization) {
888
- const overscanThreshold = 4;
889
- const rowVisibleStartIdx = findRowIdx(scrollTop);
890
- const rowVisibleEndIdx = findRowIdx(scrollTop + clientHeight);
891
- rowOverscanStartIdx = max(0, rowVisibleStartIdx - overscanThreshold);
892
- rowOverscanEndIdx = min(rows.length - 1, rowVisibleEndIdx + overscanThreshold);
893
- }
894
- return {
895
- rowOverscanStartIdx,
896
- rowOverscanEndIdx,
897
- rows,
898
- rowsCount,
899
- totalRowHeight,
900
- gridTemplateRows,
901
- isGroupRow,
902
- getRowTop,
903
- getRowHeight,
904
- findRowIdx
905
- };
906
- }
907
- var css_248z$a = ".h1tr5c9i700-beta13{cursor:pointer;display:flex}.h1tr5c9i700-beta13:focus{outline:none}.h19r0msv700-beta13{flex-grow:1;overflow:hidden;overflow:clip;text-overflow:ellipsis}";
908
- styleInject(css_248z$a, { "insertAt": "top" });
909
- const headerSortCell = "h1tr5c9i700-beta13";
910
- const headerSortCellClassname = `rdg-header-sort-cell ${headerSortCell}`;
911
- const headerSortName = "h19r0msv700-beta13";
912
- const headerSortNameClassname = `rdg-header-sort-name ${headerSortName}`;
913
- function HeaderRenderer({
914
- column,
915
- sortDirection,
916
- priority,
917
- onSort,
918
- isCellSelected
919
- }) {
920
- if (!column.sortable) return /* @__PURE__ */ jsx(Fragment, {
921
- children: column.name
922
- });
923
- return /* @__PURE__ */ jsx(SortableHeaderCell, {
924
- onSort,
925
- sortDirection,
926
- priority,
927
- isCellSelected,
928
- children: column.name
929
- });
930
- }
931
- function SortableHeaderCell({
932
- onSort,
933
- sortDirection,
934
- priority,
935
- children,
936
- isCellSelected
937
- }) {
938
- const SortIcon2 = useDefaultComponents().sortIcon;
939
- const {
940
- ref,
941
- tabIndex
942
- } = useFocusRef(isCellSelected);
943
- function handleKeyDown(event) {
944
- if (event.key === " " || event.key === "Enter") {
945
- event.preventDefault();
946
- onSort(event.ctrlKey || event.metaKey);
947
- }
948
- }
949
- function handleClick(event) {
950
- onSort(event.ctrlKey || event.metaKey);
951
- }
952
- return /* @__PURE__ */ jsxs("span", {
953
- ref,
954
- tabIndex,
955
- className: headerSortCellClassname,
956
- onClick: handleClick,
957
- onKeyDown: handleKeyDown,
958
- children: [/* @__PURE__ */ jsx("span", {
959
- className: headerSortNameClassname,
960
- children
961
- }), /* @__PURE__ */ jsxs("span", {
962
- children: [/* @__PURE__ */ jsx(SortIcon2, {
963
- sortDirection
964
- }), priority]
965
- })]
966
- });
967
- }
968
- var css_248z$9 = '.celq7o9700-beta13{touch-action:none}.celq7o9700-beta13:after{content:"";cursor:col-resize;inline-size:10px;inset-block-end:0;inset-block-start:0;inset-inline-end:0;position:absolute}';
969
- styleInject(css_248z$9, { "insertAt": "top" });
970
- const cellResizable = "celq7o9700-beta13";
971
- const cellResizableClassname = `rdg-cell-resizable ${cellResizable}`;
972
- function HeaderCell({
973
- column,
974
- colSpan,
975
- isCellSelected,
976
- onColumnResize,
977
- allRowsSelected,
978
- onAllRowsSelectionChange,
979
- sortColumns,
980
- onSortColumnsChange,
981
- selectCell,
982
- shouldFocusGrid,
983
- direction
984
- }) {
985
- const isRtl = direction === "rtl";
986
- const {
987
- ref,
988
- tabIndex,
989
- onFocus
990
- } = useRovingCellRef(isCellSelected);
991
- const sortIndex = sortColumns?.findIndex((sort) => sort.columnKey === column.key);
992
- const sortColumn = sortIndex !== void 0 && sortIndex > -1 ? sortColumns[sortIndex] : void 0;
993
- const sortDirection = sortColumn?.direction;
994
- const priority = sortColumn !== void 0 && sortColumns.length > 1 ? sortIndex + 1 : void 0;
995
- const ariaSort = sortDirection && !priority ? sortDirection === "ASC" ? "ascending" : "descending" : void 0;
996
- const className = getCellClassname(column, column.headerCellClass, column.resizable && cellResizableClassname);
997
- const HeaderRenderer$1 = column.headerRenderer ?? HeaderRenderer;
998
- function onPointerDown(event) {
999
- if (event.pointerType === "mouse" && event.buttons !== 1) {
1000
- return;
1001
- }
1002
- const {
1003
- currentTarget,
1004
- pointerId
1005
- } = event;
1006
- const {
1007
- right,
1008
- left
1009
- } = currentTarget.getBoundingClientRect();
1010
- const offset = isRtl ? event.clientX - left : right - event.clientX;
1011
- if (offset > 11) {
1012
- return;
1013
- }
1014
- function onPointerMove(event2) {
1015
- const {
1016
- right: right2,
1017
- left: left2
1018
- } = currentTarget.getBoundingClientRect();
1019
- const width = isRtl ? right2 + offset - event2.clientX : event2.clientX + offset - left2;
1020
- if (width > 0) {
1021
- onColumnResize(column, clampColumnWidth(width, column));
1022
- }
1023
- }
1024
- function onLostPointerCapture() {
1025
- currentTarget.removeEventListener("pointermove", onPointerMove);
1026
- currentTarget.removeEventListener("lostpointercapture", onLostPointerCapture);
1027
- }
1028
- currentTarget.setPointerCapture(pointerId);
1029
- currentTarget.addEventListener("pointermove", onPointerMove);
1030
- currentTarget.addEventListener("lostpointercapture", onLostPointerCapture);
1031
- }
1032
- function onSort(ctrlClick) {
1033
- if (onSortColumnsChange == null) return;
1034
- const {
1035
- sortDescendingFirst
1036
- } = column;
1037
- if (sortColumn === void 0) {
1038
- const nextSort = {
1039
- columnKey: column.key,
1040
- direction: sortDescendingFirst ? "DESC" : "ASC"
1041
- };
1042
- onSortColumnsChange(sortColumns && ctrlClick ? [...sortColumns, nextSort] : [nextSort]);
1043
- } else {
1044
- let nextSortColumn;
1045
- if (sortDescendingFirst && sortDirection === "DESC" || !sortDescendingFirst && sortDirection === "ASC") {
1046
- nextSortColumn = {
1047
- columnKey: column.key,
1048
- direction: sortDirection === "ASC" ? "DESC" : "ASC"
1049
- };
1050
- }
1051
- if (ctrlClick) {
1052
- const nextSortColumns = [...sortColumns];
1053
- if (nextSortColumn) {
1054
- nextSortColumns[sortIndex] = nextSortColumn;
1055
- } else {
1056
- nextSortColumns.splice(sortIndex, 1);
1057
- }
1058
- onSortColumnsChange(nextSortColumns);
1059
- } else {
1060
- onSortColumnsChange(nextSortColumn ? [nextSortColumn] : []);
1061
- }
1062
- }
1063
- }
1064
- function onClick() {
1065
- selectCell(column.idx);
1066
- }
1067
- function onDoubleClick(event) {
1068
- const {
1069
- right,
1070
- left
1071
- } = event.currentTarget.getBoundingClientRect();
1072
- const offset = isRtl ? event.clientX - left : right - event.clientX;
1073
- if (offset > 11) {
1074
- return;
1075
- }
1076
- onColumnResize(column, "auto");
1077
- }
1078
- function handleFocus(event) {
1079
- onFocus?.(event);
1080
- if (shouldFocusGrid) {
1081
- selectCell(0);
1082
- }
1083
- }
1084
- return /* @__PURE__ */ jsx("div", {
1085
- role: "columnheader",
1086
- "aria-colindex": column.idx + 1,
1087
- "aria-selected": isCellSelected,
1088
- "aria-sort": ariaSort,
1089
- "aria-colspan": colSpan,
1090
- ref,
1091
- tabIndex: shouldFocusGrid ? 0 : tabIndex,
1092
- className,
1093
- style: {
1094
- ...getCellStyle(column, colSpan),
1095
- minWidth: column.minWidth,
1096
- maxWidth: column.maxWidth ?? void 0
1097
- },
1098
- onFocus: handleFocus,
1099
- onClick,
1100
- onDoubleClick: column.resizable ? onDoubleClick : void 0,
1101
- onPointerDown: column.resizable ? onPointerDown : void 0,
1102
- children: /* @__PURE__ */ jsx(HeaderRenderer$1, {
1103
- column,
1104
- sortDirection,
1105
- priority,
1106
- onSort,
1107
- allRowsSelected,
1108
- onAllRowsSelectionChange,
1109
- isCellSelected
1110
- })
1111
- });
1112
- }
1113
- var css_248z$8 = ".h197vzie700-beta13{background-color:var(--rdg-header-background-color);display:contents;font-weight:700;line-height:var(--rdg-header-row-height)}.h197vzie700-beta13>.c1wupbe700-beta13{inset-block-start:0;position:sticky;z-index:2}.h197vzie700-beta13>.c1730fa4700-beta13{z-index:3}";
1114
- styleInject(css_248z$8, { "insertAt": "top" });
1115
- const headerRow = "h197vzie700-beta13";
1116
- const headerRowClassname = `rdg-header-row ${headerRow}`;
1117
- function HeaderRow({
1118
- columns,
1119
- allRowsSelected,
1120
- onAllRowsSelectionChange,
1121
- onColumnResize,
1122
- sortColumns,
1123
- onSortColumnsChange,
1124
- lastFrozenColumnIndex,
1125
- selectedCellIdx,
1126
- selectCell,
1127
- shouldFocusGrid,
1128
- direction
1129
- }) {
1130
- const cells = [];
1131
- for (let index = 0; index < columns.length; index++) {
1132
- const column = columns[index];
1133
- const colSpan = getColSpan(column, lastFrozenColumnIndex, {
1134
- type: "HEADER"
1135
- });
1136
- if (colSpan !== void 0) {
1137
- index += colSpan - 1;
1138
- }
1139
- cells.push(/* @__PURE__ */ jsx(HeaderCell, {
1140
- column,
1141
- colSpan,
1142
- isCellSelected: selectedCellIdx === column.idx,
1143
- onColumnResize,
1144
- allRowsSelected,
1145
- onAllRowsSelectionChange,
1146
- onSortColumnsChange,
1147
- sortColumns,
1148
- selectCell,
1149
- shouldFocusGrid: shouldFocusGrid && index === 0,
1150
- direction
1151
- }, column.key));
1152
- }
1153
- return /* @__PURE__ */ jsx("div", {
1154
- role: "row",
1155
- "aria-rowindex": 1,
1156
- className: clsx(headerRowClassname, selectedCellIdx === -1 && rowSelectedClassname),
1157
- style: getRowStyle(1),
1158
- children: cells
1159
- });
1160
- }
1161
- const HeaderRow$1 = /* @__PURE__ */ memo(HeaderRow);
1162
- var css_248z$7 = ".c1bmg16t700-beta13,.ccpfvsn700-beta13{background-color:#ccf}.c1bmg16t700-beta13.ccpfvsn700-beta13{background-color:#99f}";
1163
- styleInject(css_248z$7, { "insertAt": "top" });
1164
- const cellCopied = "ccpfvsn700-beta13";
1165
- const cellCopiedClassname = `rdg-cell-copied ${cellCopied}`;
1166
- const cellDraggedOver = "c1bmg16t700-beta13";
1167
- const cellDraggedOverClassname = `rdg-cell-dragged-over ${cellDraggedOver}`;
1168
- function Cell({
1169
- column,
1170
- colSpan,
1171
- isCellSelected,
1172
- isCopied,
1173
- isDraggedOver,
1174
- row: row2,
1175
- dragHandle,
1176
- onRowClick,
1177
- onRowDoubleClick,
1178
- onRowChange,
1179
- selectCell,
1180
- ...props
1181
- }) {
1182
- const {
1183
- ref,
1184
- tabIndex,
1185
- onFocus
1186
- } = useRovingCellRef(isCellSelected);
1187
- const {
1188
- cellClass
1189
- } = column;
1190
- const className = getCellClassname(column, typeof cellClass === "function" ? cellClass(row2) : cellClass, isCopied && cellCopiedClassname, isDraggedOver && cellDraggedOverClassname);
1191
- function selectCellWrapper(openEditor) {
1192
- selectCell(row2, column, openEditor);
1193
- }
1194
- function handleClick() {
1195
- selectCellWrapper(column.editorOptions?.editOnClick);
1196
- onRowClick?.(row2, column);
1197
- }
1198
- function handleContextMenu() {
1199
- selectCellWrapper();
1200
- }
1201
- function handleDoubleClick() {
1202
- selectCellWrapper(true);
1203
- onRowDoubleClick?.(row2, column);
1204
- }
1205
- return /* @__PURE__ */ jsx("div", {
1206
- role: "gridcell",
1207
- "aria-colindex": column.idx + 1,
1208
- "aria-selected": isCellSelected,
1209
- "aria-colspan": colSpan,
1210
- "aria-readonly": !isCellEditable(column, row2) || void 0,
1211
- ref,
1212
- tabIndex,
1213
- className,
1214
- style: getCellStyle(column, colSpan),
1215
- onClick: handleClick,
1216
- onDoubleClick: handleDoubleClick,
1217
- onContextMenu: handleContextMenu,
1218
- onFocus,
1219
- ...props,
1220
- children: !column.rowGroup && /* @__PURE__ */ jsxs(Fragment, {
1221
- children: [/* @__PURE__ */ jsx(column.formatter, {
1222
- column,
1223
- row: row2,
1224
- isCellSelected,
1225
- onRowChange
1226
- }), dragHandle]
1227
- })
1228
- });
1229
- }
1230
- const Cell$1 = /* @__PURE__ */ memo(Cell);
1231
- function Row({
1232
- className,
1233
- rowIdx,
1234
- gridRowStart,
1235
- height,
1236
- selectedCellIdx,
1237
- isRowSelected,
1238
- copiedCellIdx,
1239
- draggedOverCellIdx,
1240
- lastFrozenColumnIndex,
1241
- row: row2,
1242
- viewportColumns,
1243
- selectedCellEditor,
1244
- selectedCellDragHandle,
1245
- onRowClick,
1246
- onRowDoubleClick,
1247
- rowClass,
1248
- setDraggedOverRowIdx,
1249
- onMouseEnter,
1250
- onRowChange,
1251
- selectCell,
1252
- ...props
1253
- }, ref) {
1254
- const handleRowChange = useLatestFunc((newRow) => {
1255
- onRowChange(rowIdx, newRow);
1256
- });
1257
- function handleDragEnter(event) {
1258
- setDraggedOverRowIdx?.(rowIdx);
1259
- onMouseEnter?.(event);
1260
- }
1261
- className = clsx(rowClassname, `rdg-row-${rowIdx % 2 === 0 ? "even" : "odd"}`, rowClass?.(row2), className, selectedCellIdx === -1 && rowSelectedClassname);
1262
- const cells = [];
1263
- for (let index = 0; index < viewportColumns.length; index++) {
1264
- const column = viewportColumns[index];
1265
- const {
1266
- idx
1267
- } = column;
1268
- const colSpan = getColSpan(column, lastFrozenColumnIndex, {
1269
- type: "ROW",
1270
- row: row2
1271
- });
1272
- if (colSpan !== void 0) {
1273
- index += colSpan - 1;
1274
- }
1275
- const isCellSelected = selectedCellIdx === idx;
1276
- if (isCellSelected && selectedCellEditor) {
1277
- cells.push(selectedCellEditor);
1278
- } else {
1279
- cells.push(/* @__PURE__ */ jsx(Cell$1, {
1280
- column,
1281
- colSpan,
1282
- row: row2,
1283
- isCopied: copiedCellIdx === idx,
1284
- isDraggedOver: draggedOverCellIdx === idx,
1285
- isCellSelected,
1286
- dragHandle: isCellSelected ? selectedCellDragHandle : void 0,
1287
- onRowClick,
1288
- onRowDoubleClick,
1289
- onRowChange: handleRowChange,
1290
- selectCell
1291
- }, column.key));
1292
- }
1293
- }
1294
- return /* @__PURE__ */ jsx(RowSelectionProvider, {
1295
- value: isRowSelected,
1296
- children: /* @__PURE__ */ jsx("div", {
1297
- role: "row",
1298
- ref,
1299
- className,
1300
- onMouseEnter: handleDragEnter,
1301
- style: getRowStyle(gridRowStart, height),
1302
- ...props,
1303
- children: cells
1304
- })
1305
- });
1306
- }
1307
- const Row$1 = /* @__PURE__ */ memo(/* @__PURE__ */ forwardRef(Row));
1308
- function GroupCell({
1309
- id,
1310
- groupKey,
1311
- childRows,
1312
- isExpanded,
1313
- isCellSelected,
1314
- column,
1315
- row: row2,
1316
- groupColumnIndex,
1317
- toggleGroup: toggleGroupWrapper
1318
- }) {
1319
- const {
1320
- ref,
1321
- tabIndex,
1322
- onFocus
1323
- } = useRovingCellRef(isCellSelected);
1324
- function toggleGroup() {
1325
- toggleGroupWrapper(id);
1326
- }
1327
- const isLevelMatching = column.rowGroup && groupColumnIndex === column.idx;
1328
- return /* @__PURE__ */ jsx("div", {
1329
- role: "gridcell",
1330
- "aria-colindex": column.idx + 1,
1331
- "aria-selected": isCellSelected,
1332
- ref,
1333
- tabIndex,
1334
- className: getCellClassname(column),
1335
- style: {
1336
- ...getCellStyle(column),
1337
- cursor: isLevelMatching ? "pointer" : "default"
1338
- },
1339
- onClick: isLevelMatching ? toggleGroup : void 0,
1340
- onFocus,
1341
- children: (!column.rowGroup || groupColumnIndex === column.idx) && column.groupFormatter && /* @__PURE__ */ jsx(column.groupFormatter, {
1342
- groupKey,
1343
- childRows,
1344
- column,
1345
- row: row2,
1346
- isExpanded,
1347
- isCellSelected,
1348
- toggleGroup
1349
- })
1350
- }, column.key);
1351
- }
1352
- const GroupCell$1 = /* @__PURE__ */ memo(GroupCell);
1353
- var css_248z$6 = ".gyxx7e9700-beta13:not([aria-selected=true]){background-color:var(--rdg-header-background-color)}.gyxx7e9700-beta13>.c1wupbe700-beta13:not(:last-child):not(.c9dpaye700-beta13){border-inline-end:none}";
1354
- styleInject(css_248z$6, { "insertAt": "top" });
1355
- const groupRow = "gyxx7e9700-beta13";
1356
- const groupRowClassname = `rdg-group-row ${groupRow}`;
1357
- function GroupedRow({
1358
- id,
1359
- groupKey,
1360
- viewportColumns,
1361
- childRows,
1362
- rowIdx,
1363
- row: row2,
1364
- gridRowStart,
1365
- height,
1366
- level,
1367
- isExpanded,
1368
- selectedCellIdx,
1369
- isRowSelected,
1370
- selectGroup,
1371
- toggleGroup,
1372
- ...props
1373
- }) {
1374
- const idx = viewportColumns[0].key === SELECT_COLUMN_KEY ? level + 1 : level;
1375
- function handleSelectGroup() {
1376
- selectGroup(rowIdx);
1377
- }
1378
- return /* @__PURE__ */ jsx(RowSelectionProvider, {
1379
- value: isRowSelected,
1380
- children: /* @__PURE__ */ jsx("div", {
1381
- role: "row",
1382
- "aria-level": level,
1383
- "aria-expanded": isExpanded,
1384
- className: clsx(rowClassname, groupRowClassname, `rdg-row-${rowIdx % 2 === 0 ? "even" : "odd"}`, selectedCellIdx === -1 && rowSelectedClassname),
1385
- onClick: handleSelectGroup,
1386
- style: getRowStyle(gridRowStart, height),
1387
- ...props,
1388
- children: viewportColumns.map((column) => /* @__PURE__ */ jsx(GroupCell$1, {
1389
- id,
1390
- groupKey,
1391
- childRows,
1392
- isExpanded,
1393
- isCellSelected: selectedCellIdx === column.idx,
1394
- column,
1395
- row: row2,
1396
- groupColumnIndex: idx,
1397
- toggleGroup
1398
- }, column.key))
1399
- })
1400
- });
1401
- }
1402
- const GroupRowRenderer = /* @__PURE__ */ memo(GroupedRow);
1403
- var css_248z$5 = ".s1n3hxke700-beta13{inset-block-end:var(--rdg-summary-row-bottom);inset-block-start:var(--rdg-summary-row-top)}";
1404
- styleInject(css_248z$5, { "insertAt": "top" });
1405
- const summaryCellClassname = "s1n3hxke700-beta13";
1406
- function SummaryCell({
1407
- column,
1408
- colSpan,
1409
- row: row2,
1410
- isCellSelected,
1411
- selectCell
1412
- }) {
1413
- const {
1414
- ref,
1415
- tabIndex,
1416
- onFocus
1417
- } = useRovingCellRef(isCellSelected);
1418
- const {
1419
- summaryFormatter: SummaryFormatter,
1420
- summaryCellClass
1421
- } = column;
1422
- const className = getCellClassname(column, summaryCellClassname, typeof summaryCellClass === "function" ? summaryCellClass(row2) : summaryCellClass);
1423
- function onClick() {
1424
- selectCell(row2, column);
1425
- }
1426
- return /* @__PURE__ */ jsx("div", {
1427
- role: "gridcell",
1428
- "aria-colindex": column.idx + 1,
1429
- "aria-colspan": colSpan,
1430
- "aria-selected": isCellSelected,
1431
- ref,
1432
- tabIndex,
1433
- className,
1434
- style: getCellStyle(column, colSpan),
1435
- onClick,
1436
- onFocus,
1437
- children: SummaryFormatter && /* @__PURE__ */ jsx(SummaryFormatter, {
1438
- column,
1439
- row: row2,
1440
- isCellSelected
1441
- })
1442
- });
1443
- }
1444
- const SummaryCell$1 = /* @__PURE__ */ memo(SummaryCell);
1445
- var css_248z$4 = ".snfqesz700-beta13.r1otpg64700-beta13{line-height:var(--rdg-summary-row-height)}.snfqesz700-beta13.r1otpg64700-beta13>.c1wupbe700-beta13{position:sticky}.s1jijrjz700-beta13>.c1wupbe700-beta13{border-block-start:2px solid var(--rdg-summary-border-color)}";
1446
- styleInject(css_248z$4, { "insertAt": "top" });
1447
- const summaryRow = "snfqesz700-beta13";
1448
- const summaryRowBorderClassname = "s1jijrjz700-beta13";
1449
- const summaryRowClassname = `rdg-summary-row ${summaryRow}`;
1450
- function SummaryRow({
1451
- rowIdx,
1452
- gridRowStart,
1453
- row: row2,
1454
- viewportColumns,
1455
- top,
1456
- bottom,
1457
- lastFrozenColumnIndex,
1458
- selectedCellIdx,
1459
- selectCell,
1460
- "aria-rowindex": ariaRowIndex
1461
- }) {
1462
- const cells = [];
1463
- for (let index = 0; index < viewportColumns.length; index++) {
1464
- const column = viewportColumns[index];
1465
- const colSpan = getColSpan(column, lastFrozenColumnIndex, {
1466
- type: "SUMMARY",
1467
- row: row2
1468
- });
1469
- if (colSpan !== void 0) {
1470
- index += colSpan - 1;
1471
- }
1472
- const isCellSelected = selectedCellIdx === column.idx;
1473
- cells.push(/* @__PURE__ */ jsx(SummaryCell$1, {
1474
- column,
1475
- colSpan,
1476
- row: row2,
1477
- isCellSelected,
1478
- selectCell
1479
- }, column.key));
1480
- }
1481
- return /* @__PURE__ */ jsx("div", {
1482
- role: "row",
1483
- "aria-rowindex": ariaRowIndex,
1484
- className: clsx(rowClassname, `rdg-row-${rowIdx % 2 === 0 ? "even" : "odd"}`, summaryRowClassname, rowIdx === 0 && summaryRowBorderClassname, selectedCellIdx === -1 && rowSelectedClassname),
1485
- style: {
1486
- ...getRowStyle(gridRowStart),
1487
- "--rdg-summary-row-top": top !== void 0 ? `${top}px` : void 0,
1488
- "--rdg-summary-row-bottom": bottom !== void 0 ? `${bottom}px` : void 0
1489
- },
1490
- children: cells
1491
- });
1492
- }
1493
- const SummaryRow$1 = /* @__PURE__ */ memo(SummaryRow);
1494
- var css_248z$3 = ".c1tngyp1700-beta13.rdg-cell{padding:0}";
1495
- styleInject(css_248z$3, { "insertAt": "top" });
1496
- const cellEditing = "c1tngyp1700-beta13";
1497
- function EditCell({
1498
- column,
1499
- colSpan,
1500
- row: row2,
1501
- onRowChange,
1502
- closeEditor
1503
- }) {
1504
- const frameRequestRef = useRef();
1505
- const commitOnOutsideClick = column.editorOptions?.commitOnOutsideClick !== false;
1506
- const commitOnOutsideMouseDown = useLatestFunc(() => {
1507
- onClose(true);
1508
- });
1509
- useEffect(() => {
1510
- if (!commitOnOutsideClick) return;
1511
- function onWindowCaptureMouseDown() {
1512
- frameRequestRef.current = requestAnimationFrame(commitOnOutsideMouseDown);
1513
- }
1514
- addEventListener("mousedown", onWindowCaptureMouseDown, {
1515
- capture: true
1516
- });
1517
- return () => {
1518
- removeEventListener("mousedown", onWindowCaptureMouseDown, {
1519
- capture: true
1520
- });
1521
- cancelFrameRequest();
1522
- };
1523
- }, [commitOnOutsideClick, commitOnOutsideMouseDown]);
1524
- function cancelFrameRequest() {
1525
- cancelAnimationFrame(frameRequestRef.current);
1526
- }
1527
- function onKeyDown(event) {
1528
- if (event.key === "Escape") {
1529
- event.stopPropagation();
1530
- onClose();
1531
- } else if (event.key === "Enter") {
1532
- event.stopPropagation();
1533
- onClose(true);
1534
- } else {
1535
- const onNavigation = column.editorOptions?.onNavigation ?? onEditorNavigation;
1536
- if (!onNavigation(event)) {
1537
- event.stopPropagation();
1538
- }
1539
- }
1540
- }
1541
- function onClose(commitChanges) {
1542
- if (commitChanges) {
1543
- onRowChange(row2, true);
1544
- } else {
1545
- closeEditor();
1546
- }
1547
- }
1548
- const {
1549
- cellClass
1550
- } = column;
1551
- const className = getCellClassname(column, "rdg-editor-container", typeof cellClass === "function" ? cellClass(row2) : cellClass, !column.editorOptions?.renderFormatter && cellEditing);
1552
- return /* @__PURE__ */ jsx("div", {
1553
- role: "gridcell",
1554
- "aria-colindex": column.idx + 1,
1555
- "aria-colspan": colSpan,
1556
- "aria-selected": true,
1557
- className,
1558
- style: getCellStyle(column, colSpan),
1559
- onKeyDown,
1560
- onMouseDownCapture: commitOnOutsideClick ? cancelFrameRequest : void 0,
1561
- children: column.editor != null && /* @__PURE__ */ jsxs(Fragment, {
1562
- children: [/* @__PURE__ */ jsx(column.editor, {
1563
- column,
1564
- row: row2,
1565
- onRowChange,
1566
- onClose
1567
- }), column.editorOptions?.renderFormatter && /* @__PURE__ */ jsx(column.formatter, {
1568
- column,
1569
- row: row2,
1570
- isCellSelected: true,
1571
- onRowChange
1572
- })]
1573
- })
1574
- });
1575
- }
1576
- var css_248z$2 = ".cadd3bp700-beta13{background-color:var(--rdg-selection-color);block-size:8px;cursor:move;inline-size:8px;inset-block-end:0;inset-inline-end:0;position:absolute}.cadd3bp700-beta13:hover{background-color:var(--rdg-background-color);block-size:16px;border:2px solid var(--rdg-selection-color);inline-size:16px}";
1577
- styleInject(css_248z$2, { "insertAt": "top" });
1578
- const cellDragHandle = "cadd3bp700-beta13";
1579
- const cellDragHandleClassname = `rdg-cell-drag-handle ${cellDragHandle}`;
1580
- function DragHandle({
1581
- rows,
1582
- columns,
1583
- selectedPosition,
1584
- latestDraggedOverRowIdx,
1585
- isCellEditable: isCellEditable2,
1586
- onRowsChange,
1587
- onFill,
1588
- setDragging,
1589
- setDraggedOverRowIdx
1590
- }) {
1591
- function handleMouseDown(event) {
1592
- if (event.buttons !== 1) return;
1593
- setDragging(true);
1594
- window.addEventListener("mouseover", onMouseOver);
1595
- window.addEventListener("mouseup", onMouseUp);
1596
- function onMouseOver(event2) {
1597
- if (event2.buttons !== 1) onMouseUp();
1598
- }
1599
- function onMouseUp() {
1600
- window.removeEventListener("mouseover", onMouseOver);
1601
- window.removeEventListener("mouseup", onMouseUp);
1602
- setDragging(false);
1603
- handleDragEnd();
1604
- }
1605
- }
1606
- function handleDragEnd() {
1607
- const overRowIdx = latestDraggedOverRowIdx.current;
1608
- if (overRowIdx === void 0) return;
1609
- const {
1610
- rowIdx
1611
- } = selectedPosition;
1612
- const startRowIndex = rowIdx < overRowIdx ? rowIdx + 1 : overRowIdx;
1613
- const endRowIndex = rowIdx < overRowIdx ? overRowIdx + 1 : rowIdx;
1614
- updateRows(startRowIndex, endRowIndex);
1615
- setDraggedOverRowIdx(void 0);
1616
- }
1617
- function handleDoubleClick(event) {
1618
- event.stopPropagation();
1619
- updateRows(selectedPosition.rowIdx + 1, rows.length);
1620
- }
1621
- function updateRows(startRowIdx, endRowIdx) {
1622
- const {
1623
- idx,
1624
- rowIdx
1625
- } = selectedPosition;
1626
- const column = columns[idx];
1627
- const sourceRow = rows[rowIdx];
1628
- const updatedRows = [...rows];
1629
- const indexes = [];
1630
- for (let i = startRowIdx; i < endRowIdx; i++) {
1631
- if (isCellEditable2({
1632
- rowIdx: i,
1633
- idx
1634
- })) {
1635
- const updatedRow = onFill({
1636
- columnKey: column.key,
1637
- sourceRow,
1638
- targetRow: rows[i]
1639
- });
1640
- if (updatedRow !== rows[i]) {
1641
- updatedRows[i] = updatedRow;
1642
- indexes.push(i);
1643
- }
1644
- }
1645
- }
1646
- if (indexes.length > 0) {
1647
- onRowsChange?.(updatedRows, {
1648
- indexes,
1649
- column
1650
- });
1651
- }
1652
- }
1653
- return /* @__PURE__ */ jsx("div", {
1654
- className: cellDragHandleClassname,
1655
- onMouseDown: handleMouseDown,
1656
- onDoubleClick: handleDoubleClick
1657
- });
1658
- }
1659
- var css_248z$1 = ".a888944700-beta13{fill:currentColor}.a888944700-beta13>path{transition:d .1s}";
1660
- styleInject(css_248z$1, { "insertAt": "top" });
1661
- const arrow = "a888944700-beta13";
1662
- const arrowClassname = `rdg-sort-arrow ${arrow}`;
1663
- function SortIcon({
1664
- sortDirection
1665
- }) {
1666
- return sortDirection !== void 0 ? /* @__PURE__ */ jsx("svg", {
1667
- viewBox: "0 0 12 8",
1668
- width: "12",
1669
- height: "8",
1670
- className: arrowClassname,
1671
- "aria-hidden": true,
1672
- children: /* @__PURE__ */ jsx("path", {
1673
- d: sortDirection === "ASC" ? "M0 8 6 0 12 8" : "M0 0 6 8 12 0"
1674
- })
1675
- }) : null;
1676
- }
1677
- const initialPosition = {
1678
- idx: -1,
1679
- rowIdx: -2,
1680
- mode: "SELECT"
1681
- };
1682
- function DataGrid({
1683
- columns: rawColumns,
1684
- rows: rawRows,
1685
- summaryRows,
1686
- rowKeyGetter,
1687
- onRowsChange,
1688
- rowHeight,
1689
- headerRowHeight: rawHeaderRowHeight,
1690
- summaryRowHeight: rawSummaryRowHeight,
1691
- selectedRows,
1692
- onSelectedRowsChange,
1693
- sortColumns,
1694
- onSortColumnsChange,
1695
- defaultColumnOptions,
1696
- groupBy: rawGroupBy,
1697
- rowGrouper,
1698
- expandedGroupIds,
1699
- onExpandedGroupIdsChange,
1700
- onRowClick,
1701
- onRowDoubleClick,
1702
- onScroll,
1703
- onColumnResize,
1704
- onFill,
1705
- onCopy,
1706
- onPaste,
1707
- cellNavigationMode: rawCellNavigationMode,
1708
- enableVirtualization,
1709
- components,
1710
- className,
1711
- style,
1712
- rowClass,
1713
- direction,
1714
- "aria-label": ariaLabel,
1715
- "aria-labelledby": ariaLabelledBy,
1716
- "aria-describedby": ariaDescribedBy,
1717
- "data-testid": testId
1718
- }, ref) {
1719
- const defaultComponents = useDefaultComponents();
1720
- rowHeight ?? (rowHeight = 35);
1721
- const headerRowHeight = rawHeaderRowHeight ?? (typeof rowHeight === "number" ? rowHeight : 35);
1722
- const summaryRowHeight = rawSummaryRowHeight ?? (typeof rowHeight === "number" ? rowHeight : 35);
1723
- const RowRenderer = components?.rowRenderer ?? defaultComponents?.rowRenderer ?? Row$1;
1724
- const sortIcon = components?.sortIcon ?? defaultComponents?.sortIcon ?? SortIcon;
1725
- const checkboxFormatter = components?.checkboxFormatter ?? defaultComponents?.checkboxFormatter ?? CheckboxFormatter;
1726
- const noRowsFallback = components?.noRowsFallback ?? defaultComponents?.noRowsFallback;
1727
- const cellNavigationMode = rawCellNavigationMode ?? "NONE";
1728
- enableVirtualization ?? (enableVirtualization = true);
1729
- direction ?? (direction = "ltr");
1730
- const [scrollTop, setScrollTop] = useState(0);
1731
- const [scrollLeft, setScrollLeft] = useState(0);
1732
- const [columnWidths, setColumnWidths] = useState(() => /* @__PURE__ */ new Map());
1733
- const [selectedPosition, setSelectedPosition] = useState(initialPosition);
1734
- const [copiedCell, setCopiedCell] = useState(null);
1735
- const [isDragging, setDragging] = useState(false);
1736
- const [draggedOverRowIdx, setOverRowIdx] = useState(void 0);
1737
- const [autoResizeColumn, setAutoResizeColumn] = useState(null);
1738
- const prevSelectedPosition = useRef(selectedPosition);
1739
- const latestDraggedOverRowIdx = useRef(draggedOverRowIdx);
1740
- const lastSelectedRowIdx = useRef(-1);
1741
- const rowRef = useRef(null);
1742
- const [gridRef, gridWidth, gridHeight] = useGridDimensions();
1743
- const headerRowsCount = 1;
1744
- const summaryRowsCount = summaryRows?.length ?? 0;
1745
- const clientHeight = gridHeight - headerRowHeight - summaryRowsCount * summaryRowHeight;
1746
- const isSelectable = selectedRows != null && onSelectedRowsChange != null;
1747
- const isHeaderRowSelected = selectedPosition.rowIdx === -1;
1748
- const isRtl = direction === "rtl";
1749
- const leftKey = isRtl ? "ArrowRight" : "ArrowLeft";
1750
- const rightKey = isRtl ? "ArrowLeft" : "ArrowRight";
1751
- const defaultGridComponents = useMemo(() => ({
1752
- sortIcon,
1753
- checkboxFormatter
1754
- }), [sortIcon, checkboxFormatter]);
1755
- const allRowsSelected = useMemo(() => {
1756
- const {
1757
- length
1758
- } = rawRows;
1759
- return length !== 0 && selectedRows != null && rowKeyGetter != null && selectedRows.size >= length && rawRows.every((row2) => selectedRows.has(rowKeyGetter(row2)));
1760
- }, [rawRows, selectedRows, rowKeyGetter]);
1761
- const {
1762
- columns,
1763
- colSpanColumns,
1764
- colOverscanStartIdx,
1765
- colOverscanEndIdx,
1766
- layoutCssVars,
1767
- columnMetrics,
1768
- lastFrozenColumnIndex,
1769
- totalFrozenColumnWidth,
1770
- groupBy
1771
- } = useCalculatedColumns({
1772
- rawColumns,
1773
- columnWidths,
1774
- scrollLeft,
1775
- viewportWidth: gridWidth,
1776
- defaultColumnOptions,
1777
- rawGroupBy: rowGrouper ? rawGroupBy : void 0,
1778
- enableVirtualization
1779
- });
1780
- const {
1781
- rowOverscanStartIdx,
1782
- rowOverscanEndIdx,
1783
- rows,
1784
- rowsCount,
1785
- totalRowHeight,
1786
- gridTemplateRows,
1787
- isGroupRow,
1788
- getRowTop,
1789
- getRowHeight,
1790
- findRowIdx
1791
- } = useViewportRows({
1792
- rawRows,
1793
- groupBy,
1794
- rowGrouper,
1795
- rowHeight,
1796
- clientHeight,
1797
- scrollTop,
1798
- expandedGroupIds,
1799
- enableVirtualization
1800
- });
1801
- const viewportColumns = useViewportColumns({
1802
- columns,
1803
- colSpanColumns,
1804
- colOverscanStartIdx,
1805
- colOverscanEndIdx,
1806
- lastFrozenColumnIndex,
1807
- rowOverscanStartIdx,
1808
- rowOverscanEndIdx,
1809
- rows,
1810
- summaryRows,
1811
- isGroupRow
1812
- });
1813
- const hasGroups = groupBy.length > 0 && typeof rowGrouper === "function";
1814
- const minColIdx = hasGroups ? -1 : 0;
1815
- const maxColIdx = columns.length - 1;
1816
- const minRowIdx = -1;
1817
- const maxRowIdx = headerRowsCount + rows.length + summaryRowsCount - 2;
1818
- const selectedCellIsWithinSelectionBounds = isCellWithinSelectionBounds(selectedPosition);
1819
- const selectedCellIsWithinViewportBounds = isCellWithinViewportBounds(selectedPosition);
1820
- const selectRowLatest = useLatestFunc(selectRow);
1821
- const selectAllRowsLatest = useLatestFunc(selectAllRows);
1822
- const handleFormatterRowChangeLatest = useLatestFunc(updateRow);
1823
- const selectViewportCellLatest = useLatestFunc((row2, column, enableEditor) => {
1824
- const rowIdx = rows.indexOf(row2);
1825
- selectCell({
1826
- rowIdx,
1827
- idx: column.idx
1828
- }, enableEditor);
1829
- });
1830
- const selectGroupLatest = useLatestFunc((rowIdx) => {
1831
- selectCell({
1832
- rowIdx,
1833
- idx: -1
1834
- });
1835
- });
1836
- const selectHeaderCellLatest = useLatestFunc((idx) => {
1837
- selectCell({
1838
- rowIdx: -1,
1839
- idx
1840
- });
1841
- });
1842
- const selectSummaryCellLatest = useLatestFunc((summaryRow2, column) => {
1843
- const rowIdx = summaryRows.indexOf(summaryRow2) + headerRowsCount + rows.length - 1;
1844
- selectCell({
1845
- rowIdx,
1846
- idx: column.idx
1847
- });
1848
- });
1849
- const toggleGroupLatest = useLatestFunc(toggleGroup);
1850
- useLayoutEffect(() => {
1851
- if (!selectedCellIsWithinSelectionBounds || isSamePosition(selectedPosition, prevSelectedPosition.current)) {
1852
- prevSelectedPosition.current = selectedPosition;
1853
- return;
1854
- }
1855
- prevSelectedPosition.current = selectedPosition;
1856
- if (selectedPosition.idx === -1) {
1857
- rowRef.current.focus({
1858
- preventScroll: true
1859
- });
1860
- scrollIntoView(rowRef.current);
1861
- }
1862
- });
1863
- useLayoutEffect(() => {
1864
- if (autoResizeColumn === null) return;
1865
- const columnElement = gridRef.current.querySelector(`[aria-colindex="${autoResizeColumn.idx + 1}"]`);
1866
- const {
1867
- width
1868
- } = columnElement.getBoundingClientRect();
1869
- setColumnWidths((columnWidths2) => {
1870
- const newColumnWidths = new Map(columnWidths2);
1871
- newColumnWidths.set(autoResizeColumn.key, width);
1872
- return newColumnWidths;
1873
- });
1874
- setAutoResizeColumn(null);
1875
- onColumnResize?.(autoResizeColumn.idx, width);
1876
- }, [autoResizeColumn, gridRef, onColumnResize]);
1877
- useImperativeHandle(ref, () => ({
1878
- element: gridRef.current,
1879
- scrollToColumn,
1880
- scrollToRow(rowIdx) {
1881
- const {
1882
- current
1883
- } = gridRef;
1884
- if (!current) return;
1885
- current.scrollTo({
1886
- top: getRowTop(rowIdx),
1887
- behavior: "smooth"
1888
- });
1889
- },
1890
- selectCell
1891
- }));
1892
- const handleColumnResize = useCallback((column, width) => {
1893
- if (width === "auto") {
1894
- setAutoResizeColumn(column);
1895
- return;
1896
- }
1897
- setColumnWidths((columnWidths2) => {
1898
- const newColumnWidths = new Map(columnWidths2);
1899
- newColumnWidths.set(column.key, width);
1900
- return newColumnWidths;
1901
- });
1902
- onColumnResize?.(column.idx, width);
1903
- }, [onColumnResize]);
1904
- const setDraggedOverRowIdx = useCallback((rowIdx) => {
1905
- setOverRowIdx(rowIdx);
1906
- latestDraggedOverRowIdx.current = rowIdx;
1907
- }, []);
1908
- function selectRow({
1909
- row: row2,
1910
- checked,
1911
- isShiftClick
1912
- }) {
1913
- if (!onSelectedRowsChange) return;
1914
- assertIsValidKeyGetter(rowKeyGetter);
1915
- const newSelectedRows = new Set(selectedRows);
1916
- if (isGroupRow(row2)) {
1917
- for (const childRow of row2.childRows) {
1918
- const rowKey2 = rowKeyGetter(childRow);
1919
- if (checked) {
1920
- newSelectedRows.add(rowKey2);
1921
- } else {
1922
- newSelectedRows.delete(rowKey2);
1923
- }
1924
- }
1925
- onSelectedRowsChange(newSelectedRows);
1926
- return;
1927
- }
1928
- const rowKey = rowKeyGetter(row2);
1929
- if (checked) {
1930
- newSelectedRows.add(rowKey);
1931
- const previousRowIdx = lastSelectedRowIdx.current;
1932
- const rowIdx = rows.indexOf(row2);
1933
- lastSelectedRowIdx.current = rowIdx;
1934
- if (isShiftClick && previousRowIdx !== -1 && previousRowIdx !== rowIdx) {
1935
- const step = sign(rowIdx - previousRowIdx);
1936
- for (let i = previousRowIdx + step; i !== rowIdx; i += step) {
1937
- const row3 = rows[i];
1938
- if (isGroupRow(row3)) continue;
1939
- newSelectedRows.add(rowKeyGetter(row3));
1940
- }
1941
- }
1942
- } else {
1943
- newSelectedRows.delete(rowKey);
1944
- lastSelectedRowIdx.current = -1;
1945
- }
1946
- onSelectedRowsChange(newSelectedRows);
1947
- }
1948
- function selectAllRows(checked) {
1949
- if (!onSelectedRowsChange) return;
1950
- assertIsValidKeyGetter(rowKeyGetter);
1951
- const newSelectedRows = new Set(selectedRows);
1952
- for (const row2 of rawRows) {
1953
- const rowKey = rowKeyGetter(row2);
1954
- if (checked) {
1955
- newSelectedRows.add(rowKey);
1956
- } else {
1957
- newSelectedRows.delete(rowKey);
1958
- }
1959
- }
1960
- onSelectedRowsChange(newSelectedRows);
1961
- }
1962
- function toggleGroup(expandedGroupId) {
1963
- if (!onExpandedGroupIdsChange) return;
1964
- const newExpandedGroupIds = new Set(expandedGroupIds);
1965
- if (newExpandedGroupIds.has(expandedGroupId)) {
1966
- newExpandedGroupIds.delete(expandedGroupId);
1967
- } else {
1968
- newExpandedGroupIds.add(expandedGroupId);
1969
- }
1970
- onExpandedGroupIdsChange(newExpandedGroupIds);
1971
- }
1972
- function handleKeyDown(event) {
1973
- if (!(event.target instanceof Element)) return;
1974
- const isCellEvent = event.target.closest(".rdg-cell") !== null;
1975
- const isRowEvent = hasGroups && event.target === rowRef.current;
1976
- if (!isCellEvent && !isRowEvent) return;
1977
- const {
1978
- key,
1979
- keyCode
1980
- } = event;
1981
- const {
1982
- rowIdx
1983
- } = selectedPosition;
1984
- if (selectedCellIsWithinViewportBounds && (onPaste != null || onCopy != null) && isCtrlKeyHeldDown(event) && !isGroupRow(rows[rowIdx]) && selectedPosition.mode === "SELECT") {
1985
- const cKey = 67;
1986
- const vKey = 86;
1987
- if (keyCode === cKey) {
1988
- handleCopy();
1989
- return;
1990
- }
1991
- if (keyCode === vKey) {
1992
- handlePaste();
1993
- return;
1994
- }
1995
- }
1996
- if (isRowIdxWithinViewportBounds(rowIdx)) {
1997
- const row2 = rows[rowIdx];
1998
- if (isGroupRow(row2) && selectedPosition.idx === -1 && (key === leftKey && row2.isExpanded || key === rightKey && !row2.isExpanded)) {
1999
- event.preventDefault();
2000
- toggleGroup(row2.id);
2001
- return;
2002
- }
2003
- }
2004
- switch (event.key) {
2005
- case "Escape":
2006
- setCopiedCell(null);
2007
- return;
2008
- case "ArrowUp":
2009
- case "ArrowDown":
2010
- case "ArrowLeft":
2011
- case "ArrowRight":
2012
- case "Tab":
2013
- case "Home":
2014
- case "End":
2015
- case "PageUp":
2016
- case "PageDown":
2017
- navigate(event);
2018
- break;
2019
- default:
2020
- handleCellInput(event);
2021
- break;
2022
- }
2023
- }
2024
- function handleScroll(event) {
2025
- const {
2026
- scrollTop: scrollTop2,
2027
- scrollLeft: scrollLeft2
2028
- } = event.currentTarget;
2029
- setScrollTop(scrollTop2);
2030
- setScrollLeft(abs(scrollLeft2));
2031
- onScroll?.(event);
2032
- }
2033
- function getRawRowIdx(rowIdx) {
2034
- return hasGroups ? rawRows.indexOf(rows[rowIdx]) : rowIdx;
2035
- }
2036
- function updateRow(rowIdx, row2) {
2037
- if (typeof onRowsChange !== "function") return;
2038
- const rawRowIdx = getRawRowIdx(rowIdx);
2039
- if (row2 === rawRows[rawRowIdx]) return;
2040
- const updatedRows = [...rawRows];
2041
- updatedRows[rawRowIdx] = row2;
2042
- onRowsChange(updatedRows, {
2043
- indexes: [rawRowIdx],
2044
- column: columns[selectedPosition.idx]
2045
- });
2046
- }
2047
- function commitEditorChanges() {
2048
- if (selectedPosition.mode !== "EDIT") return;
2049
- updateRow(selectedPosition.rowIdx, selectedPosition.row);
2050
- }
2051
- function handleCopy() {
2052
- const {
2053
- idx,
2054
- rowIdx
2055
- } = selectedPosition;
2056
- const sourceRow = rawRows[getRawRowIdx(rowIdx)];
2057
- const sourceColumnKey = columns[idx].key;
2058
- setCopiedCell({
2059
- row: sourceRow,
2060
- columnKey: sourceColumnKey
2061
- });
2062
- onCopy?.({
2063
- sourceRow,
2064
- sourceColumnKey
2065
- });
2066
- }
2067
- function handlePaste() {
2068
- if (!onPaste || !onRowsChange || copiedCell === null || !isCellEditable2(selectedPosition)) {
2069
- return;
2070
- }
2071
- const {
2072
- idx,
2073
- rowIdx
2074
- } = selectedPosition;
2075
- const targetRow = rawRows[getRawRowIdx(rowIdx)];
2076
- const updatedTargetRow = onPaste({
2077
- sourceRow: copiedCell.row,
2078
- sourceColumnKey: copiedCell.columnKey,
2079
- targetRow,
2080
- targetColumnKey: columns[idx].key
2081
- });
2082
- updateRow(rowIdx, updatedTargetRow);
2083
- }
2084
- function handleCellInput(event) {
2085
- if (!selectedCellIsWithinViewportBounds) return;
2086
- const row2 = rows[selectedPosition.rowIdx];
2087
- if (isGroupRow(row2)) return;
2088
- const {
2089
- key,
2090
- shiftKey
2091
- } = event;
2092
- if (isSelectable && shiftKey && key === " ") {
2093
- assertIsValidKeyGetter(rowKeyGetter);
2094
- const rowKey = rowKeyGetter(row2);
2095
- selectRow({
2096
- row: row2,
2097
- checked: !selectedRows.has(rowKey),
2098
- isShiftClick: false
2099
- });
2100
- event.preventDefault();
2101
- return;
2102
- }
2103
- const column = columns[selectedPosition.idx];
2104
- column.editorOptions?.onCellKeyDown?.(event);
2105
- if (event.isDefaultPrevented()) return;
2106
- if (isCellEditable2(selectedPosition) && isDefaultCellInput(event)) {
2107
- setSelectedPosition(({
2108
- idx,
2109
- rowIdx
2110
- }) => ({
2111
- idx,
2112
- rowIdx,
2113
- mode: "EDIT",
2114
- row: row2,
2115
- originalRow: row2
2116
- }));
2117
- }
2118
- }
2119
- function isColIdxWithinSelectionBounds(idx) {
2120
- return idx >= minColIdx && idx <= maxColIdx;
2121
- }
2122
- function isRowIdxWithinViewportBounds(rowIdx) {
2123
- return rowIdx >= 0 && rowIdx < rows.length;
2124
- }
2125
- function isCellWithinSelectionBounds({
2126
- idx,
2127
- rowIdx
2128
- }) {
2129
- return rowIdx >= minRowIdx && rowIdx <= maxRowIdx && isColIdxWithinSelectionBounds(idx);
2130
- }
2131
- function isCellWithinViewportBounds({
2132
- idx,
2133
- rowIdx
2134
- }) {
2135
- return isRowIdxWithinViewportBounds(rowIdx) && isColIdxWithinSelectionBounds(idx);
2136
- }
2137
- function isCellEditable2(position) {
2138
- return isCellWithinViewportBounds(position) && isSelectedCellEditable({
2139
- columns,
2140
- rows,
2141
- selectedPosition: position,
2142
- isGroupRow
2143
- });
2144
- }
2145
- function selectCell(position, enableEditor) {
2146
- if (!isCellWithinSelectionBounds(position)) return;
2147
- commitEditorChanges();
2148
- if (enableEditor && isCellEditable2(position)) {
2149
- const row2 = rows[position.rowIdx];
2150
- setSelectedPosition({
2151
- ...position,
2152
- mode: "EDIT",
2153
- row: row2,
2154
- originalRow: row2
2155
- });
2156
- } else if (isSamePosition(selectedPosition, position)) {
2157
- scrollIntoView(gridRef.current?.querySelector('[tabindex="0"]'));
2158
- } else {
2159
- setSelectedPosition({
2160
- ...position,
2161
- mode: "SELECT"
2162
- });
2163
- }
2164
- }
2165
- function scrollToColumn(idx) {
2166
- const {
2167
- current
2168
- } = gridRef;
2169
- if (!current) return;
2170
- if (idx > lastFrozenColumnIndex) {
2171
- const {
2172
- rowIdx
2173
- } = selectedPosition;
2174
- if (!isCellWithinSelectionBounds({
2175
- rowIdx,
2176
- idx
2177
- })) return;
2178
- const {
2179
- clientWidth
2180
- } = current;
2181
- const column = columns[idx];
2182
- const {
2183
- left,
2184
- width
2185
- } = columnMetrics.get(column);
2186
- let right = left + width;
2187
- const colSpan = getSelectedCellColSpan({
2188
- rows,
2189
- summaryRows,
2190
- rowIdx,
2191
- lastFrozenColumnIndex,
2192
- column,
2193
- isGroupRow
2194
- });
2195
- if (colSpan !== void 0) {
2196
- const {
2197
- left: left2,
2198
- width: width2
2199
- } = columnMetrics.get(columns[column.idx + colSpan - 1]);
2200
- right = left2 + width2;
2201
- }
2202
- const isCellAtLeftBoundary = left < scrollLeft + totalFrozenColumnWidth;
2203
- const isCellAtRightBoundary = right > clientWidth + scrollLeft;
2204
- const sign2 = isRtl ? -1 : 1;
2205
- if (isCellAtLeftBoundary) {
2206
- current.scrollLeft = (left - totalFrozenColumnWidth) * sign2;
2207
- } else if (isCellAtRightBoundary) {
2208
- current.scrollLeft = (right - clientWidth) * sign2;
2209
- }
2210
- }
2211
- }
2212
- function getNextPosition(key, ctrlKey, shiftKey) {
2213
- const {
2214
- idx,
2215
- rowIdx
2216
- } = selectedPosition;
2217
- const row2 = rows[rowIdx];
2218
- const isRowSelected = selectedCellIsWithinSelectionBounds && idx === -1;
2219
- if (key === leftKey && isRowSelected && isGroupRow(row2) && !row2.isExpanded && row2.level !== 0) {
2220
- let parentRowIdx = -1;
2221
- for (let i = selectedPosition.rowIdx - 1; i >= 0; i--) {
2222
- const parentRow = rows[i];
2223
- if (isGroupRow(parentRow) && parentRow.id === row2.parentId) {
2224
- parentRowIdx = i;
2225
- break;
2226
- }
2227
- }
2228
- if (parentRowIdx !== -1) {
2229
- return {
2230
- idx,
2231
- rowIdx: parentRowIdx
2232
- };
2233
- }
2234
- }
2235
- switch (key) {
2236
- case "ArrowUp":
2237
- return {
2238
- idx,
2239
- rowIdx: rowIdx - 1
2240
- };
2241
- case "ArrowDown":
2242
- return {
2243
- idx,
2244
- rowIdx: rowIdx + 1
2245
- };
2246
- case leftKey:
2247
- return {
2248
- idx: idx - 1,
2249
- rowIdx
2250
- };
2251
- case rightKey:
2252
- return {
2253
- idx: idx + 1,
2254
- rowIdx
2255
- };
2256
- case "Tab":
2257
- return {
2258
- idx: idx + (shiftKey ? -1 : 1),
2259
- rowIdx
2260
- };
2261
- case "Home":
2262
- if (isRowSelected) return {
2263
- idx,
2264
- rowIdx: 0
2265
- };
2266
- return {
2267
- idx: 0,
2268
- rowIdx: ctrlKey ? minRowIdx : rowIdx
2269
- };
2270
- case "End":
2271
- if (isRowSelected) return {
2272
- idx,
2273
- rowIdx: rows.length - 1
2274
- };
2275
- return {
2276
- idx: maxColIdx,
2277
- rowIdx: ctrlKey ? maxRowIdx : rowIdx
2278
- };
2279
- case "PageUp": {
2280
- if (selectedPosition.rowIdx === minRowIdx) return selectedPosition;
2281
- const nextRowY = getRowTop(rowIdx) + getRowHeight(rowIdx) - clientHeight;
2282
- return {
2283
- idx,
2284
- rowIdx: nextRowY > 0 ? findRowIdx(nextRowY) : 0
2285
- };
2286
- }
2287
- case "PageDown": {
2288
- if (selectedPosition.rowIdx >= rows.length) return selectedPosition;
2289
- const nextRowY = getRowTop(rowIdx) + clientHeight;
2290
- return {
2291
- idx,
2292
- rowIdx: nextRowY < totalRowHeight ? findRowIdx(nextRowY) : rows.length - 1
2293
- };
2294
- }
2295
- default:
2296
- return selectedPosition;
2297
- }
2298
- }
2299
- function navigate(event) {
2300
- const {
2301
- key,
2302
- shiftKey
2303
- } = event;
2304
- let mode = cellNavigationMode;
2305
- if (key === "Tab") {
2306
- if (canExitGrid({
2307
- shiftKey,
2308
- cellNavigationMode,
2309
- maxColIdx,
2310
- minRowIdx,
2311
- maxRowIdx,
2312
- selectedPosition
2313
- })) {
2314
- commitEditorChanges();
2315
- return;
2316
- }
2317
- mode = cellNavigationMode === "NONE" ? "CHANGE_ROW" : cellNavigationMode;
2318
- }
2319
- event.preventDefault();
2320
- const ctrlKey = isCtrlKeyHeldDown(event);
2321
- const nextPosition = getNextPosition(key, ctrlKey, shiftKey);
2322
- if (isSamePosition(selectedPosition, nextPosition)) return;
2323
- const nextSelectedCellPosition = getNextSelectedCellPosition({
2324
- columns,
2325
- colSpanColumns,
2326
- rows,
2327
- summaryRows,
2328
- minRowIdx,
2329
- maxRowIdx,
2330
- lastFrozenColumnIndex,
2331
- cellNavigationMode: mode,
2332
- currentPosition: selectedPosition,
2333
- nextPosition,
2334
- isCellWithinBounds: isCellWithinSelectionBounds,
2335
- isGroupRow
2336
- });
2337
- selectCell(nextSelectedCellPosition);
2338
- }
2339
- function getDraggedOverCellIdx(currentRowIdx) {
2340
- if (draggedOverRowIdx === void 0) return;
2341
- const {
2342
- rowIdx
2343
- } = selectedPosition;
2344
- const isDraggedOver = rowIdx < draggedOverRowIdx ? rowIdx < currentRowIdx && currentRowIdx <= draggedOverRowIdx : rowIdx > currentRowIdx && currentRowIdx >= draggedOverRowIdx;
2345
- return isDraggedOver ? selectedPosition.idx : void 0;
2346
- }
2347
- function getLayoutCssVars() {
2348
- if (autoResizeColumn === null) return layoutCssVars;
2349
- const {
2350
- gridTemplateColumns
2351
- } = layoutCssVars;
2352
- const newSizes = gridTemplateColumns.split(" ");
2353
- newSizes[autoResizeColumn.idx] = "max-content";
2354
- return {
2355
- ...layoutCssVars,
2356
- gridTemplateColumns: newSizes.join(" ")
2357
- };
2358
- }
2359
- function getDragHandle(rowIdx) {
2360
- if (selectedPosition.rowIdx !== rowIdx || selectedPosition.mode === "EDIT" || hasGroups || onFill == null) {
2361
- return;
2362
- }
2363
- return /* @__PURE__ */ jsx(DragHandle, {
2364
- rows: rawRows,
2365
- columns,
2366
- selectedPosition,
2367
- isCellEditable: isCellEditable2,
2368
- latestDraggedOverRowIdx,
2369
- onRowsChange,
2370
- onFill,
2371
- setDragging,
2372
- setDraggedOverRowIdx
2373
- });
2374
- }
2375
- function getCellEditor(rowIdx) {
2376
- if (selectedPosition.rowIdx !== rowIdx || selectedPosition.mode === "SELECT") return;
2377
- const {
2378
- idx,
2379
- row: row2
2380
- } = selectedPosition;
2381
- const column = columns[idx];
2382
- const colSpan = getColSpan(column, lastFrozenColumnIndex, {
2383
- type: "ROW",
2384
- row: row2
2385
- });
2386
- const closeEditor = () => {
2387
- setSelectedPosition(({
2388
- idx: idx2,
2389
- rowIdx: rowIdx2
2390
- }) => ({
2391
- idx: idx2,
2392
- rowIdx: rowIdx2,
2393
- mode: "SELECT"
2394
- }));
2395
- };
2396
- const onRowChange = (row3, commitChanges) => {
2397
- if (commitChanges) {
2398
- updateRow(selectedPosition.rowIdx, row3);
2399
- closeEditor();
2400
- } else {
2401
- setSelectedPosition((position) => ({
2402
- ...position,
2403
- row: row3
2404
- }));
2405
- }
2406
- };
2407
- if (rows[selectedPosition.rowIdx] !== selectedPosition.originalRow) {
2408
- closeEditor();
2409
- }
2410
- return /* @__PURE__ */ jsx(EditCell, {
2411
- column,
2412
- colSpan,
2413
- row: row2,
2414
- onRowChange,
2415
- closeEditor
2416
- }, column.key);
2417
- }
2418
- function getRowViewportColumns(rowIdx) {
2419
- const selectedColumn = columns[selectedPosition.idx];
2420
- if (selectedColumn !== void 0 && selectedPosition.rowIdx === rowIdx && !viewportColumns.includes(selectedColumn)) {
2421
- return selectedPosition.idx > colOverscanEndIdx ? [...viewportColumns, selectedColumn] : [...viewportColumns.slice(0, lastFrozenColumnIndex + 1), selectedColumn, ...viewportColumns.slice(lastFrozenColumnIndex + 1)];
2422
- }
2423
- return viewportColumns;
2424
- }
2425
- function getViewportRows() {
2426
- const rowElements = [];
2427
- let startRowIndex = 0;
2428
- const {
2429
- idx: selectedIdx,
2430
- rowIdx: selectedRowIdx
2431
- } = selectedPosition;
2432
- const startRowIdx = selectedCellIsWithinViewportBounds && selectedRowIdx < rowOverscanStartIdx ? rowOverscanStartIdx - 1 : rowOverscanStartIdx;
2433
- const endRowIdx = selectedCellIsWithinViewportBounds && selectedRowIdx > rowOverscanEndIdx ? rowOverscanEndIdx + 1 : rowOverscanEndIdx;
2434
- for (let viewportRowIdx = startRowIdx; viewportRowIdx <= endRowIdx; viewportRowIdx++) {
2435
- const isRowOutsideViewport = viewportRowIdx === rowOverscanStartIdx - 1 || viewportRowIdx === rowOverscanEndIdx + 1;
2436
- const rowIdx = isRowOutsideViewport ? selectedRowIdx : viewportRowIdx;
2437
- let rowColumns = viewportColumns;
2438
- const selectedColumn = columns[selectedIdx];
2439
- if (selectedColumn !== void 0) {
2440
- if (isRowOutsideViewport) {
2441
- rowColumns = [selectedColumn];
2442
- } else {
2443
- rowColumns = getRowViewportColumns(rowIdx);
2444
- }
2445
- }
2446
- const row2 = rows[rowIdx];
2447
- const gridRowStart = headerRowsCount + rowIdx + 1;
2448
- if (isGroupRow(row2)) {
2449
- ({
2450
- startRowIndex
2451
- } = row2);
2452
- const isGroupRowSelected = isSelectable && row2.childRows.every((cr) => selectedRows.has(rowKeyGetter(cr)));
2453
- rowElements.push(/* @__PURE__ */ jsx(GroupRowRenderer, {
2454
- "aria-level": row2.level + 1,
2455
- "aria-setsize": row2.setSize,
2456
- "aria-posinset": row2.posInSet + 1,
2457
- "aria-rowindex": headerRowsCount + startRowIndex + 1,
2458
- "aria-selected": isSelectable ? isGroupRowSelected : void 0,
2459
- id: row2.id,
2460
- groupKey: row2.groupKey,
2461
- viewportColumns: rowColumns,
2462
- childRows: row2.childRows,
2463
- rowIdx,
2464
- row: row2,
2465
- gridRowStart,
2466
- height: getRowHeight(rowIdx),
2467
- level: row2.level,
2468
- isExpanded: row2.isExpanded,
2469
- selectedCellIdx: selectedRowIdx === rowIdx ? selectedIdx : void 0,
2470
- isRowSelected: isGroupRowSelected,
2471
- selectGroup: selectGroupLatest,
2472
- toggleGroup: toggleGroupLatest
2473
- }, row2.id));
2474
- continue;
2475
- }
2476
- startRowIndex++;
2477
- let key;
2478
- let isRowSelected = false;
2479
- if (typeof rowKeyGetter === "function") {
2480
- key = rowKeyGetter(row2);
2481
- isRowSelected = selectedRows?.has(key) ?? false;
2482
- } else {
2483
- key = hasGroups ? startRowIndex : rowIdx;
2484
- }
2485
- rowElements.push(/* @__PURE__ */ jsx(RowRenderer, {
2486
- "aria-rowindex": headerRowsCount + (hasGroups ? startRowIndex : rowIdx) + 1,
2487
- "aria-selected": isSelectable ? isRowSelected : void 0,
2488
- rowIdx,
2489
- row: row2,
2490
- viewportColumns: rowColumns,
2491
- isRowSelected,
2492
- onRowClick,
2493
- onRowDoubleClick,
2494
- rowClass,
2495
- gridRowStart,
2496
- height: getRowHeight(rowIdx),
2497
- copiedCellIdx: copiedCell !== null && copiedCell.row === row2 ? columns.findIndex((c) => c.key === copiedCell.columnKey) : void 0,
2498
- selectedCellIdx: selectedRowIdx === rowIdx ? selectedIdx : void 0,
2499
- draggedOverCellIdx: getDraggedOverCellIdx(rowIdx),
2500
- setDraggedOverRowIdx: isDragging ? setDraggedOverRowIdx : void 0,
2501
- lastFrozenColumnIndex,
2502
- onRowChange: handleFormatterRowChangeLatest,
2503
- selectCell: selectViewportCellLatest,
2504
- selectedCellDragHandle: getDragHandle(rowIdx),
2505
- selectedCellEditor: getCellEditor(rowIdx)
2506
- }, key));
2507
- }
2508
- return rowElements;
2509
- }
2510
- if (selectedPosition.idx > maxColIdx || selectedPosition.rowIdx > maxRowIdx) {
2511
- setSelectedPosition(initialPosition);
2512
- setDraggedOverRowIdx(void 0);
2513
- }
2514
- let templateRows = `${headerRowHeight}px`;
2515
- if (rows.length > 0) {
2516
- templateRows += gridTemplateRows;
2517
- }
2518
- if (summaryRowsCount > 0) {
2519
- templateRows += ` repeat(${summaryRowsCount}, ${summaryRowHeight}px)`;
2520
- }
2521
- const isGroupRowFocused = selectedPosition.idx === -1 && selectedPosition.rowIdx !== -2;
2522
- return /* @__PURE__ */ jsxs("div", {
2523
- role: hasGroups ? "treegrid" : "grid",
2524
- "aria-label": ariaLabel,
2525
- "aria-labelledby": ariaLabelledBy,
2526
- "aria-describedby": ariaDescribedBy,
2527
- "aria-multiselectable": isSelectable ? true : void 0,
2528
- "aria-colcount": columns.length,
2529
- "aria-rowcount": headerRowsCount + rowsCount + summaryRowsCount,
2530
- className: clsx(rootClassname, className, isDragging && viewportDraggingClassname, autoResizeColumn !== null && cellAutoResizeClassname),
2531
- style: {
2532
- ...style,
2533
- scrollPaddingInlineStart: selectedPosition.idx > lastFrozenColumnIndex ? `${totalFrozenColumnWidth}px` : void 0,
2534
- scrollPaddingBlock: selectedPosition.rowIdx >= 0 && selectedPosition.rowIdx < rows.length ? `${headerRowHeight}px ${summaryRowsCount * summaryRowHeight}px` : void 0,
2535
- gridTemplateRows: templateRows,
2536
- "--rdg-header-row-height": `${headerRowHeight}px`,
2537
- "--rdg-summary-row-height": `${summaryRowHeight}px`,
2538
- "--rdg-sign": isRtl ? -1 : 1,
2539
- ...getLayoutCssVars()
2540
- },
2541
- dir: direction,
2542
- ref: gridRef,
2543
- onScroll: handleScroll,
2544
- onKeyDown: handleKeyDown,
2545
- "data-testid": testId,
2546
- children: [hasGroups && /* @__PURE__ */ jsx("div", {
2547
- ref: rowRef,
2548
- tabIndex: isGroupRowFocused ? 0 : -1,
2549
- className: clsx(focusSinkClassname, isGroupRowFocused && [rowSelected, lastFrozenColumnIndex !== -1 && rowSelectedWithFrozenCell]),
2550
- style: {
2551
- gridRowStart: selectedPosition.rowIdx + 2
2552
- },
2553
- onKeyDown: handleKeyDown
2554
- }), /* @__PURE__ */ jsxs(DataGridDefaultComponentsProvider, {
2555
- value: defaultGridComponents,
2556
- children: [/* @__PURE__ */ jsx(HeaderRow$1, {
2557
- columns: getRowViewportColumns(-1),
2558
- onColumnResize: handleColumnResize,
2559
- allRowsSelected,
2560
- onAllRowsSelectionChange: selectAllRowsLatest,
2561
- sortColumns,
2562
- onSortColumnsChange,
2563
- lastFrozenColumnIndex,
2564
- selectedCellIdx: isHeaderRowSelected ? selectedPosition.idx : void 0,
2565
- selectCell: selectHeaderCellLatest,
2566
- shouldFocusGrid: !selectedCellIsWithinSelectionBounds,
2567
- direction
2568
- }), rows.length === 0 && noRowsFallback ? noRowsFallback : /* @__PURE__ */ jsxs(Fragment, {
2569
- children: [/* @__PURE__ */ jsx(RowSelectionChangeProvider, {
2570
- value: selectRowLatest,
2571
- children: getViewportRows()
2572
- }), summaryRows?.map((row2, rowIdx) => {
2573
- const gridRowStart = headerRowsCount + rows.length + rowIdx + 1;
2574
- const summaryRowIdx = headerRowsCount + rows.length + rowIdx - 1;
2575
- const isSummaryRowSelected = selectedPosition.rowIdx === summaryRowIdx;
2576
- const top = clientHeight > totalRowHeight ? gridHeight - summaryRowHeight * (summaryRows.length - rowIdx) : void 0;
2577
- const bottom = top === void 0 ? summaryRowHeight * (summaryRows.length - 1 - rowIdx) : void 0;
2578
- return /* @__PURE__ */ jsx(SummaryRow$1, {
2579
- "aria-rowindex": headerRowsCount + rowsCount + rowIdx + 1,
2580
- rowIdx,
2581
- gridRowStart,
2582
- row: row2,
2583
- top,
2584
- bottom,
2585
- viewportColumns: getRowViewportColumns(summaryRowIdx),
2586
- lastFrozenColumnIndex,
2587
- selectedCellIdx: isSummaryRowSelected ? selectedPosition.idx : void 0,
2588
- selectCell: selectSummaryCellLatest
2589
- }, rowIdx);
2590
- })]
2591
- })]
2592
- })]
2593
- });
2594
- }
2595
- function isSamePosition(p1, p2) {
2596
- return p1.idx === p2.idx && p1.rowIdx === p2.rowIdx;
2597
- }
2598
- const DataGrid$1 = /* @__PURE__ */ forwardRef(DataGrid);
2599
- var css_248z = ".t16y9g8l700-beta13{appearance:none;background-color:var(--rdg-background-color);block-size:100%;border:2px solid #ccc;box-sizing:border-box;color:var(--rdg-color);font-family:inherit;font-size:var(--rdg-font-size);inline-size:100%;padding-block:0;padding-inline:6px;vertical-align:top}.t16y9g8l700-beta13:focus{border-color:var(--rdg-selection-color);outline:none}.t16y9g8l700-beta13::placeholder{color:#999;opacity:1}";
2600
- styleInject(css_248z, { "insertAt": "top" });
2601
- export {
2602
- DataGrid$1 as D,
2603
- HeaderRenderer as H,
2604
- SelectCellFormatter as S,
2605
- useRowSelection as u
2606
- };