@etsoo/react 1.8.40 → 1.8.41
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.
- package/lib/cjs/components/ScrollerGrid.js +15 -13
- package/lib/cjs/components/ScrollerList.js +18 -16
- package/lib/mjs/components/ScrollerGrid.js +15 -13
- package/lib/mjs/components/ScrollerList.js +18 -16
- package/package.json +12 -12
- package/src/components/ScrollerGrid.tsx +15 -12
- package/src/components/ScrollerList.tsx +20 -18
|
@@ -218,11 +218,6 @@ const ScrollerGrid = (props) => {
|
|
|
218
218
|
}
|
|
219
219
|
};
|
|
220
220
|
react_1.default.useImperativeHandle(mRef, () => instance, [rows]);
|
|
221
|
-
react_1.default.useEffect(() => {
|
|
222
|
-
return () => {
|
|
223
|
-
refs.current.isMounted = false;
|
|
224
|
-
};
|
|
225
|
-
}, []);
|
|
226
221
|
// Force update to work with the new width and rowHeight
|
|
227
222
|
react_1.default.useEffect(() => {
|
|
228
223
|
ref.current?.resetAfterIndices({
|
|
@@ -235,14 +230,21 @@ const ScrollerGrid = (props) => {
|
|
|
235
230
|
const rowLength = rows.length;
|
|
236
231
|
// Row count
|
|
237
232
|
const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
233
|
+
react_1.default.useEffect(() => {
|
|
234
|
+
// Auto load data when current page is 0
|
|
235
|
+
if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
|
|
236
|
+
const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
|
|
237
|
+
if (initItems)
|
|
238
|
+
reset(initItems[1], initItems[0]);
|
|
239
|
+
else
|
|
240
|
+
loadDataLocal();
|
|
241
|
+
}
|
|
242
|
+
}, [onInitLoad, loadDataLocal]);
|
|
243
|
+
react_1.default.useEffect(() => {
|
|
244
|
+
return () => {
|
|
245
|
+
refs.current.isMounted = false;
|
|
246
|
+
};
|
|
247
|
+
}, []);
|
|
246
248
|
// Layout
|
|
247
249
|
return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [headerRenderer && headerRenderer(refs.current), (0, jsx_runtime_1.jsx)(react_window_1.VariableSizeGrid, { itemKey: ({ columnIndex, rowIndex, data }) => {
|
|
248
250
|
if (data == null)
|
|
@@ -168,13 +168,6 @@ const ScrollerList = (props) => {
|
|
|
168
168
|
}
|
|
169
169
|
};
|
|
170
170
|
}, []);
|
|
171
|
-
// When layout ready
|
|
172
|
-
react_1.default.useEffect(() => {
|
|
173
|
-
// Return clear function
|
|
174
|
-
return () => {
|
|
175
|
-
stateRefs.current.isMounted = false;
|
|
176
|
-
};
|
|
177
|
-
}, []);
|
|
178
171
|
// Row count
|
|
179
172
|
const rowCount = rows.length;
|
|
180
173
|
// Local items renderer callback
|
|
@@ -190,15 +183,24 @@ const ScrollerList = (props) => {
|
|
|
190
183
|
};
|
|
191
184
|
// Item count
|
|
192
185
|
const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
stateRefs.current.
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
186
|
+
react_1.default.useEffect(() => {
|
|
187
|
+
// Auto load data when current page is 0
|
|
188
|
+
if (stateRefs.current.queryPaging?.currentPage === 0 &&
|
|
189
|
+
stateRefs.current.autoLoad) {
|
|
190
|
+
const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
|
|
191
|
+
if (initItems)
|
|
192
|
+
reset(initItems[1], initItems[0]);
|
|
193
|
+
else
|
|
194
|
+
loadDataLocal();
|
|
195
|
+
}
|
|
196
|
+
}, [onInitLoad, loadDataLocal]);
|
|
197
|
+
// When layout ready
|
|
198
|
+
react_1.default.useEffect(() => {
|
|
199
|
+
// Return clear function
|
|
200
|
+
return () => {
|
|
201
|
+
stateRefs.current.isMounted = false;
|
|
202
|
+
};
|
|
203
|
+
}, []);
|
|
202
204
|
// Layout
|
|
203
205
|
return typeof itemSize === "function" ? ((0, jsx_runtime_1.jsx)(react_window_1.VariableSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => shared_1.DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal })) : ((0, jsx_runtime_1.jsx)(react_window_1.FixedSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => shared_1.DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal }));
|
|
204
206
|
};
|
|
@@ -212,11 +212,6 @@ export const ScrollerGrid = (props) => {
|
|
|
212
212
|
}
|
|
213
213
|
};
|
|
214
214
|
React.useImperativeHandle(mRef, () => instance, [rows]);
|
|
215
|
-
React.useEffect(() => {
|
|
216
|
-
return () => {
|
|
217
|
-
refs.current.isMounted = false;
|
|
218
|
-
};
|
|
219
|
-
}, []);
|
|
220
215
|
// Force update to work with the new width and rowHeight
|
|
221
216
|
React.useEffect(() => {
|
|
222
217
|
ref.current?.resetAfterIndices({
|
|
@@ -229,14 +224,21 @@ export const ScrollerGrid = (props) => {
|
|
|
229
224
|
const rowLength = rows.length;
|
|
230
225
|
// Row count
|
|
231
226
|
const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
227
|
+
React.useEffect(() => {
|
|
228
|
+
// Auto load data when current page is 0
|
|
229
|
+
if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
|
|
230
|
+
const initItems = onInitLoad == null ? undefined : onInitLoad(ref.current);
|
|
231
|
+
if (initItems)
|
|
232
|
+
reset(initItems[1], initItems[0]);
|
|
233
|
+
else
|
|
234
|
+
loadDataLocal();
|
|
235
|
+
}
|
|
236
|
+
}, [onInitLoad, loadDataLocal]);
|
|
237
|
+
React.useEffect(() => {
|
|
238
|
+
return () => {
|
|
239
|
+
refs.current.isMounted = false;
|
|
240
|
+
};
|
|
241
|
+
}, []);
|
|
240
242
|
// Layout
|
|
241
243
|
return (_jsxs(React.Fragment, { children: [headerRenderer && headerRenderer(refs.current), _jsx(VariableSizeGrid, { itemKey: ({ columnIndex, rowIndex, data }) => {
|
|
242
244
|
if (data == null)
|
|
@@ -162,13 +162,6 @@ export const ScrollerList = (props) => {
|
|
|
162
162
|
}
|
|
163
163
|
};
|
|
164
164
|
}, []);
|
|
165
|
-
// When layout ready
|
|
166
|
-
React.useEffect(() => {
|
|
167
|
-
// Return clear function
|
|
168
|
-
return () => {
|
|
169
|
-
stateRefs.current.isMounted = false;
|
|
170
|
-
};
|
|
171
|
-
}, []);
|
|
172
165
|
// Row count
|
|
173
166
|
const rowCount = rows.length;
|
|
174
167
|
// Local items renderer callback
|
|
@@ -184,15 +177,24 @@ export const ScrollerList = (props) => {
|
|
|
184
177
|
};
|
|
185
178
|
// Item count
|
|
186
179
|
const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
stateRefs.current.
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
180
|
+
React.useEffect(() => {
|
|
181
|
+
// Auto load data when current page is 0
|
|
182
|
+
if (stateRefs.current.queryPaging?.currentPage === 0 &&
|
|
183
|
+
stateRefs.current.autoLoad) {
|
|
184
|
+
const initItems = onInitLoad == null ? undefined : onInitLoad(listRef.current);
|
|
185
|
+
if (initItems)
|
|
186
|
+
reset(initItems[1], initItems[0]);
|
|
187
|
+
else
|
|
188
|
+
loadDataLocal();
|
|
189
|
+
}
|
|
190
|
+
}, [onInitLoad, loadDataLocal]);
|
|
191
|
+
// When layout ready
|
|
192
|
+
React.useEffect(() => {
|
|
193
|
+
// Return clear function
|
|
194
|
+
return () => {
|
|
195
|
+
stateRefs.current.isMounted = false;
|
|
196
|
+
};
|
|
197
|
+
}, []);
|
|
196
198
|
// Layout
|
|
197
199
|
return typeof itemSize === "function" ? (_jsx(VariableSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal })) : (_jsx(FixedSizeList, { height: height, width: width, itemCount: itemCount, itemKey: (index, data) => DataTypes.getIdValue1(data, idField) ?? index, itemSize: itemSize, outerRef: refs, ref: listRef, style: style, onItemsRendered: onItemsRenderedLocal, ...rest, children: itemRendererLocal }));
|
|
198
200
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@etsoo/react",
|
|
3
|
-
"version": "1.8.
|
|
3
|
+
"version": "1.8.41",
|
|
4
4
|
"description": "TypeScript ReactJs UI Independent Framework",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/mjs/index.js",
|
|
@@ -40,12 +40,12 @@
|
|
|
40
40
|
"@emotion/css": "^11.13.5",
|
|
41
41
|
"@emotion/react": "^11.14.0",
|
|
42
42
|
"@emotion/styled": "^11.14.0",
|
|
43
|
-
"@etsoo/appscript": "^1.6.
|
|
43
|
+
"@etsoo/appscript": "^1.6.32",
|
|
44
44
|
"@etsoo/notificationbase": "^1.1.60",
|
|
45
|
-
"@etsoo/shared": "^1.2.
|
|
45
|
+
"@etsoo/shared": "^1.2.70",
|
|
46
46
|
"react": "^18.3.1",
|
|
47
47
|
"react-dom": "^18.3.1",
|
|
48
|
-
"react-router-dom": "^7.5.
|
|
48
|
+
"react-router-dom": "^7.5.3",
|
|
49
49
|
"react-window": "^1.8.11"
|
|
50
50
|
},
|
|
51
51
|
"overrides": {
|
|
@@ -54,19 +54,19 @@
|
|
|
54
54
|
"@emotion/react": "$@emotion/react"
|
|
55
55
|
},
|
|
56
56
|
"devDependencies": {
|
|
57
|
-
"@babel/cli": "^7.27.
|
|
58
|
-
"@babel/core": "^7.
|
|
59
|
-
"@babel/plugin-transform-runtime": "^7.
|
|
60
|
-
"@babel/preset-env": "^7.
|
|
61
|
-
"@babel/runtime-corejs3": "^7.27.
|
|
57
|
+
"@babel/cli": "^7.27.1",
|
|
58
|
+
"@babel/core": "^7.27.1",
|
|
59
|
+
"@babel/plugin-transform-runtime": "^7.27.1",
|
|
60
|
+
"@babel/preset-env": "^7.27.1",
|
|
61
|
+
"@babel/runtime-corejs3": "^7.27.1",
|
|
62
62
|
"@testing-library/jest-dom": "^6.6.3",
|
|
63
63
|
"@testing-library/react": "^16.3.0",
|
|
64
64
|
"@types/react": "^18.3.20",
|
|
65
|
-
"@types/react-dom": "^18.3.
|
|
65
|
+
"@types/react-dom": "^18.3.7",
|
|
66
66
|
"@types/react-window": "^1.8.8",
|
|
67
|
-
"@vitejs/plugin-react": "^4.4.
|
|
67
|
+
"@vitejs/plugin-react": "^4.4.1",
|
|
68
68
|
"jsdom": "^26.1.0",
|
|
69
69
|
"typescript": "^5.8.3",
|
|
70
|
-
"vitest": "^3.1.
|
|
70
|
+
"vitest": "^3.1.2"
|
|
71
71
|
}
|
|
72
72
|
}
|
|
@@ -419,12 +419,6 @@ export const ScrollerGrid = <T extends object>(props: ScrollerGridProps<T>) => {
|
|
|
419
419
|
|
|
420
420
|
React.useImperativeHandle(mRef, () => instance, [rows]);
|
|
421
421
|
|
|
422
|
-
React.useEffect(() => {
|
|
423
|
-
return () => {
|
|
424
|
-
refs.current.isMounted = false;
|
|
425
|
-
};
|
|
426
|
-
}, []);
|
|
427
|
-
|
|
428
422
|
// Force update to work with the new width and rowHeight
|
|
429
423
|
React.useEffect(() => {
|
|
430
424
|
ref.current?.resetAfterIndices({
|
|
@@ -440,12 +434,21 @@ export const ScrollerGrid = <T extends object>(props: ScrollerGridProps<T>) => {
|
|
|
440
434
|
// Row count
|
|
441
435
|
const rowCount = refs.current.hasNextPage ? rowLength + 1 : rowLength;
|
|
442
436
|
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
437
|
+
React.useEffect(() => {
|
|
438
|
+
// Auto load data when current page is 0
|
|
439
|
+
if (refs.current.queryPaging.currentPage === 0 && refs.current.autoLoad) {
|
|
440
|
+
const initItems =
|
|
441
|
+
onInitLoad == null ? undefined : onInitLoad(ref.current);
|
|
442
|
+
if (initItems) reset(initItems[1], initItems[0]);
|
|
443
|
+
else loadDataLocal();
|
|
444
|
+
}
|
|
445
|
+
}, [onInitLoad, loadDataLocal]);
|
|
446
|
+
|
|
447
|
+
React.useEffect(() => {
|
|
448
|
+
return () => {
|
|
449
|
+
refs.current.isMounted = false;
|
|
450
|
+
};
|
|
451
|
+
}, []);
|
|
449
452
|
|
|
450
453
|
// Layout
|
|
451
454
|
return (
|
|
@@ -297,14 +297,6 @@ export const ScrollerList = <T extends object>(props: ScrollerListProps<T>) => {
|
|
|
297
297
|
[]
|
|
298
298
|
);
|
|
299
299
|
|
|
300
|
-
// When layout ready
|
|
301
|
-
React.useEffect(() => {
|
|
302
|
-
// Return clear function
|
|
303
|
-
return () => {
|
|
304
|
-
stateRefs.current.isMounted = false;
|
|
305
|
-
};
|
|
306
|
-
}, []);
|
|
307
|
-
|
|
308
300
|
// Row count
|
|
309
301
|
const rowCount = rows.length;
|
|
310
302
|
|
|
@@ -324,16 +316,26 @@ export const ScrollerList = <T extends object>(props: ScrollerListProps<T>) => {
|
|
|
324
316
|
// Item count
|
|
325
317
|
const itemCount = stateRefs.current.hasNextPage ? rowCount + 1 : rowCount;
|
|
326
318
|
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
319
|
+
React.useEffect(() => {
|
|
320
|
+
// Auto load data when current page is 0
|
|
321
|
+
if (
|
|
322
|
+
stateRefs.current.queryPaging?.currentPage === 0 &&
|
|
323
|
+
stateRefs.current.autoLoad
|
|
324
|
+
) {
|
|
325
|
+
const initItems =
|
|
326
|
+
onInitLoad == null ? undefined : onInitLoad(listRef.current);
|
|
327
|
+
if (initItems) reset(initItems[1], initItems[0]);
|
|
328
|
+
else loadDataLocal();
|
|
329
|
+
}
|
|
330
|
+
}, [onInitLoad, loadDataLocal]);
|
|
331
|
+
|
|
332
|
+
// When layout ready
|
|
333
|
+
React.useEffect(() => {
|
|
334
|
+
// Return clear function
|
|
335
|
+
return () => {
|
|
336
|
+
stateRefs.current.isMounted = false;
|
|
337
|
+
};
|
|
338
|
+
}, []);
|
|
337
339
|
|
|
338
340
|
// Layout
|
|
339
341
|
return typeof itemSize === "function" ? (
|