Updated tanstack/react-virtual to 3.14.4 to add directDomUpdates

[dracofulmen]

Summary

Fixes: #4016

The Select component continuously rerenders in v15 while the scroll bar is not at the top. This makes the scroll bar flash continuously. This happens even with static options. I traced the bug to tanstack and submitted a fix there. However, @piecyk also suggested that I add directDomUpdates on this side. In order to do that, I also had to update the version of tanstack/react-virtual in the dependencies from 3.13.9 to 3.14.3. This option

Release Category

Dependencies, Components

---

Checklist

• MDX documentation adheres to Canvas Kit's Documentation Guidelines
• Label ready for review has been added to PR

For the Reviewer

• PR title is short and descriptive
• PR summary describes the change (Fixes/Resolves linked correctly)
• PR Release Notes describes additional information useful to call out in a release message or removed if not applicable
• Breaking Changes provides useful information to upgrade to this code or removed if not applicable

Where Should the Reviewer Start?

Summary by CodeRabbit

• Bug Fixes
  • Improved virtualized list scrolling and rendering by refining how DOM updates are applied during interaction for smoother visual updates.
• New Features
  • Menu cards now forward the menu model’s container reference to the underlying card element, enabling external access to the card container for programmatic use.
• Chores
  • Updated the React virtualization dependency to a newer version to enhance stability and compatibility.

[coderabbitai]

📝 Walkthrough

Walkthrough

The React collection list model now passes directDomUpdates: true to useVirtualizer, modules/react updates @tanstack/react-virtual to ^3.14.4, and MenuCard forwards its container ref to Card.

Changes

Select virtualizer update

Layer / File(s)	Summary
Virtualizer config and dependency bump modules/react/collection/lib/useBaseListModel.tsx, modules/react/package.json	The list model enables direct DOM updates in useVirtualizer, and the React virtualizer dependency is updated to ^3.14.4.
Menu container ref wiring modules/react/menu/lib/MenuCard.tsx	MenuCard passes model.state.containerRef to the rendered Card through its ref prop.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

I’m a bunny on the scroll-bar trail,
With direct DOM hops and a lighter sail.
🐰✨ The list now skims and the menu holds tight,
While flicker takes a slower flight.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check	✅ Passed	The changes address #4016 by enabling direct DOM updates and wiring the required container ref to stabilize Select scrolling.
Out of Scope Changes check	✅ Passed	All edits are directly tied to fixing the Select scrollbar flashing issue; no unrelated changes are present.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check	✅ Passed	The title accurately reflects the dependency bump and the directDomUpdates-related change in the PR.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@modules/react/package.json`:
- Line 53: The dependency bump in modules/react/package.json for
`@tanstack/react-virtual` is not reflected in the lockfile, so update the
yarn.lock entry for the `@tanstack/react-virtual` package to resolve ^3.14.3
instead of the older ^3.13.9 version. Make sure the lockfile entry matches the
new version used by the React package so the runtime can access
directDomUpdates, and verify the existing dependency key for
`@tanstack/react-virtual` is refreshed consistently.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 79da61f6-8736-42d3-a969-fef9288e2383

📥 Commits

Reviewing files that changed from the base of the PR and between 2362189 and b0fcb45.

📒 Files selected for processing (2)

• modules/react/collection/lib/useBaseListModel.tsx
• modules/react/package.json

[coderabbitai]

🗄️ Data Integrity & Integration | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Confirm the lockfile resolves 3.14.3 and check the registry host used.
rg -nP -C4 '`@tanstack/react-virtual`@' yarn.lock
# Surface any private-registry URLs that should not be committed.
rg -n '4873|10\.0\.0\.' yarn.lock .npmrc 2>/dev/null

Repository: Workday/canvas-kit

Length of output: 1474

---

Update yarn.lock for @tanstack/react-virtual

yarn.lock still resolves @tanstack/react-virtual@^3.13.9 to 3.13.9 from the public Yarn registry. The package bump in modules/react/package.json won’t take effect until the lockfile is refreshed to ^3.14.3; otherwise directDomUpdates won’t be available at runtime.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@modules/react/package.json` at line 53, The dependency bump in
modules/react/package.json for `@tanstack/react-virtual` is not reflected in the
lockfile, so update the yarn.lock entry for the `@tanstack/react-virtual` package
to resolve ^3.14.3 instead of the older ^3.13.9 version. Make sure the lockfile
entry matches the new version used by the React package so the runtime can
access directDomUpdates, and verify the existing dependency key for
`@tanstack/react-virtual` is refreshed consistently.

[dracofulmen]

I can't actually update the yarn.lock on my side because it would contaminate it with changes from my personal setup

[coderabbitai]

@dracofulmen, understood — thanks for clarifying.

That makes sense, and I wouldn’t want you to commit a polluted yarn.lock. The concern is still that this PR’s functional change depends on @tanstack/react-virtual actually resolving to 3.14.3; if the lockfile stays on 3.13.9, directDomUpdates may not be present at runtime.

Best path here is probably to have the lockfile refreshed from a clean/standard project environment by someone who can do that safely. If you want to keep that out of this PR, I can help open a follow-up issue for the lockfile update.

[dracofulmen]

I would hope that a reviewer would be able to generate the correct version of the new yarn.lock.

[coderabbitai]

@dracofulmen Fair point — I agree this is better handled from a clean reviewer/maintainer environment than from a local setup that would dirty yarn.lock.

The concern I raised is still about making sure the lockfile actually resolves the new @tanstack/react-virtual version, but I won’t push this back on you if you can’t generate it safely from your machine.

[dracofulmen]

In order to make this work fully, it requires doing ref={selectModel.state.containerRef} on Select.Card. However, I can't figure out how to get that into the library files rather than just doing it on the user side. If you don't add the ref, the card flashes into the top left while scrolling.

[dracofulmen]

I figured out how to get the ref working. I had to add it to MenuCard.tsx. However, I don't know which other things need it.