@glideappsfinal/glide-data-grid 6.0.9 → 6.0.11

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 (173) hide show
  1. package/build.sh +3 -1
  2. package/dist/cjs/data-editor/data-editor.js +40 -7
  3. package/dist/cjs/data-editor/data-editor.js.map +1 -1
  4. package/dist/cjs/internal/data-editor-container/data-grid-container.css +1 -0
  5. package/dist/cjs/internal/data-editor-container/data-grid-container.js +25 -30
  6. package/dist/cjs/internal/data-grid/data-grid.js +7 -8
  7. package/dist/cjs/internal/data-grid/data-grid.js.map +1 -1
  8. package/dist/cjs/internal/data-grid/render/data-grid-lib.js +25 -7
  9. package/dist/cjs/internal/data-grid/render/data-grid-lib.js.map +1 -1
  10. package/dist/cjs/internal/data-grid/render/data-grid-render.header.js +32 -7
  11. package/dist/cjs/internal/data-grid/render/data-grid-render.header.js.map +1 -1
  12. package/dist/cjs/internal/data-grid/render/data-grid-render.js +14 -6
  13. package/dist/cjs/internal/data-grid/render/data-grid-render.js.map +1 -1
  14. package/dist/cjs/internal/data-grid-overlay-editor/data-grid-overlay-editor-style.css +1 -0
  15. package/dist/cjs/internal/data-grid-overlay-editor/data-grid-overlay-editor-style.js +19 -75
  16. package/dist/cjs/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.css +1 -0
  17. package/dist/cjs/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.js +5 -32
  18. package/dist/cjs/internal/data-grid-overlay-editor/private/drilldown-overlay-editor.css +1 -0
  19. package/dist/cjs/internal/data-grid-overlay-editor/private/drilldown-overlay-editor.js +15 -45
  20. package/dist/cjs/internal/data-grid-overlay-editor/private/image-overlay-editor-style.css +1 -0
  21. package/dist/cjs/internal/data-grid-overlay-editor/private/image-overlay-editor-style.js +5 -54
  22. package/dist/cjs/internal/data-grid-overlay-editor/private/markdown-overlay-editor-style.css +1 -0
  23. package/dist/cjs/internal/data-grid-overlay-editor/private/markdown-overlay-editor-style.js +9 -74
  24. package/dist/cjs/internal/data-grid-overlay-editor/private/number-overlay-editor-style.css +1 -0
  25. package/dist/cjs/internal/data-grid-overlay-editor/private/number-overlay-editor-style.js +5 -13
  26. package/dist/cjs/internal/data-grid-overlay-editor/private/uri-overlay-editor-style.css +1 -0
  27. package/dist/cjs/internal/data-grid-overlay-editor/private/uri-overlay-editor-style.js +5 -51
  28. package/dist/cjs/internal/data-grid-search/data-grid-search-style.css +1 -0
  29. package/dist/cjs/internal/data-grid-search/data-grid-search-style.js +5 -94
  30. package/dist/cjs/internal/growing-entry/growing-entry-style.css +3 -0
  31. package/dist/cjs/internal/growing-entry/growing-entry-style.js +15 -58
  32. package/dist/cjs/internal/markdown-div/private/markdown-container.css +1 -0
  33. package/dist/cjs/internal/markdown-div/private/markdown-container.js +5 -17
  34. package/dist/cjs/internal/scrolling-data-grid/infinite-scroller.css +1 -0
  35. package/dist/cjs/internal/scrolling-data-grid/infinite-scroller.js +233 -231
  36. package/dist/dts/cells/boolean-cell.d.ts +0 -1
  37. package/dist/dts/cells/bubble-cell.d.ts +0 -1
  38. package/dist/dts/cells/cell-types.d.ts +0 -1
  39. package/dist/dts/cells/drilldown-cell.d.ts +0 -1
  40. package/dist/dts/cells/image-cell.d.ts +0 -1
  41. package/dist/dts/cells/index.d.ts +0 -1
  42. package/dist/dts/cells/loading-cell.d.ts +0 -1
  43. package/dist/dts/cells/markdown-cell.d.ts +0 -1
  44. package/dist/dts/cells/marker-cell.d.ts +0 -1
  45. package/dist/dts/cells/new-row-cell.d.ts +0 -1
  46. package/dist/dts/cells/number-cell.d.ts +0 -1
  47. package/dist/dts/cells/protected-cell.d.ts +0 -1
  48. package/dist/dts/cells/row-id-cell.d.ts +0 -1
  49. package/dist/dts/cells/text-cell.d.ts +0 -1
  50. package/dist/dts/cells/uri-cell.d.ts +0 -1
  51. package/dist/dts/common/browser-detect.d.ts +0 -1
  52. package/dist/dts/common/image-window-loader.d.ts +0 -1
  53. package/dist/dts/common/is-hotkey.d.ts +0 -1
  54. package/dist/dts/common/math.d.ts +0 -1
  55. package/dist/dts/common/render-state-provider.d.ts +0 -1
  56. package/dist/dts/common/resize-detector.d.ts +0 -1
  57. package/dist/dts/common/styles.d.ts +0 -1
  58. package/dist/dts/common/support.d.ts +0 -1
  59. package/dist/dts/common/utils.d.ts +0 -1
  60. package/dist/dts/data-editor/copy-paste.d.ts +0 -1
  61. package/dist/dts/data-editor/data-editor-fns.d.ts +0 -1
  62. package/dist/dts/data-editor/data-editor-keybindings.d.ts +0 -1
  63. package/dist/dts/data-editor/data-editor.d.ts +0 -1
  64. package/dist/dts/data-editor/data-editor.d.ts.map +1 -1
  65. package/dist/dts/data-editor/group-rename.d.ts +0 -1
  66. package/dist/dts/data-editor/row-grouping-api.d.ts +0 -1
  67. package/dist/dts/data-editor/row-grouping.d.ts +0 -1
  68. package/dist/dts/data-editor/use-autoscroll.d.ts +0 -1
  69. package/dist/dts/data-editor/use-cells-for-selection.d.ts +0 -1
  70. package/dist/dts/data-editor/use-column-sizer.d.ts +0 -1
  71. package/dist/dts/data-editor/use-initial-scroll-offset.d.ts +0 -1
  72. package/dist/dts/data-editor/use-rem-adjuster.d.ts +0 -1
  73. package/dist/dts/data-editor/visible-region.d.ts +0 -1
  74. package/dist/dts/data-editor-all.d.ts +0 -1
  75. package/dist/dts/index.d.ts +0 -1
  76. package/dist/dts/internal/click-outside-container/click-outside-container.d.ts +0 -1
  77. package/dist/dts/internal/data-editor-container/data-grid-container.d.ts +0 -1
  78. package/dist/dts/internal/data-grid/animation-manager.d.ts +0 -1
  79. package/dist/dts/internal/data-grid/cell-set.d.ts +0 -1
  80. package/dist/dts/internal/data-grid/color-parser.d.ts +0 -1
  81. package/dist/dts/internal/data-grid/data-grid-sprites.d.ts +0 -1
  82. package/dist/dts/internal/data-grid/data-grid-types.d.ts +0 -1
  83. package/dist/dts/internal/data-grid/data-grid.d.ts +0 -1
  84. package/dist/dts/internal/data-grid/data-grid.d.ts.map +1 -1
  85. package/dist/dts/internal/data-grid/event-args.d.ts +1 -2
  86. package/dist/dts/internal/data-grid/event-args.d.ts.map +1 -1
  87. package/dist/dts/internal/data-grid/image-window-loader-interface.d.ts +0 -1
  88. package/dist/dts/internal/data-grid/render/data-grid-lib.d.ts +1 -2
  89. package/dist/dts/internal/data-grid/render/data-grid-lib.d.ts.map +1 -1
  90. package/dist/dts/internal/data-grid/render/data-grid-render.blit.d.ts +0 -1
  91. package/dist/dts/internal/data-grid/render/data-grid-render.cells.d.ts +0 -1
  92. package/dist/dts/internal/data-grid/render/data-grid-render.d.ts +0 -1
  93. package/dist/dts/internal/data-grid/render/data-grid-render.d.ts.map +1 -1
  94. package/dist/dts/internal/data-grid/render/data-grid-render.header.d.ts +0 -1
  95. package/dist/dts/internal/data-grid/render/data-grid-render.header.d.ts.map +1 -1
  96. package/dist/dts/internal/data-grid/render/data-grid-render.lines.d.ts +0 -1
  97. package/dist/dts/internal/data-grid/render/data-grid-render.walk.d.ts +0 -1
  98. package/dist/dts/internal/data-grid/render/data-grid.render.rings.d.ts +0 -1
  99. package/dist/dts/internal/data-grid/render/draw-checkbox.d.ts +0 -1
  100. package/dist/dts/internal/data-grid/render/draw-edit-hover-indicator.d.ts +0 -1
  101. package/dist/dts/internal/data-grid/render/draw-grid-arg.d.ts +0 -1
  102. package/dist/dts/internal/data-grid/sprites.d.ts +0 -1
  103. package/dist/dts/internal/data-grid/use-animation-queue.d.ts +0 -1
  104. package/dist/dts/internal/data-grid/use-selection-behavior.d.ts +0 -1
  105. package/dist/dts/internal/data-grid-dnd/data-grid-dnd.d.ts +0 -1
  106. package/dist/dts/internal/data-grid-overlay-editor/data-grid-overlay-editor-style.d.ts +0 -1
  107. package/dist/dts/internal/data-grid-overlay-editor/data-grid-overlay-editor.d.ts +0 -1
  108. package/dist/dts/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.d.ts +0 -1
  109. package/dist/dts/internal/data-grid-overlay-editor/private/bubbles-overlay-editor.d.ts +0 -1
  110. package/dist/dts/internal/data-grid-overlay-editor/private/drilldown-overlay-editor.d.ts +0 -1
  111. package/dist/dts/internal/data-grid-overlay-editor/private/image-overlay-editor-style.d.ts +0 -1
  112. package/dist/dts/internal/data-grid-overlay-editor/private/image-overlay-editor.d.ts +0 -1
  113. package/dist/dts/internal/data-grid-overlay-editor/private/markdown-overlay-editor-style.d.ts +0 -1
  114. package/dist/dts/internal/data-grid-overlay-editor/private/markdown-overlay-editor.d.ts +0 -1
  115. package/dist/dts/internal/data-grid-overlay-editor/private/number-overlay-editor-style.d.ts +0 -1
  116. package/dist/dts/internal/data-grid-overlay-editor/private/number-overlay-editor.d.ts +0 -1
  117. package/dist/dts/internal/data-grid-overlay-editor/private/uri-overlay-editor-style.d.ts +0 -1
  118. package/dist/dts/internal/data-grid-overlay-editor/private/uri-overlay-editor.d.ts +0 -1
  119. package/dist/dts/internal/data-grid-overlay-editor/use-stay-on-screen.d.ts +0 -1
  120. package/dist/dts/internal/data-grid-search/data-grid-search-style.d.ts +0 -1
  121. package/dist/dts/internal/data-grid-search/data-grid-search.d.ts +0 -1
  122. package/dist/dts/internal/growing-entry/growing-entry-style.d.ts +0 -1
  123. package/dist/dts/internal/growing-entry/growing-entry.d.ts +0 -1
  124. package/dist/dts/internal/markdown-div/markdown-div.d.ts +0 -1
  125. package/dist/dts/internal/markdown-div/private/markdown-container.d.ts +0 -1
  126. package/dist/dts/internal/scrolling-data-grid/infinite-scroller.d.ts +0 -1
  127. package/dist/dts/internal/scrolling-data-grid/scrolling-data-grid.d.ts +0 -1
  128. package/dist/dts/internal/scrolling-data-grid/use-kinetic-scroll.d.ts +0 -1
  129. package/dist/esm/data-editor/data-editor.js +40 -7
  130. package/dist/esm/data-editor/data-editor.js.map +1 -1
  131. package/dist/esm/internal/data-editor-container/data-grid-container.css +1 -0
  132. package/dist/esm/internal/data-editor-container/data-grid-container.js +25 -30
  133. package/dist/esm/internal/data-grid/data-grid.js +7 -8
  134. package/dist/esm/internal/data-grid/data-grid.js.map +1 -1
  135. package/dist/esm/internal/data-grid/render/data-grid-lib.js +25 -7
  136. package/dist/esm/internal/data-grid/render/data-grid-lib.js.map +1 -1
  137. package/dist/esm/internal/data-grid/render/data-grid-render.header.js +32 -7
  138. package/dist/esm/internal/data-grid/render/data-grid-render.header.js.map +1 -1
  139. package/dist/esm/internal/data-grid/render/data-grid-render.js +14 -6
  140. package/dist/esm/internal/data-grid/render/data-grid-render.js.map +1 -1
  141. package/dist/esm/internal/data-grid-overlay-editor/data-grid-overlay-editor-style.css +1 -0
  142. package/dist/esm/internal/data-grid-overlay-editor/data-grid-overlay-editor-style.js +19 -75
  143. package/dist/esm/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.css +1 -0
  144. package/dist/esm/internal/data-grid-overlay-editor/private/bubbles-overlay-editor-style.js +5 -32
  145. package/dist/esm/internal/data-grid-overlay-editor/private/drilldown-overlay-editor.css +1 -0
  146. package/dist/esm/internal/data-grid-overlay-editor/private/drilldown-overlay-editor.js +15 -45
  147. package/dist/esm/internal/data-grid-overlay-editor/private/image-overlay-editor-style.css +1 -0
  148. package/dist/esm/internal/data-grid-overlay-editor/private/image-overlay-editor-style.js +5 -54
  149. package/dist/esm/internal/data-grid-overlay-editor/private/markdown-overlay-editor-style.css +1 -0
  150. package/dist/esm/internal/data-grid-overlay-editor/private/markdown-overlay-editor-style.js +9 -74
  151. package/dist/esm/internal/data-grid-overlay-editor/private/number-overlay-editor-style.css +1 -0
  152. package/dist/esm/internal/data-grid-overlay-editor/private/number-overlay-editor-style.js +5 -13
  153. package/dist/esm/internal/data-grid-overlay-editor/private/uri-overlay-editor-style.css +1 -0
  154. package/dist/esm/internal/data-grid-overlay-editor/private/uri-overlay-editor-style.js +5 -51
  155. package/dist/esm/internal/data-grid-search/data-grid-search-style.css +1 -0
  156. package/dist/esm/internal/data-grid-search/data-grid-search-style.js +5 -94
  157. package/dist/esm/internal/growing-entry/growing-entry-style.css +3 -0
  158. package/dist/esm/internal/growing-entry/growing-entry-style.js +15 -58
  159. package/dist/esm/internal/markdown-div/private/markdown-container.css +1 -0
  160. package/dist/esm/internal/markdown-div/private/markdown-container.js +5 -17
  161. package/dist/esm/internal/scrolling-data-grid/infinite-scroller.css +1 -0
  162. package/dist/esm/internal/scrolling-data-grid/infinite-scroller.js +233 -231
  163. package/dist/index.css +12 -0
  164. package/package.json +1 -1
  165. package/src/data-editor/data-editor.tsx +50 -7
  166. package/src/docs/examples/custom-group-header.stories.tsx +41 -11
  167. package/src/internal/data-grid/data-grid.tsx +8 -9
  168. package/src/internal/data-grid/event-args.ts +1 -1
  169. package/src/internal/data-grid/render/data-grid-lib.ts +24 -6
  170. package/src/internal/data-grid/render/data-grid-render.header.ts +34 -5
  171. package/src/internal/data-grid/render/data-grid-render.ts +13 -6
  172. package/test/data-editor.test.tsx +21 -13
  173. package/test/data-grid.test.tsx +14 -2
@@ -4,48 +4,15 @@ import { useResizeDetector } from "../../common/resize-detector.js";
4
4
  import { browserIsSafari } from "../../common/browser-detect.js";
5
5
  import { useEventListener } from "../../common/utils.js";
6
6
  import useKineticScroll from "./use-kinetic-scroll.js";
7
- const ScrollRegionStyle = styled.div `
8
- .dvn-scroller {
9
- overflow: ${p => (p.isSafari ? "scroll" : "auto")};
10
- transform: translate3d(0, 0, 0);
11
- }
12
-
13
- .dvn-hidden {
14
- visibility: hidden;
15
- }
16
-
17
- .dvn-scroll-inner {
18
- display: flex;
19
- pointer-events: none;
20
-
21
- > * {
22
- flex-shrink: 0;
23
- }
24
-
25
- .dvn-spacer {
26
- flex-grow: 1;
27
- }
28
-
29
- .dvn-stack {
30
- display: flex;
31
- flex-direction: column;
32
- }
33
- }
34
-
35
- .dvn-underlay > * {
36
- position: absolute;
37
- left: 0;
38
- top: 0;
39
- }
40
-
41
- canvas {
42
- outline: none;
43
-
44
- * {
45
- height: 0;
46
- }
47
- }
48
- `;
7
+ const _exp = /*#__PURE__*/() => p => p.isSafari ? "scroll" : "auto";
8
+ const ScrollRegionStyle = /*#__PURE__*/styled('div')({
9
+ name: "ScrollRegionStyle",
10
+ class: "gdg-s1dgczr6",
11
+ propsAsIs: false,
12
+ vars: {
13
+ "s1dgczr6-0": [_exp()]
14
+ }
15
+ });
49
16
  // Browser's maximum div height limit. Varies a bit by browsers.
50
17
  const BROWSER_MAX_DIV_HEIGHT = 33_554_400;
51
18
  // Maximum height of a single padder segment to avoid browser performance issues.
@@ -57,19 +24,19 @@ const BROWSER_MAX_DIV_HEIGHT = 33_554_400;
57
24
  // based on the current scroll position.
58
25
  const MAX_PADDER_SEGMENT_HEIGHT = 5_000_000;
59
26
  function useTouchUpDelayed(delay) {
60
- const [hasTouches, setHasTouches] = React.useState(false);
61
- const safeWindow = typeof window === "undefined" ? null : window;
62
- const cbTimer = React.useRef(0);
63
- useEventListener("touchstart", React.useCallback(() => {
64
- window.clearTimeout(cbTimer.current);
65
- setHasTouches(true);
66
- }, []), safeWindow, true, false);
67
- useEventListener("touchend", React.useCallback(e => {
68
- if (e.touches.length === 0) {
69
- cbTimer.current = window.setTimeout(() => setHasTouches(false), delay);
70
- }
71
- }, [delay]), safeWindow, true, false);
72
- return hasTouches;
27
+ const [hasTouches, setHasTouches] = React.useState(false);
28
+ const safeWindow = typeof window === "undefined" ? null : window;
29
+ const cbTimer = React.useRef(0);
30
+ useEventListener("touchstart", React.useCallback(() => {
31
+ window.clearTimeout(cbTimer.current);
32
+ setHasTouches(true);
33
+ }, []), safeWindow, true, false);
34
+ useEventListener("touchend", React.useCallback(e => {
35
+ if (e.touches.length === 0) {
36
+ cbTimer.current = window.setTimeout(() => setHasTouches(false), delay);
37
+ }
38
+ }, [delay]), safeWindow, true, false);
39
+ return hasTouches;
73
40
  }
74
41
  /**
75
42
  * InfiniteScroller provides virtual scrolling capabilities for the data grid.
@@ -83,183 +50,218 @@ function useTouchUpDelayed(delay) {
83
50
  * to the full virtual scroll range
84
51
  */
85
52
  export const InfiniteScroller = p => {
86
- const { children, clientHeight, scrollHeight, scrollWidth, update, draggable, className, preventDiagonalScrolling = false, paddingBottom = 0, paddingRight = 0, rightElement, rightElementProps, kineticScrollPerfHack = false, scrollRef, initialSize, } = p;
87
- const padders = [];
88
- const rightElementSticky = rightElementProps?.sticky ?? false;
89
- const rightElementFill = rightElementProps?.fill ?? false;
90
- // Track the virtual scroll position directly for smooth scrolling
91
- const virtualScrollY = React.useRef(0);
92
- const lastScrollY = React.useRef(0);
93
- const scroller = React.useRef(null);
94
- const dpr = typeof window === "undefined" ? 1 : window.devicePixelRatio;
95
- const lastDpr = React.useRef(dpr);
96
- // Reset scroll tracking when device pixel ratio changes (e.g., browser zoom)
97
- React.useEffect(() => {
98
- if (lastDpr.current !== dpr) {
99
- virtualScrollY.current = 0;
100
- lastScrollY.current = 0;
101
- lastDpr.current = dpr;
102
- const el = scroller.current;
103
- if (el !== null) {
104
- onScrollRef.current(el.scrollLeft, el.scrollTop);
105
- }
106
- }
107
- }, [dpr]);
108
- const lastScrollPosition = React.useRef({
109
- scrollLeft: 0,
110
- scrollTop: 0,
111
- lockDirection: undefined,
53
+ const {
54
+ children,
55
+ clientHeight,
56
+ scrollHeight,
57
+ scrollWidth,
58
+ update,
59
+ draggable,
60
+ className,
61
+ preventDiagonalScrolling = false,
62
+ paddingBottom = 0,
63
+ paddingRight = 0,
64
+ rightElement,
65
+ rightElementProps,
66
+ kineticScrollPerfHack = false,
67
+ scrollRef,
68
+ initialSize
69
+ } = p;
70
+ const padders = [];
71
+ const rightElementSticky = rightElementProps?.sticky ?? false;
72
+ const rightElementFill = rightElementProps?.fill ?? false;
73
+ // Track the virtual scroll position directly for smooth scrolling
74
+ const virtualScrollY = React.useRef(0);
75
+ const lastScrollY = React.useRef(0);
76
+ const scroller = React.useRef(null);
77
+ const dpr = typeof window === "undefined" ? 1 : window.devicePixelRatio;
78
+ const lastDpr = React.useRef(dpr);
79
+ // Reset scroll tracking when device pixel ratio changes (e.g., browser zoom)
80
+ React.useEffect(() => {
81
+ if (lastDpr.current !== dpr) {
82
+ virtualScrollY.current = 0;
83
+ lastScrollY.current = 0;
84
+ lastDpr.current = dpr;
85
+ const el = scroller.current;
86
+ if (el !== null) {
87
+ onScrollRef.current(el.scrollLeft, el.scrollTop);
88
+ }
89
+ }
90
+ }, [dpr]);
91
+ const lastScrollPosition = React.useRef({
92
+ scrollLeft: 0,
93
+ scrollTop: 0,
94
+ lockDirection: undefined
95
+ });
96
+ const rightWrapRef = React.useRef(null);
97
+ const hasTouches = useTouchUpDelayed(200);
98
+ const [isIdle, setIsIdle] = React.useState(true);
99
+ const idleTimer = React.useRef(0);
100
+ React.useLayoutEffect(() => {
101
+ if (!isIdle || hasTouches || lastScrollPosition.current.lockDirection === undefined) return;
102
+ const el = scroller.current;
103
+ if (el === null) return;
104
+ const [lx, ly] = lastScrollPosition.current.lockDirection;
105
+ if (lx !== undefined) {
106
+ el.scrollLeft = lx;
107
+ } else if (ly !== undefined) {
108
+ el.scrollTop = ly;
109
+ }
110
+ lastScrollPosition.current.lockDirection = undefined;
111
+ }, [hasTouches, isIdle]);
112
+ const onScroll = React.useCallback((scrollLeft, scrollTop) => {
113
+ const el = scroller.current;
114
+ if (el === null) return;
115
+ scrollTop = scrollTop ?? el.scrollTop;
116
+ scrollLeft = scrollLeft ?? el.scrollLeft;
117
+ const lastScrollTop = lastScrollPosition.current.scrollTop;
118
+ const lastScrollLeft = lastScrollPosition.current.scrollLeft;
119
+ const dx = scrollLeft - lastScrollLeft;
120
+ const dy = scrollTop - lastScrollTop;
121
+ if (hasTouches && dx !== 0 && dy !== 0 && (Math.abs(dx) > 3 || Math.abs(dy) > 3) && preventDiagonalScrolling && lastScrollPosition.current.lockDirection === undefined) {
122
+ lastScrollPosition.current.lockDirection = Math.abs(dx) < Math.abs(dy) ? [lastScrollLeft, undefined] : [undefined, lastScrollTop];
123
+ }
124
+ const lock = lastScrollPosition.current.lockDirection;
125
+ scrollLeft = lock?.[0] ?? scrollLeft;
126
+ scrollTop = lock?.[1] ?? scrollTop;
127
+ lastScrollPosition.current.scrollLeft = scrollLeft;
128
+ lastScrollPosition.current.scrollTop = scrollTop;
129
+ const cWidth = el.clientWidth;
130
+ const cHeight = el.clientHeight;
131
+ const newY = scrollTop;
132
+ const delta = lastScrollY.current - newY;
133
+ const scrollableHeight = el.scrollHeight - cHeight;
134
+ lastScrollY.current = newY;
135
+ // Calculate the virtual Y position
136
+ let virtualY;
137
+ // When content height exceeds browser limits, use hybrid approach
138
+ if (scrollableHeight > 0 && scrollHeight > el.scrollHeight + 5) {
139
+ // For large jumps (scrollbar interaction) or edge positions,
140
+ // recalculate position based on percentage
141
+ if (Math.abs(delta) > 2000 || newY === 0 || newY === scrollableHeight) {
142
+ const scrollProgress = Math.max(0, Math.min(1, newY / scrollableHeight));
143
+ const virtualScrollableHeight = scrollHeight - cHeight;
144
+ virtualY = scrollProgress * virtualScrollableHeight;
145
+ // Update our tracked position for subsequent smooth scrolling
146
+ virtualScrollY.current = virtualY;
147
+ } else {
148
+ // For smooth scrolling, apply the delta directly to virtual position
149
+ // This preserves 1:1 pixel movement for smooth scrolling
150
+ virtualScrollY.current -= delta;
151
+ virtualY = virtualScrollY.current;
152
+ }
153
+ } else {
154
+ // Direct mapping when within browser limits
155
+ virtualY = newY;
156
+ virtualScrollY.current = virtualY;
157
+ }
158
+ // Ensure virtual Y is within valid bounds
159
+ virtualY = Math.max(0, Math.min(virtualY, scrollHeight - cHeight));
160
+ virtualScrollY.current = virtualY; // Keep tracked position in bounds too
161
+ if (lock !== undefined) {
162
+ window.clearTimeout(idleTimer.current);
163
+ setIsIdle(false);
164
+ idleTimer.current = window.setTimeout(() => setIsIdle(true), 200);
165
+ }
166
+ update({
167
+ x: scrollLeft,
168
+ y: virtualY,
169
+ width: cWidth - paddingRight,
170
+ height: cHeight - paddingBottom,
171
+ paddingRight: rightWrapRef.current?.clientWidth ?? 0
112
172
  });
113
- const rightWrapRef = React.useRef(null);
114
- const hasTouches = useTouchUpDelayed(200);
115
- const [isIdle, setIsIdle] = React.useState(true);
116
- const idleTimer = React.useRef(0);
117
- React.useLayoutEffect(() => {
118
- if (!isIdle || hasTouches || lastScrollPosition.current.lockDirection === undefined)
119
- return;
120
- const el = scroller.current;
121
- if (el === null)
122
- return;
123
- const [lx, ly] = lastScrollPosition.current.lockDirection;
124
- if (lx !== undefined) {
125
- el.scrollLeft = lx;
126
- }
127
- else if (ly !== undefined) {
128
- el.scrollTop = ly;
129
- }
130
- lastScrollPosition.current.lockDirection = undefined;
131
- }, [hasTouches, isIdle]);
132
- const onScroll = React.useCallback((scrollLeft, scrollTop) => {
133
- const el = scroller.current;
134
- if (el === null)
135
- return;
136
- scrollTop = scrollTop ?? el.scrollTop;
137
- scrollLeft = scrollLeft ?? el.scrollLeft;
138
- const lastScrollTop = lastScrollPosition.current.scrollTop;
139
- const lastScrollLeft = lastScrollPosition.current.scrollLeft;
140
- const dx = scrollLeft - lastScrollLeft;
141
- const dy = scrollTop - lastScrollTop;
142
- if (hasTouches &&
143
- dx !== 0 &&
144
- dy !== 0 &&
145
- (Math.abs(dx) > 3 || Math.abs(dy) > 3) &&
146
- preventDiagonalScrolling &&
147
- lastScrollPosition.current.lockDirection === undefined) {
148
- lastScrollPosition.current.lockDirection =
149
- Math.abs(dx) < Math.abs(dy) ? [lastScrollLeft, undefined] : [undefined, lastScrollTop];
150
- }
151
- const lock = lastScrollPosition.current.lockDirection;
152
- scrollLeft = lock?.[0] ?? scrollLeft;
153
- scrollTop = lock?.[1] ?? scrollTop;
154
- lastScrollPosition.current.scrollLeft = scrollLeft;
155
- lastScrollPosition.current.scrollTop = scrollTop;
156
- const cWidth = el.clientWidth;
157
- const cHeight = el.clientHeight;
158
- const newY = scrollTop;
159
- const delta = lastScrollY.current - newY;
160
- const scrollableHeight = el.scrollHeight - cHeight;
161
- lastScrollY.current = newY;
162
- // Calculate the virtual Y position
163
- let virtualY;
164
- // When content height exceeds browser limits, use hybrid approach
165
- if (scrollableHeight > 0 && scrollHeight > el.scrollHeight + 5) {
166
- // For large jumps (scrollbar interaction) or edge positions,
167
- // recalculate position based on percentage
168
- if (Math.abs(delta) > 2000 || newY === 0 || newY === scrollableHeight) {
169
- const scrollProgress = Math.max(0, Math.min(1, newY / scrollableHeight));
170
- const virtualScrollableHeight = scrollHeight - cHeight;
171
- virtualY = scrollProgress * virtualScrollableHeight;
172
- // Update our tracked position for subsequent smooth scrolling
173
- virtualScrollY.current = virtualY;
174
- }
175
- else {
176
- // For smooth scrolling, apply the delta directly to virtual position
177
- // This preserves 1:1 pixel movement for smooth scrolling
178
- virtualScrollY.current -= delta;
179
- virtualY = virtualScrollY.current;
180
- }
181
- }
182
- else {
183
- // Direct mapping when within browser limits
184
- virtualY = newY;
185
- virtualScrollY.current = virtualY;
186
- }
187
- // Ensure virtual Y is within valid bounds
188
- virtualY = Math.max(0, Math.min(virtualY, scrollHeight - cHeight));
189
- virtualScrollY.current = virtualY; // Keep tracked position in bounds too
190
- if (lock !== undefined) {
191
- window.clearTimeout(idleTimer.current);
192
- setIsIdle(false);
193
- idleTimer.current = window.setTimeout(() => setIsIdle(true), 200);
194
- }
195
- update({
196
- x: scrollLeft,
197
- y: virtualY,
198
- width: cWidth - paddingRight,
199
- height: cHeight - paddingBottom,
200
- paddingRight: rightWrapRef.current?.clientWidth ?? 0,
201
- });
202
- }, [paddingBottom, paddingRight, scrollHeight, update, preventDiagonalScrolling, hasTouches]);
203
- useKineticScroll(kineticScrollPerfHack && browserIsSafari.value, onScroll, scroller);
204
- const onScrollRef = React.useRef(onScroll);
205
- onScrollRef.current = onScroll;
206
- const lastProps = React.useRef(undefined);
207
- const didFirstScroll = React.useRef(false);
208
- // if this is not a layout effect there will be a flicker when changing the number of freezeColumns
209
- // we need to document what this is needed at all.
210
- React.useLayoutEffect(() => {
211
- if (didFirstScroll.current)
212
- onScroll();
213
- else
214
- didFirstScroll.current = true;
215
- }, [onScroll, paddingBottom, paddingRight]);
216
- const setRefs = React.useCallback((instance) => {
217
- scroller.current = instance;
218
- if (scrollRef !== undefined) {
219
- scrollRef.current = instance;
220
- }
221
- }, [scrollRef]);
222
- let key = 0;
223
- let h = 0;
224
- // Ensure we don't create padders that exceed browser limits
225
- const effectiveScrollHeight = Math.min(scrollHeight, BROWSER_MAX_DIV_HEIGHT);
226
- padders.push(React.createElement("div", { key: key++, style: { width: scrollWidth, height: 0 } }));
227
- while (h < effectiveScrollHeight) {
228
- const toAdd = Math.min(MAX_PADDER_SEGMENT_HEIGHT, effectiveScrollHeight - h);
229
- padders.push(React.createElement("div", { key: key++, style: { width: 0, height: toAdd } }));
230
- h += toAdd;
173
+ }, [paddingBottom, paddingRight, scrollHeight, update, preventDiagonalScrolling, hasTouches]);
174
+ useKineticScroll(kineticScrollPerfHack && browserIsSafari.value, onScroll, scroller);
175
+ const onScrollRef = React.useRef(onScroll);
176
+ onScrollRef.current = onScroll;
177
+ const lastProps = React.useRef(undefined);
178
+ const didFirstScroll = React.useRef(false);
179
+ // if this is not a layout effect there will be a flicker when changing the number of freezeColumns
180
+ // we need to document what this is needed at all.
181
+ React.useLayoutEffect(() => {
182
+ if (didFirstScroll.current) onScroll();else didFirstScroll.current = true;
183
+ }, [onScroll, paddingBottom, paddingRight]);
184
+ const setRefs = React.useCallback(instance => {
185
+ scroller.current = instance;
186
+ if (scrollRef !== undefined) {
187
+ scrollRef.current = instance;
231
188
  }
232
- const { ref, width, height } = useResizeDetector(initialSize);
233
- if (typeof window !== "undefined" && (lastProps.current?.height !== height || lastProps.current?.width !== width)) {
234
- window.setTimeout(() => onScrollRef.current(), 0);
235
- lastProps.current = { width, height };
189
+ }, [scrollRef]);
190
+ let key = 0;
191
+ let h = 0;
192
+ // Ensure we don't create padders that exceed browser limits
193
+ const effectiveScrollHeight = Math.min(scrollHeight, BROWSER_MAX_DIV_HEIGHT);
194
+ padders.push(React.createElement("div", {
195
+ key: key++,
196
+ style: {
197
+ width: scrollWidth,
198
+ height: 0
236
199
  }
237
- if ((width ?? 0) === 0 || (height ?? 0) === 0)
238
- return React.createElement("div", { ref: ref });
239
- return (React.createElement("div", { ref: ref },
240
- React.createElement(ScrollRegionStyle, { isSafari: browserIsSafari.value },
241
- React.createElement("div", { className: "dvn-underlay" }, children),
242
- React.createElement("div", { ref: setRefs, style: lastProps.current, draggable: draggable, onDragStart: e => {
243
- if (!draggable) {
244
- e.stopPropagation();
245
- e.preventDefault();
246
- }
247
- }, className: "dvn-scroller " + (className ?? ""), onScroll: () => onScroll() },
248
- React.createElement("div", { className: "dvn-scroll-inner" + (rightElement === undefined ? " dvn-hidden" : "") },
249
- React.createElement("div", { className: "dvn-stack" }, padders),
250
- rightElement !== undefined && (React.createElement(React.Fragment, null,
251
- !rightElementFill && React.createElement("div", { className: "dvn-spacer" }),
252
- React.createElement("div", { ref: rightWrapRef, style: {
253
- height,
254
- maxHeight: clientHeight - Math.ceil(dpr % 1),
255
- position: "sticky",
256
- top: 0,
257
- paddingLeft: 1,
258
- marginBottom: -40,
259
- marginRight: paddingRight,
260
- flexGrow: rightElementFill ? 1 : undefined,
261
- right: rightElementSticky ? (paddingRight ?? 0) : undefined,
262
- pointerEvents: "auto",
263
- } }, rightElement))))))));
200
+ }));
201
+ while (h < effectiveScrollHeight) {
202
+ const toAdd = Math.min(MAX_PADDER_SEGMENT_HEIGHT, effectiveScrollHeight - h);
203
+ padders.push(React.createElement("div", {
204
+ key: key++,
205
+ style: {
206
+ width: 0,
207
+ height: toAdd
208
+ }
209
+ }));
210
+ h += toAdd;
211
+ }
212
+ const {
213
+ ref,
214
+ width,
215
+ height
216
+ } = useResizeDetector(initialSize);
217
+ if (typeof window !== "undefined" && (lastProps.current?.height !== height || lastProps.current?.width !== width)) {
218
+ window.setTimeout(() => onScrollRef.current(), 0);
219
+ lastProps.current = {
220
+ width,
221
+ height
222
+ };
223
+ }
224
+ if ((width ?? 0) === 0 || (height ?? 0) === 0) return React.createElement("div", {
225
+ ref: ref
226
+ });
227
+ return React.createElement("div", {
228
+ ref: ref
229
+ }, React.createElement(ScrollRegionStyle, {
230
+ isSafari: browserIsSafari.value
231
+ }, React.createElement("div", {
232
+ className: "dvn-underlay"
233
+ }, children), React.createElement("div", {
234
+ ref: setRefs,
235
+ style: lastProps.current,
236
+ draggable: draggable,
237
+ onDragStart: e => {
238
+ if (!draggable) {
239
+ e.stopPropagation();
240
+ e.preventDefault();
241
+ }
242
+ },
243
+ className: "dvn-scroller " + (className ?? ""),
244
+ onScroll: () => onScroll()
245
+ }, React.createElement("div", {
246
+ className: "dvn-scroll-inner" + (rightElement === undefined ? " dvn-hidden" : "")
247
+ }, React.createElement("div", {
248
+ className: "dvn-stack"
249
+ }, padders), rightElement !== undefined && React.createElement(React.Fragment, null, !rightElementFill && React.createElement("div", {
250
+ className: "dvn-spacer"
251
+ }), React.createElement("div", {
252
+ ref: rightWrapRef,
253
+ style: {
254
+ height,
255
+ maxHeight: clientHeight - Math.ceil(dpr % 1),
256
+ position: "sticky",
257
+ top: 0,
258
+ paddingLeft: 1,
259
+ marginBottom: -40,
260
+ marginRight: paddingRight,
261
+ flexGrow: rightElementFill ? 1 : undefined,
262
+ right: rightElementSticky ? paddingRight ?? 0 : undefined,
263
+ pointerEvents: "auto"
264
+ }
265
+ }, rightElement))))));
264
266
  };
265
- //# sourceMappingURL=infinite-scroller.js.map
267
+
@@ -1,4 +1,3 @@
1
1
  import { type BooleanCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const booleanCellRenderer: InternalCellRenderer<BooleanCell>;
4
- //# sourceMappingURL=boolean-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type BubbleCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const bubbleCellRenderer: InternalCellRenderer<BubbleCell>;
4
- //# sourceMappingURL=bubble-cell.d.ts.map
@@ -86,4 +86,3 @@ export type CellRenderer<T extends InnerGridCell> = [T] extends [CustomCell<infe
86
86
  /** @category Renderers */
87
87
  export type GetCellRendererCallback = <T extends InnerGridCell>(cell: T) => CellRenderer<T> | undefined;
88
88
  export {};
89
- //# sourceMappingURL=cell-types.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type DrilldownCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const drilldownCellRenderer: InternalCellRenderer<DrilldownCell>;
4
- //# sourceMappingURL=drilldown-cell.d.ts.map
@@ -2,4 +2,3 @@ import { type BaseGridCell, type ImageCell } from "../internal/data-grid/data-gr
2
2
  import type { BaseDrawArgs, InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const imageCellRenderer: InternalCellRenderer<ImageCell>;
4
4
  export declare function drawImage(args: BaseDrawArgs, data: readonly string[], rounding: number, contentAlign?: BaseGridCell["contentAlign"]): void;
5
- //# sourceMappingURL=image-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type InnerGridCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const AllCellRenderers: InternalCellRenderer<InnerGridCell>[];
4
- //# sourceMappingURL=index.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type LoadingCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const loadingCellRenderer: InternalCellRenderer<LoadingCell>;
4
- //# sourceMappingURL=loading-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type MarkdownCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const markdownCellRenderer: InternalCellRenderer<MarkdownCell>;
4
- //# sourceMappingURL=markdown-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type MarkerCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const markerCellRenderer: InternalCellRenderer<MarkerCell>;
4
- //# sourceMappingURL=marker-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type NewRowCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const newRowCellRenderer: InternalCellRenderer<NewRowCell>;
4
- //# sourceMappingURL=new-row-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type NumberCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const numberCellRenderer: InternalCellRenderer<NumberCell>;
4
- //# sourceMappingURL=number-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type ProtectedCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const protectedCellRenderer: InternalCellRenderer<ProtectedCell>;
4
- //# sourceMappingURL=protected-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type RowIDCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const rowIDCellRenderer: InternalCellRenderer<RowIDCell>;
4
- //# sourceMappingURL=row-id-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type TextCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const textCellRenderer: InternalCellRenderer<TextCell>;
4
- //# sourceMappingURL=text-cell.d.ts.map
@@ -1,4 +1,3 @@
1
1
  import { type UriCell } from "../internal/data-grid/data-grid-types.js";
2
2
  import type { InternalCellRenderer } from "./cell-types.js";
3
3
  export declare const uriCellRenderer: InternalCellRenderer<UriCell>;
4
- //# sourceMappingURL=uri-cell.d.ts.map
@@ -8,4 +8,3 @@ export declare const browserIsFirefox: Lazy<boolean>;
8
8
  export declare const browserIsSafari: Lazy<boolean>;
9
9
  export declare const browserIsOSX: Lazy<boolean>;
10
10
  export {};
11
- //# sourceMappingURL=browser-detect.d.ts.map
@@ -12,4 +12,3 @@ declare class ImageWindowLoaderImpl extends WindowingTrackerBase implements Imag
12
12
  loadOrGetImage(url: string, col: number, row: number): HTMLImageElement | ImageBitmap | undefined;
13
13
  }
14
14
  export default ImageWindowLoaderImpl;
15
- //# sourceMappingURL=image-window-loader.d.ts.map
@@ -4,4 +4,3 @@ interface HotkeyResultDetails {
4
4
  }
5
5
  export declare function isHotkey(hotkey: string, args: GridKeyEventArgs, details: HotkeyResultDetails): boolean;
6
6
  export {};
7
- //# sourceMappingURL=is-hotkey.d.ts.map
@@ -17,4 +17,3 @@ interface SplitRect {
17
17
  }
18
18
  export declare function splitRectIntoRegions(rect: Rectangle, splitIndicies: readonly [number, number, number, number], width: number, height: number, splitLocations: readonly [number, number, number, number]): SplitRect[];
19
19
  export {};
20
- //# sourceMappingURL=math.d.ts.map
@@ -17,4 +17,3 @@ export declare class RenderStateProvider extends WindowingTrackerBase {
17
17
  getValue: (location: Item) => any;
18
18
  protected clearOutOfWindow: () => void;
19
19
  }
20
- //# sourceMappingURL=render-state-provider.d.ts.map
@@ -8,4 +8,3 @@ export interface UseResizeDetectorReturn<T> extends ReactResizeDetectorDimension
8
8
  ref: MutableRefObject<T | null>;
9
9
  }
10
10
  export {};
11
- //# sourceMappingURL=resize-detector.d.ts.map
@@ -58,4 +58,3 @@ export declare const ThemeContext: React.Context<Theme>;
58
58
  /** @category Hooks */
59
59
  export declare function useTheme(): Theme;
60
60
  export declare function mergeAndRealizeTheme(theme: Theme, ...overlays: Partial<Theme | undefined>[]): FullTheme;
61
- //# sourceMappingURL=styles.d.ts.map
@@ -10,4 +10,3 @@ export declare function deepEqual(foo: any, bar: any): boolean;
10
10
  export type FullyDefined<T> = {
11
11
  [K in keyof Required<T>]: T[K];
12
12
  };
13
- //# sourceMappingURL=support.d.ts.map
@@ -35,4 +35,3 @@ export declare function useStateWithReactiveInput<T>(inputState: T): [T, React.D
35
35
  export declare function makeAccessibilityStringForArray(arr: readonly string[]): string;
36
36
  export declare function useDeepMemo<T>(value: T): T;
37
37
  export {};
38
- //# sourceMappingURL=utils.d.ts.map
@@ -19,4 +19,3 @@ export declare function getCopyBufferContents(cells: readonly (readonly GridCell
19
19
  };
20
20
  export declare function decodeHTML(html: string): CopyBuffer | undefined;
21
21
  export {};
22
- //# sourceMappingURL=copy-paste.d.ts.map
@@ -13,4 +13,3 @@ export declare function copyToClipboard(cells: readonly (readonly GridCell[])[],
13
13
  * empty + click -> checked
14
14
  */
15
15
  export declare function toggleBoolean(data: boolean | null | undefined): boolean | null | undefined;
16
- //# sourceMappingURL=data-editor-fns.d.ts.map