use onStaticRender in VirtualizedList

This commit is contained in:
jacob314
2026-05-06 15:25:18 -07:00
parent e3f1dba42d
commit 8f7d79afa0
4 changed files with 31 additions and 31 deletions
+5 -5
View File
@@ -11,7 +11,7 @@
"packages/*"
],
"dependencies": {
"ink": "npm:@jrichman/ink@7.0.0-beta.3",
"ink": "npm:@jrichman/ink@7.0.1-beta.0",
"latest-version": "^9.0.0",
"node-fetch-native": "^1.6.7",
"proper-lockfile": "^4.1.2",
@@ -10020,9 +10020,9 @@
},
"node_modules/ink": {
"name": "@jrichman/ink",
"version": "7.0.0-beta.3",
"resolved": "https://registry.npmjs.org/@jrichman/ink/-/ink-7.0.0-beta.3.tgz",
"integrity": "sha512-8qBJlbUg1HRfOtLlGo6NjGL+HwYrwkoyvLXOl6Ogzcf2l0n0hudiaPpD+0VFTCQX3o01Nm5bMr4zY5TXwEXvgA==",
"version": "7.0.1-beta.0",
"resolved": "https://registry.npmjs.org/@jrichman/ink/-/ink-7.0.1-beta.0.tgz",
"integrity": "sha512-vRzRMXNspq92OgikN2RTC0cpyErUn/OCQ97cAWikMEcy/dd8MZ/5SLisyZPL9t8Qt0LLIlY2WOB0cLkCj18qtQ==",
"license": "MIT",
"dependencies": {
"ansi-escapes": "^7.0.0",
@@ -18228,7 +18228,7 @@
"fzf": "^0.5.2",
"glob": "^12.0.0",
"highlight.js": "^11.11.1",
"ink": "npm:@jrichman/ink@7.0.0-beta.3",
"ink": "npm:@jrichman/ink@7.0.1-beta.0",
"ink-gradient": "^3.0.0",
"ink-spinner": "^5.0.0",
"latest-version": "^9.0.0",
+2 -2
View File
@@ -73,7 +73,7 @@
"pre-commit": "node scripts/pre-commit.js"
},
"overrides": {
"ink": "npm:@jrichman/ink@7.0.0-beta.3",
"ink": "npm:@jrichman/ink@7.0.1-beta.0",
"wrap-ansi": "9.0.2",
"cliui": {
"wrap-ansi": "7.0.0"
@@ -143,7 +143,7 @@
"yargs": "^17.7.2"
},
"dependencies": {
"ink": "npm:@jrichman/ink@7.0.0-beta.3",
"ink": "npm:@jrichman/ink@7.0.1-beta.0",
"latest-version": "^9.0.0",
"node-fetch-native": "^1.6.7",
"proper-lockfile": "^4.1.2",
+1 -1
View File
@@ -49,7 +49,7 @@
"fzf": "^0.5.2",
"glob": "^12.0.0",
"highlight.js": "^11.11.1",
"ink": "npm:@jrichman/ink@7.0.0-beta.3",
"ink": "npm:@jrichman/ink@7.0.1-beta.0",
"ink-gradient": "^3.0.0",
"ink-spinner": "^5.0.0",
"latest-version": "^9.0.0",
@@ -108,24 +108,6 @@ function findLastIndex<T>(
return -1;
}
const MemoizedStaticItem = memo(
({
content,
width,
itemKey,
}: {
content: React.ReactElement;
width: number;
itemKey: string;
}) => (
<StaticRender width={width} key={itemKey}>
{() => content}
</StaticRender>
),
);
MemoizedStaticItem.displayName = 'MemoizedStaticItem';
const VirtualizedListItem = memo(
({
content,
@@ -301,6 +283,22 @@ function VirtualizedList<T>(
prevContainerHeight: -1,
});
const onStaticRender = useCallback(
(index: number, key: string, node: DOMElement) => {
const height = Math.round(getBoundingBox(node).height);
if (
height > 0 &&
(state.current.measuredHeights[index] !== height ||
state.current.measuredKeys[index] !== key)
) {
state.current.measuredHeights[index] = height;
state.current.measuredKeys[index] = key;
setMeasurementVersion((v) => v + 1);
}
},
[],
);
const itemsObserver = useMemo(
() =>
new ResizeObserver((entries) => {
@@ -775,12 +773,13 @@ function VirtualizedList<T>(
if (shouldBeStatic) {
items.push(
<MemoizedStaticItem
key={`${key}-static`}
itemKey={`${key}-static-${typeof width === 'number' ? width : containerWidth}`}
<StaticRender
key={`${key}-static-${typeof width === 'number' ? width : containerWidth}`}
width={typeof width === 'number' ? width : containerWidth}
content={content}
/>,
onRender={(node: DOMElement) => onStaticRender(i, key, node)}
>
{() => content}
</StaticRender>,
);
} else {
items.push(
@@ -829,6 +828,7 @@ function VirtualizedList<T>(
onSetRef,
estimatedItemHeight,
temporarilyInteractiveIndexes,
onStaticRender,
]);
const { getScrollTop, setPendingScrollTop } = useBatchedScroll(scrollTop);