@astral/ui 4.78.0 → 4.80.0

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 (57) hide show
  1. package/components/DataGridInfinite/DataGridInfinite.js +11 -3
  2. package/components/DataGridInfinite/Row/Row.js +1 -1
  3. package/components/DataGridInfinite/index.d.ts +1 -1
  4. package/components/DataGridInfinite/public.d.ts +1 -1
  5. package/components/DataGridInfinite/styles.d.ts +4 -0
  6. package/components/DataGridInfinite/styles.js +8 -0
  7. package/components/DataGridInfinite/types.d.ts +20 -0
  8. package/components/DataGridInfinite/useLogic/useLogic.d.ts +10 -4
  9. package/components/DataGridInfinite/useLogic/useLogic.js +52 -3
  10. package/components/ToggleButton/ToggleButton.js +2 -2
  11. package/components/ToggleButton/useLogic/useLogic.d.ts +1 -0
  12. package/components/ToggleButton/useLogic/useLogic.js +3 -1
  13. package/components/ToggleButtonGroup/ToggleButtonGroup.d.ts +2 -23
  14. package/components/ToggleButtonGroup/ToggleButtonGroup.js +5 -4
  15. package/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContext.d.ts +1 -0
  16. package/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContext.js +1 -0
  17. package/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContextProvider/ToggleButtonGroupContextProvider.d.ts +1 -1
  18. package/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContextProvider/ToggleButtonGroupContextProvider.js +2 -2
  19. package/components/ToggleButtonGroup/index.d.ts +1 -0
  20. package/components/ToggleButtonGroup/public.d.ts +1 -0
  21. package/components/ToggleButtonGroup/styles.d.ts +5 -0
  22. package/components/ToggleButtonGroup/styles.js +17 -0
  23. package/components/ToggleButtonGroup/types.d.ts +23 -0
  24. package/components/ToggleButtonGroup/types.js +1 -0
  25. package/components/ToggleButtonGroup/useLogic/index.d.ts +1 -0
  26. package/components/ToggleButtonGroup/useLogic/index.js +1 -0
  27. package/components/ToggleButtonGroup/useLogic/useLogic.d.ts +300 -0
  28. package/components/ToggleButtonGroup/useLogic/useLogic.js +16 -0
  29. package/node/components/DataGridInfinite/DataGridInfinite.js +10 -2
  30. package/node/components/DataGridInfinite/Row/Row.js +1 -1
  31. package/node/components/DataGridInfinite/index.d.ts +1 -1
  32. package/node/components/DataGridInfinite/public.d.ts +1 -1
  33. package/node/components/DataGridInfinite/styles.d.ts +4 -0
  34. package/node/components/DataGridInfinite/styles.js +9 -1
  35. package/node/components/DataGridInfinite/types.d.ts +20 -0
  36. package/node/components/DataGridInfinite/useLogic/useLogic.d.ts +10 -4
  37. package/node/components/DataGridInfinite/useLogic/useLogic.js +52 -3
  38. package/node/components/ToggleButton/ToggleButton.js +2 -2
  39. package/node/components/ToggleButton/useLogic/useLogic.d.ts +1 -0
  40. package/node/components/ToggleButton/useLogic/useLogic.js +3 -1
  41. package/node/components/ToggleButtonGroup/ToggleButtonGroup.d.ts +2 -23
  42. package/node/components/ToggleButtonGroup/ToggleButtonGroup.js +4 -3
  43. package/node/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContext.d.ts +1 -0
  44. package/node/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContext.js +1 -0
  45. package/node/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContextProvider/ToggleButtonGroupContextProvider.d.ts +1 -1
  46. package/node/components/ToggleButtonGroup/ToggleButtonGroupContext/ToggleButtonGroupContextProvider/ToggleButtonGroupContextProvider.js +2 -2
  47. package/node/components/ToggleButtonGroup/index.d.ts +1 -0
  48. package/node/components/ToggleButtonGroup/public.d.ts +1 -0
  49. package/node/components/ToggleButtonGroup/styles.d.ts +5 -0
  50. package/node/components/ToggleButtonGroup/styles.js +18 -1
  51. package/node/components/ToggleButtonGroup/types.d.ts +23 -0
  52. package/node/components/ToggleButtonGroup/types.js +2 -0
  53. package/node/components/ToggleButtonGroup/useLogic/index.d.ts +1 -0
  54. package/node/components/ToggleButtonGroup/useLogic/index.js +17 -0
  55. package/node/components/ToggleButtonGroup/useLogic/useLogic.d.ts +300 -0
  56. package/node/components/ToggleButtonGroup/useLogic/useLogic.js +20 -0
  57. package/package.json +1 -1
@@ -0,0 +1,300 @@
1
+ import { type Ref } from 'react';
2
+ import type { ToggleButtonGroupProps } from '../types';
3
+ type UseLogicParams = ToggleButtonGroupProps;
4
+ export declare const useLogic: ({ size, isError, errorText, variant, ...restProps }: UseLogicParams, forwardedRef: Ref<HTMLDivElement>) => {
5
+ size: import("@mui/types").OverridableStringUnion<"large" | "medium" | "small", import("@mui/material").ToggleButtonGroupPropsSizeOverrides>;
6
+ isError: boolean | undefined;
7
+ errorText: import("react").ReactNode;
8
+ variant: "transparent" | "plain";
9
+ restProps: {
10
+ classes?: Partial<import("@mui/material").ToggleButtonGroupClasses> | undefined;
11
+ defaultChecked?: boolean | undefined;
12
+ defaultValue?: string | number | readonly string[] | undefined;
13
+ suppressContentEditableWarning?: boolean | undefined;
14
+ suppressHydrationWarning?: boolean | undefined;
15
+ accessKey?: string | undefined;
16
+ autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
17
+ autoFocus?: boolean | undefined;
18
+ className?: string | undefined;
19
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
20
+ contextMenu?: string | undefined;
21
+ dir?: string | undefined;
22
+ draggable?: (boolean | "true" | "false") | undefined;
23
+ enterKeyHint?: "enter" | "search" | "done" | "go" | "next" | "previous" | "send" | undefined;
24
+ hidden?: boolean | undefined;
25
+ id?: string | undefined;
26
+ lang?: string | undefined;
27
+ nonce?: string | undefined;
28
+ slot?: string | undefined;
29
+ spellCheck?: (boolean | "true" | "false") | undefined;
30
+ style?: import("react").CSSProperties | undefined;
31
+ tabIndex?: number | undefined;
32
+ title?: string | undefined;
33
+ translate?: "yes" | "no" | undefined;
34
+ radioGroup?: string | undefined;
35
+ role?: import("react").AriaRole | undefined;
36
+ about?: string | undefined;
37
+ content?: string | undefined;
38
+ datatype?: string | undefined;
39
+ inlist?: any;
40
+ prefix?: string | undefined;
41
+ property?: string | undefined;
42
+ rel?: string | undefined;
43
+ resource?: string | undefined;
44
+ rev?: string | undefined;
45
+ typeof?: string | undefined;
46
+ vocab?: string | undefined;
47
+ autoCorrect?: string | undefined;
48
+ autoSave?: string | undefined;
49
+ color?: import("@mui/types").OverridableStringUnion<"primary" | "secondary" | "success" | "warning" | "error" | "info" | "standard", import("@mui/material").ToggleButtonGroupPropsColorOverrides> | undefined;
50
+ itemProp?: string | undefined;
51
+ itemScope?: boolean | undefined;
52
+ itemType?: string | undefined;
53
+ itemID?: string | undefined;
54
+ itemRef?: string | undefined;
55
+ results?: number | undefined;
56
+ security?: string | undefined;
57
+ unselectable?: "off" | "on" | undefined;
58
+ popover?: "" | "auto" | "manual" | "hint" | undefined;
59
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
60
+ popoverTarget?: string | undefined;
61
+ inert?: boolean | undefined;
62
+ inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
63
+ is?: string | undefined;
64
+ exportparts?: string | undefined;
65
+ part?: string | undefined;
66
+ "aria-activedescendant"?: string | undefined;
67
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
68
+ "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
69
+ "aria-braillelabel"?: string | undefined;
70
+ "aria-brailleroledescription"?: string | undefined;
71
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
72
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
73
+ "aria-colcount"?: number | undefined;
74
+ "aria-colindex"?: number | undefined;
75
+ "aria-colindextext"?: string | undefined;
76
+ "aria-colspan"?: number | undefined;
77
+ "aria-controls"?: string | undefined;
78
+ "aria-current"?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
79
+ "aria-describedby"?: string | undefined;
80
+ "aria-description"?: string | undefined;
81
+ "aria-details"?: string | undefined;
82
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
83
+ "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
84
+ "aria-errormessage"?: string | undefined;
85
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
86
+ "aria-flowto"?: string | undefined;
87
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
88
+ "aria-haspopup"?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "true" | "false" | undefined;
89
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
90
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
91
+ "aria-keyshortcuts"?: string | undefined;
92
+ "aria-label"?: string | undefined;
93
+ "aria-labelledby"?: string | undefined;
94
+ "aria-level"?: number | undefined;
95
+ "aria-live"?: "off" | "assertive" | "polite" | undefined;
96
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
97
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
98
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
99
+ "aria-orientation"?: "horizontal" | "vertical" | undefined;
100
+ "aria-owns"?: string | undefined;
101
+ "aria-placeholder"?: string | undefined;
102
+ "aria-posinset"?: number | undefined;
103
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
104
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
105
+ "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
106
+ "aria-required"?: (boolean | "true" | "false") | undefined;
107
+ "aria-roledescription"?: string | undefined;
108
+ "aria-rowcount"?: number | undefined;
109
+ "aria-rowindex"?: number | undefined;
110
+ "aria-rowindextext"?: string | undefined;
111
+ "aria-rowspan"?: number | undefined;
112
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
113
+ "aria-setsize"?: number | undefined;
114
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
115
+ "aria-valuemax"?: number | undefined;
116
+ "aria-valuemin"?: number | undefined;
117
+ "aria-valuenow"?: number | undefined;
118
+ "aria-valuetext"?: string | undefined;
119
+ children?: import("react").ReactNode;
120
+ dangerouslySetInnerHTML?: {
121
+ __html: string | TrustedHTML;
122
+ } | undefined;
123
+ onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
124
+ onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
125
+ onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
126
+ onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
127
+ onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
128
+ onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
129
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
130
+ onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
131
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
132
+ onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
133
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
134
+ onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
135
+ onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
136
+ onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
137
+ onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
138
+ onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
139
+ onChange?: ((event: import("react").MouseEvent<HTMLElement, MouseEvent>, value: any) => void) | undefined;
140
+ onChangeCapture?: import("react").ChangeEventHandler<HTMLDivElement, Element> | undefined;
141
+ onBeforeInput?: import("react").InputEventHandler<HTMLDivElement> | undefined;
142
+ onBeforeInputCapture?: import("react").InputEventHandler<HTMLDivElement> | undefined;
143
+ onInput?: import("react").InputEventHandler<HTMLDivElement> | undefined;
144
+ onInputCapture?: import("react").InputEventHandler<HTMLDivElement> | undefined;
145
+ onReset?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
146
+ onResetCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
147
+ onSubmit?: import("react").SubmitEventHandler<HTMLDivElement> | undefined;
148
+ onSubmitCapture?: import("react").SubmitEventHandler<HTMLDivElement> | undefined;
149
+ onInvalid?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
150
+ onInvalidCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
151
+ onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
152
+ onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
153
+ onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
154
+ onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
155
+ onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
156
+ onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
157
+ onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
158
+ onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
159
+ onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
160
+ onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
161
+ onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
162
+ onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
163
+ onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
164
+ onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
165
+ onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
166
+ onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
167
+ onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
168
+ onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
169
+ onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
170
+ onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
171
+ onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
172
+ onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
173
+ onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
174
+ onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
175
+ onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
176
+ onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
177
+ onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
178
+ onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
179
+ onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
180
+ onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
181
+ onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
182
+ onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
183
+ onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
184
+ onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
185
+ onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
186
+ onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
187
+ onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
188
+ onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
189
+ onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
190
+ onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
191
+ onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
192
+ onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
193
+ onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
194
+ onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
195
+ onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
196
+ onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
197
+ onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
198
+ onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
199
+ onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
200
+ onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
201
+ onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
202
+ onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
203
+ onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
204
+ onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
205
+ onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
206
+ onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
207
+ onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
208
+ onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
209
+ onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
210
+ onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
211
+ onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
212
+ onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
213
+ onDrag?: import("react").DragEventHandler<HTMLDivElement> | undefined;
214
+ onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
215
+ onDragEnd?: import("react").DragEventHandler<HTMLDivElement> | undefined;
216
+ onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
217
+ onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
218
+ onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
219
+ onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
220
+ onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
221
+ onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
222
+ onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
223
+ onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
224
+ onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
225
+ onDragStart?: import("react").DragEventHandler<HTMLDivElement> | undefined;
226
+ onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
227
+ onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
228
+ onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
229
+ onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
230
+ onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
231
+ onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
232
+ onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
233
+ onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
234
+ onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
235
+ onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
236
+ onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
237
+ onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
238
+ onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
239
+ onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
240
+ onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
241
+ onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
242
+ onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
243
+ onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
244
+ onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
245
+ onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
246
+ onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
247
+ onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
248
+ onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
249
+ onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
250
+ onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
251
+ onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
252
+ onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
253
+ onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
254
+ onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
255
+ onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
256
+ onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
257
+ onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
258
+ onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
259
+ onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
260
+ onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
261
+ onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
262
+ onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
263
+ onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
264
+ onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
265
+ onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
266
+ onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
267
+ onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
268
+ onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
269
+ onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
270
+ onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
271
+ onScrollEnd?: import("react").UIEventHandler<HTMLDivElement> | undefined;
272
+ onScrollEndCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
273
+ onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
274
+ onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
275
+ onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
276
+ onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
277
+ onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
278
+ onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
279
+ onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
280
+ onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
281
+ onToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
282
+ onBeforeToggle?: import("react").ToggleEventHandler<HTMLDivElement> | undefined;
283
+ onTransitionCancel?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
284
+ onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
285
+ onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
286
+ onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
287
+ onTransitionRun?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
288
+ onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
289
+ onTransitionStart?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
290
+ onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
291
+ ref?: Ref<unknown> | undefined;
292
+ disabled?: boolean | undefined;
293
+ fullWidth?: boolean | undefined;
294
+ value?: any;
295
+ exclusive?: boolean | undefined;
296
+ };
297
+ title: import("react").ReactNode;
298
+ containerRef: import("react").RefObject<HTMLDivElement | null>;
299
+ };
300
+ export {};
@@ -0,0 +1,16 @@
1
+ import { useImperativeHandle } from 'react';
2
+ import { useScrollToActiveElement } from '../../useScrollToActiveElement';
3
+ export const useLogic = ({ size = 'medium', isError, errorText, variant = 'transparent', ...restProps }, forwardedRef) => {
4
+ const title = isError && errorText;
5
+ const { containerRef } = useScrollToActiveElement();
6
+ useImperativeHandle(forwardedRef, () => containerRef.current, [forwardedRef]);
7
+ return {
8
+ size,
9
+ isError,
10
+ errorText,
11
+ variant,
12
+ restProps,
13
+ title,
14
+ containerRef,
15
+ };
16
+ };
@@ -45,7 +45,7 @@ const dataGridInfiniteCva = (0, cva_1.cva)(constants_2.dataGridClassnames.root,
45
45
  });
46
46
  const DataGridInfinite = (props) => {
47
47
  const { imagesMap, emptySymbol } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
48
- const { isNoData, isDataGridDisabled, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, isHideHead, containerCssVars, isMobile, mobileSkeletonProps, hasGroupedColumns, gridViewMode, gridColumns, handleSelectRow, mobileDisplayVariant, isSelfContained, } = (0, useLogic_1.useLogic)(props);
48
+ const { isNoData, isDataGridDisabled, treeRenderConfig, virtuosoProps, headProps, rowProps, scrollToTopButtonProps, isEndReached, isHideHead, containerCssVars, isMobile, mobileSkeletonProps, hasGroupedColumns, gridViewMode, gridColumns, handleSelectRow, mobileDisplayVariant, isSelfContained, isNotRenderHeader, initialTopMostItemIndex, } = (0, useLogic_1.useLogic)(props);
49
49
  const { columns, rows = [], selectedRows = [], sorting, isLoading, isDisabled, keyId, emptyCellValue = emptySymbol, variant = enums_1.Variant.Tree, subrows, className, isError, endOfScrollMsg, errorMsg, noDataPlaceholder, onRowClick, onSort, onRetry, headPreAddon, activeRowId, isTabularNums, renderRow, } = props;
50
50
  const { moreButtonColumnPosition = 1, isVisibleCollapseButton = true } = subrows || {};
51
51
  const { isInitialExpanded = false, expandedLevel = constants_2.EXPANDED_LEVEL_BY_DEFAULT, initialVisibleChildrenCount = constants_2.INITIAL_OPENED_NESTED_CHILDREN_COUNT_BY_DEFAULT, } = treeRenderConfig || {};
@@ -61,7 +61,9 @@ const DataGridInfinite = (props) => {
61
61
  errorList: [errorMsg || ''],
62
62
  imgSrc: imagesMap.defaultErrorImgSrc,
63
63
  onRetry,
64
- }, children: (0, jsx_runtime_1.jsx)(react_virtuoso_1.Virtuoso, { ...virtuosoProps, style: { height: '100%' }, overscan: constants_3.OVERSCAN_COUNT, data: rows, components: {
64
+ }, children: (0, jsx_runtime_1.jsx)(react_virtuoso_1.Virtuoso, { ...virtuosoProps, ...(initialTopMostItemIndex && {
65
+ initialTopMostItemIndex,
66
+ }), style: { height: '100%' }, overscan: constants_3.OVERSCAN_COUNT, data: rows, components: {
65
67
  // biome-ignore lint/suspicious/noTsIgnore: Требует HTMLDivElement, а для элемента списка используем HTMLUListElement (https://github.com/petyosi/react-virtuoso/issues/864)
66
68
  // @ts-ignore
67
69
  List: List_1.List,
@@ -73,6 +75,12 @@ const DataGridInfinite = (props) => {
73
75
  }
74
76
  return ((0, jsx_runtime_1.jsxs)(styles_1.FooterRow, { children: [isLoading && (0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), isError && (0, jsx_runtime_1.jsx)(ErrorMessage_1.ErrorMessage, { onRetry: onRetry }), isEndReached && ((0, jsx_runtime_1.jsx)(EndData_1.EndData, { endOfScrollMsg: endOfScrollMsg }))] }));
75
77
  },
78
+ Header: () => {
79
+ if (isNotRenderHeader) {
80
+ return null;
81
+ }
82
+ return ((0, jsx_runtime_1.jsxs)(styles_1.HeaderRow, { children: [isLoading && (0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), isError && (0, jsx_runtime_1.jsx)(ErrorMessage_1.ErrorMessage, { onRetry: onRetry })] }));
83
+ },
76
84
  } }) }), (0, jsx_runtime_1.jsx)(styles_1.StyledScrollToTopButton, { ...scrollToTopButtonProps, className: constants_3.dataGridInfiniteClassnames.scrollToTopButton }), isDisabled && (0, jsx_runtime_1.jsx)(styles_1.Backdrop, {})] })] }) }) }));
77
85
  };
78
86
  exports.DataGridInfinite = DataGridInfinite;
@@ -9,6 +9,6 @@ const useLogic_1 = require("./useLogic");
9
9
  const INITIAL_LEVEL = 0;
10
10
  const Row = ({ children, ...props }) => {
11
11
  const { item, memoizedItemProps, onSelectRow, renderRow, flattenColumns, gridColumns, options, keyId, variant, isSelectable, isSelected, nestedChildren, isInitialExpanded, expandedLevel, initialVisibleChildrenCount, moreButtonColumnPosition, isVisibleCollapseButton, emptyCellValue, activeRowId, onRowClick, } = (0, useLogic_1.useLogic)(props);
12
- return ((0, jsx_runtime_1.jsx)(RowContext_1.RowContextProvider, { row: item, itemProps: memoizedItemProps, onSelectRow: onSelectRow, isSelectable: isSelectable, isSelected: isSelected, children: renderRow ? ((0, jsx_runtime_1.jsx)(CustomRowWrapper_1.CustomRowWrapper, { index: memoizedItemProps['data-item-index'], renderRow: renderRow, row: item })) : ((0, jsx_runtime_1.jsx)(Row_1.Row, { ...memoizedItemProps, row: item, columns: flattenColumns, gridColumns: gridColumns, options: options, keyId: keyId, variant: variant, isSelectable: isSelectable, isSelected: isSelected, level: INITIAL_LEVEL, nestedChildren: nestedChildren, isInitialExpanded: isInitialExpanded || false, expandedLevel: expandedLevel || 1, initialVisibleChildrenCount: initialVisibleChildrenCount || 2, activeRowId: activeRowId, moreButtonColumnPosition: moreButtonColumnPosition || 1, isVisibleCollapseButton: isVisibleCollapseButton || true, emptyCellValue: emptyCellValue, onRowClick: onRowClick, onSelectRow: onSelectRow })) }));
12
+ return ((0, jsx_runtime_1.jsx)(RowContext_1.RowContextProvider, { row: item, itemProps: memoizedItemProps, onSelectRow: onSelectRow, isSelectable: isSelectable, isSelected: isSelected, children: renderRow ? ((0, jsx_runtime_1.jsx)(CustomRowWrapper_1.CustomRowWrapper, { index: memoizedItemProps['data-index'], renderRow: renderRow, row: item })) : ((0, jsx_runtime_1.jsx)(Row_1.Row, { ...memoizedItemProps, row: item, columns: flattenColumns, gridColumns: gridColumns, options: options, keyId: keyId, variant: variant, isSelectable: isSelectable, isSelected: isSelected, level: INITIAL_LEVEL, nestedChildren: nestedChildren, isInitialExpanded: isInitialExpanded || false, expandedLevel: expandedLevel || 1, initialVisibleChildrenCount: initialVisibleChildrenCount || 2, activeRowId: activeRowId, moreButtonColumnPosition: moreButtonColumnPosition || 1, isVisibleCollapseButton: isVisibleCollapseButton || true, emptyCellValue: emptyCellValue, onRowClick: onRowClick, onSelectRow: onSelectRow })) }));
13
13
  };
14
14
  exports.Row = Row;
@@ -1,2 +1,2 @@
1
1
  export { DataGridInfinite } from './DataGridInfinite';
2
- export type { DataGridInfiniteProps } from './types';
2
+ export type { DataGridInfiniteProps, DataGridInfiniteVirtuosoHandle, DataGridInfiniteVirtuosoRef, } from './types';
@@ -1,2 +1,2 @@
1
1
  export { DataGridInfinite } from './DataGridInfinite';
2
- export type { DataGridInfiniteProps } from './types';
2
+ export type { DataGridInfiniteProps, DataGridInfiniteVirtuosoHandle, DataGridInfiniteVirtuosoRef, } from './types';
@@ -13,6 +13,10 @@ export declare const FooterRow: import("@emotion/styled/dist/declarations/src/ty
13
13
  theme?: import("@emotion/react").Theme | undefined;
14
14
  as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
15
15
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
16
+ export declare const HeaderRow: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
17
+ theme?: import("@emotion/react").Theme | undefined;
18
+ as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
19
+ }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
16
20
  export declare const Backdrop: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
17
21
  theme?: import("@emotion/react").Theme | undefined;
18
22
  as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.StyledContainer = exports.StyledScrollToTopButton = exports.Backdrop = exports.FooterRow = exports.DisabledDataGridWrapper = exports.DataGridWrapper = void 0;
3
+ exports.StyledContainer = exports.StyledScrollToTopButton = exports.Backdrop = exports.HeaderRow = exports.FooterRow = exports.DisabledDataGridWrapper = exports.DataGridWrapper = void 0;
4
4
  const styles_1 = require("../DataGrid/styles");
5
5
  const ScrollToTopButton_1 = require("../ScrollToTopButton");
6
6
  const styled_1 = require("../styled");
@@ -29,6 +29,14 @@ exports.FooterRow = styled_1.styled.footer `
29
29
 
30
30
  min-height: 68px;
31
31
  `;
32
+ exports.HeaderRow = styled_1.styled.header `
33
+ display: flex;
34
+ flex-shrink: 0;
35
+ align-items: center;
36
+ justify-content: center;
37
+
38
+ min-height: 68px;
39
+ `;
32
40
  exports.Backdrop = styled_1.styled.div `
33
41
  position: absolute;
34
42
  top: 0;
@@ -1,6 +1,14 @@
1
+ import { type Ref, type RefObject } from 'react';
2
+ import { type VirtuosoHandle } from 'react-virtuoso';
1
3
  import type { DataGridProps, DataGridRow } from '../DataGrid';
2
4
  import { type CellValue } from '../DataGrid/types';
5
+ export type DataGridInfiniteVirtuosoHandle = VirtuosoHandle;
6
+ export type DataGridInfiniteVirtuosoRef = RefObject<DataGridInfiniteVirtuosoHandle | null>;
3
7
  export type DataGridInfiniteProps<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = Omit<DataGridProps<TData, TSortField>, 'footer' | 'minDisplayRows'> & {
8
+ /**
9
+ * Ref для доступа к методам Virtuoso
10
+ */
11
+ virtuosoRef?: Ref<DataGridInfiniteVirtuosoHandle>;
4
12
  /**
5
13
  * Флаг достижения конца списка
6
14
  */
@@ -17,4 +25,16 @@ export type DataGridInfiniteProps<TData extends Record<string, CellValue> = Data
17
25
  * Убирает шапку таблицы, когда нет данных
18
26
  */
19
27
  isHideHeaderIfNoData?: boolean;
28
+ /**
29
+ * Обработчик подгрузки данных при скроле до начала списка
30
+ */
31
+ onStartReached?: () => void;
32
+ /**
33
+ * Флаг достижения начала списка
34
+ */
35
+ isStartReached?: boolean;
36
+ /**
37
+ * Индекс первого видимого элемента
38
+ */
39
+ initialVisibleItemIndex?: number;
20
40
  };
@@ -1,10 +1,10 @@
1
1
  import { type ChangeEvent } from 'react';
2
- import type { ListRange, VirtuosoHandle } from 'react-virtuoso';
2
+ import type { ListRange } from 'react-virtuoso';
3
3
  import { type DataGridRow } from '../../DataGrid';
4
4
  import { type CellValue } from '../../DataGrid/types';
5
- import { type DataGridInfiniteProps } from '../types';
5
+ import { type DataGridInfiniteProps, type DataGridInfiniteVirtuosoHandle } from '../types';
6
6
  type UseLogicParams<TData extends Record<string, CellValue> = DataGridRow, TSortField extends keyof TData = keyof TData> = DataGridInfiniteProps<TData, TSortField>;
7
- export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, maxHeight, isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, isHideHeaderIfNoData, gridViewMode: gridViewModeProp, mobileDisplayVariant, }: UseLogicParams<TData, TSortField>) => {
7
+ export declare const useLogic: <TData extends Record<string, unknown> = DataGridRow, TSortField extends keyof TData = keyof TData>({ keyId, columns, rows, variant, tree, subrows, selectedRows, maxHeight, isLoading, isError, isDisabled, isEndReached, onEndReached, onStartReached, isStartReached, onSelectRow, isHideSelectAll, initialVisibleItemIndex, isHideHeaderIfNoData, gridViewMode: gridViewModeProp, mobileDisplayVariant, virtuosoRef, }: UseLogicParams<TData, TSortField>) => {
8
8
  containerCssVars: import("react").CSSProperties;
9
9
  mobileSkeletonProps: {
10
10
  cellsCount: number;
@@ -24,12 +24,17 @@ export declare const useLogic: <TData extends Record<string, unknown> = DataGrid
24
24
  hasGroupedColumns: boolean;
25
25
  gridViewMode: "standard" | "full";
26
26
  gridColumns: string;
27
+ isStartReached: boolean | undefined;
28
+ isNotRenderHeader: boolean | undefined;
29
+ initialTopMostItemIndex: number | undefined;
27
30
  virtuosoProps: {
28
31
  id: string;
29
- ref: import("react").RefObject<VirtuosoHandle | null>;
32
+ ref: (node: DataGridInfiniteVirtuosoHandle | null) => void;
30
33
  endReached: () => void;
31
34
  rangeChanged: (range: ListRange) => void;
32
35
  totalListHeightChanged: () => void;
36
+ startReached: () => void;
37
+ firstItemIndex: number;
33
38
  };
34
39
  headProps: {
35
40
  rowsCount: number;
@@ -50,5 +55,6 @@ export declare const useLogic: <TData extends Record<string, unknown> = DataGrid
50
55
  handleSelectRow: (row: TData) => (event: ChangeEvent<HTMLInputElement>) => void;
51
56
  mobileDisplayVariant: "list" | "cards";
52
57
  isSelfContained: boolean;
58
+ firstItemIndex: number;
53
59
  };
54
60
  export {};
@@ -10,12 +10,45 @@ const useViewportType_1 = require("../../useViewportType");
10
10
  const prop_1 = require("../../utils/prop");
11
11
  const uniqueBy_1 = require("../../utils/uniqueBy");
12
12
  const constants_2 = require("../constants");
13
- const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], maxHeight, isLoading, isDisabled, isEndReached, onEndReached, onSelectRow, isHideSelectAll, isHideHeaderIfNoData = false, gridViewMode: gridViewModeProp = 'standard', mobileDisplayVariant = variant === 'subrows' ? 'cards' : 'list', }) => {
13
+ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows = [], maxHeight, isLoading, isError, isDisabled, isEndReached, onEndReached, onStartReached, isStartReached, onSelectRow, isHideSelectAll, initialVisibleItemIndex, isHideHeaderIfNoData = false, gridViewMode: gridViewModeProp = 'standard', mobileDisplayVariant = variant === 'subrows' ? 'cards' : 'list', virtuosoRef, }) => {
14
14
  const virtuoso = (0, react_1.useRef)(null);
15
+ const handleVirtuosoRef = (0, react_1.useCallback)((node) => {
16
+ virtuoso.current = node;
17
+ if (virtuosoRef) {
18
+ virtuosoRef.current = node;
19
+ }
20
+ }, [virtuosoRef]);
15
21
  const scrollToTopButtonRef = (0, react_1.useRef)(null);
16
22
  const { isMobile } = (0, useViewportType_1.useViewportType)();
17
23
  // Реф добавлен для избежания замыкания selectedRows в handleSelectRow (иначе в handleSelectRow приходят некорректные значения selectedRows).
18
24
  const selectedRowsRef = (0, react_1.useRef)(selectedRows);
25
+ // Рефы для вычисления firstItemIndex
26
+ // baseIndex - базовый индекс для вычисления firstItemIndex. Делаем очень большим, что бы при подгрузке данных вверх(начало списка) virtuoso ставил им индексы меньше чем этот.
27
+ const baseIndex = (0, react_1.useRef)(10000);
28
+ const initialLength = (0, react_1.useRef)(rows.length);
29
+ const firstRowId = (0, react_1.useRef)(rows[0]?.[keyId]);
30
+ // Вычисляем firstItemIndex для динамической подгрузки данных вверх. Что бы virtuoso понимал что данные сверху еще есть и не надо скролить до верха списка.
31
+ const firstItemIndex = (0, react_1.useMemo)(() => {
32
+ const currentLength = rows.length;
33
+ const currentFirstId = rows[0]?.[keyId];
34
+ if (currentLength !== initialLength.current) {
35
+ // Если первый элемент изменился и длина увеличилась → подгрузка вверх
36
+ if (currentFirstId !== firstRowId.current &&
37
+ currentLength > initialLength.current) {
38
+ const addedCount = currentLength - initialLength.current;
39
+ baseIndex.current -= addedCount;
40
+ firstRowId.current = currentFirstId;
41
+ }
42
+ else if (currentLength < initialLength.current) {
43
+ baseIndex.current = 10000;
44
+ firstRowId.current = currentFirstId;
45
+ }
46
+ // Если длина увеличилась, но первый элемент не изменился → подгрузка вниз
47
+ // baseIndex не меняем
48
+ initialLength.current = currentLength;
49
+ }
50
+ return baseIndex.current;
51
+ }, [rows.length]);
19
52
  (0, react_1.useEffect)(() => {
20
53
  selectedRowsRef.current = selectedRows;
21
54
  }, [selectedRows]);
@@ -46,12 +79,17 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
46
79
  onEndReached();
47
80
  }
48
81
  }, [isEndReached, onEndReached]);
82
+ const handleStartReach = (0, react_1.useCallback)(() => {
83
+ if (!isStartReached && onStartReached) {
84
+ onStartReached();
85
+ }
86
+ }, [isStartReached, onStartReached]);
49
87
  const uncheckedRowsCount = (0, react_1.useMemo)(() => {
50
88
  return availableRows.filter((row) => !selectedRows.find((selectedRow) => selectedRow[keyId] === row[keyId])).length;
51
89
  }, [availableRows, selectedRows, keyId]);
52
90
  const handleRangeChanged = (0, react_1.useCallback)((range) => {
53
91
  if (scrollToTopButtonRef.current) {
54
- scrollToTopButtonRef.current.classList.toggle(constants_2.dataGridInfiniteClassnames.visibleScrollToTopButton, range.startIndex > 2);
92
+ scrollToTopButtonRef.current.classList.toggle(constants_2.dataGridInfiniteClassnames.visibleScrollToTopButton, range.startIndex > baseIndex.current + 2);
55
93
  }
56
94
  }, []);
57
95
  const handleSelectAllRows = (event) => {
@@ -90,6 +128,11 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
90
128
  mobileDisplayVariant,
91
129
  });
92
130
  const containerCssVars = (0, utils_1.getDataGridCssVars)(maxHeight);
131
+ const foundIndex = rows.findIndex((row) => String(row[keyId]) === String(initialVisibleItemIndex));
132
+ const initialTopMostItemIndex = foundIndex === -1 ? undefined : foundIndex;
133
+ const isNotRenderHeader = (!isLoading && !isError && !isStartReached) ||
134
+ !onStartReached ||
135
+ isStartReached;
93
136
  return {
94
137
  containerCssVars,
95
138
  mobileSkeletonProps,
@@ -102,12 +145,17 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
102
145
  hasGroupedColumns,
103
146
  gridViewMode,
104
147
  gridColumns,
148
+ isStartReached,
149
+ isNotRenderHeader,
150
+ initialTopMostItemIndex,
105
151
  virtuosoProps: {
106
152
  id: constants_2.VIRTUOSO_CONTAINER_ID,
107
- ref: virtuoso,
153
+ ref: handleVirtuosoRef,
108
154
  endReached: handleEndReach,
109
155
  rangeChanged: handleRangeChanged,
110
156
  totalListHeightChanged: recalculateVerticalScroll,
157
+ startReached: handleStartReach,
158
+ firstItemIndex,
111
159
  },
112
160
  headProps: {
113
161
  rowsCount: availableRows.length,
@@ -128,6 +176,7 @@ const useLogic = ({ keyId, columns, rows, variant, tree, subrows, selectedRows =
128
176
  handleSelectRow,
129
177
  mobileDisplayVariant,
130
178
  isSelfContained: mobileDisplayVariant === 'cards',
179
+ firstItemIndex,
131
180
  };
132
181
  };
133
182
  exports.useLogic = useLogic;
@@ -6,6 +6,6 @@ const react_1 = require("react");
6
6
  const styles_1 = require("./styles");
7
7
  const useLogic_1 = require("./useLogic");
8
8
  exports.ToggleButton = (0, react_1.forwardRef)((props, ref) => {
9
- const { isVisibleCounter, children, disabled, counterLabel, color, selected, restProps, variant, } = (0, useLogic_1.useLogic)(props);
10
- return ((0, jsx_runtime_1.jsxs)(styles_1.StyledToggleButton, { ref: ref, disabled: disabled, selected: selected, ...restProps, "$color": color, "$variant": variant, children: [children, isVisibleCounter && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [" \u00B7 ", counterLabel] })] }));
9
+ const { isVisibleCounter, children, disabled, counterLabel, color, selected, isSelected, restProps, variant, } = (0, useLogic_1.useLogic)(props);
10
+ return ((0, jsx_runtime_1.jsxs)(styles_1.StyledToggleButton, { ref: ref, disabled: disabled, selected: selected, ...restProps, "$color": color, "$variant": variant, "aria-selected": isSelected, children: [children, isVisibleCounter && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [" \u00B7 ", counterLabel] })] }));
11
11
  });
@@ -8,6 +8,7 @@ export declare const useLogic: ({ selected, color, counter, children, disabled,
8
8
  disabled: boolean | undefined;
9
9
  color: "primary" | "success" | "warning" | "error" | "grey";
10
10
  selected: boolean | undefined;
11
+ isSelected: boolean;
11
12
  counterLabel: string | number | undefined;
12
13
  restProps: {
13
14
  classes?: (Partial<import("@mui/material").ToggleButtonClasses> & Partial<import("@mui/material").ClassNameMap<never>>) | undefined;