[docs][combobox] Add a @tanstack/react-query demo

[mj12albert]

Preview: https://deploy-preview-3855--base-ui.netlify.app/react/components/combobox#infinite-scroll

Also added an experiment hooked up to a real API (openlibrary.org): https://deploy-preview-3855--base-ui.netlify.app/experiments/combobox/tanstack-infinite-query

Closes #3719

• I have followed (at least) the PR section of the contributing guide.

[pkg-pr-new]

• base-ui-tanstack-start

• vite-css-base-ui-example

  pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/react@3855
  

  pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/utils@3855
  

commit: cac78c2

[mui-bot]

Bundle size report

Bundle	Parsed size	Gzip size
@base-ui/react	0B(0.00%)	0B(0.00%)

Details of bundle changes

---

Check out the code infra dashboard for more information about this PR.

[netlify]

✅ Deploy Preview for base-ui ready!

Name	Link
🔨 Latest commit	cac78c2
🔍 Latest deploy log	https://app.netlify.com/projects/base-ui/deploys/69bd5d3ab846f50008b5b46b
😎 Deploy Preview	https://deploy-preview-3855--base-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[atomiks]

Couple things:

• It's not super obvious in the example how to see infinite scroll behavior. You have to type a short string e.g. "a" instead of "Aliens" to see it load more items when reaching the bottom
• Shouldn't it try to fetch more eagerly (well before the bottom) so there isn't a noticeable delay? Infinite scroll feeds usually avoid reaching the bottom

[mj12albert]

• It's not super obvious in the example how to see infinite scroll behavior. You have to type a short string e.g. "a" instead of "Aliens" to see it load more items when reaching the bottom
• Shouldn't it try to fetch more eagerly (well before the bottom) so there isn't a noticeable delay? Infinite scroll feeds usually avoid reaching the bottom

👌 updated the placeholder text and changed the "fetch next page" threshold to be approx 10 items from the end

[aarongarciah]

I just merged #4384 and now we use a new font. From now on, we'll only use 400 or 700 weights for all of the docs shell and demos.

[mj12albert]

@aarongarciah I've fixed the fonts, are you good wit hthe UX of this? 😬

[aarongarciah]

• When there's a selected movie and you add some more text, the no matches text is displayed but the selected movie is still visible. I think the selected movie should be hidden when it doesn't match the query. Same as we do in non-async comboboxes e.g. the hero demo.

  Kapture.2026-03-20.at.17.49.33.mp4

• Q: I added "Jaws 2" to the list of movies locally. I selected "Jaws". I opened the popup again and I only see "Jaws". Since "Jaws 2" matches the query, should it be listed? Or is it intended that only the selected movie is displayed when opening the popup due to the async nature of the search?
  

• When overscrolling the list (I'm using macOS), you can see past the popover at the bottom. This also happens in other existing demos like Async search (single) and Async search (multiple).

  Kapture.2026-03-20.at.17.28.13.mp4

• Although I understand the "e.g. The" placeholder is there to help users see more results, I think it's not very realistic. Not sure what to put there if we don't use a real API that returns way more results with "regular" words.

• Ideally writing "the" should display movies starting with "the" first. It'd feel more realistic, although it'd make the demo more complex.

• Do we want to avoid querying openlibrary.org? I'm wondering if it'd simplify the demo and return way more results, at the cost of using a 3rd party API (network latency, external dependency, etc.). I'm not sure about the team's preference so take this comment with a pinch of salt.

[colmtuite]

Closing this for now just to avoid crossed wires. Will likely reopen it in a couple months.