Skip to content

[internal] Make grid list navigation tree-shakeable#4944

Open
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/list-navigation-grid-treeshake
Open

[internal] Make grid list navigation tree-shakeable#4944
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/list-navigation-grid-treeshake

Conversation

@atomiks
Copy link
Copy Markdown
Contributor

@atomiks atomiks commented May 29, 2026

This removes grid navigation code from non-grid useListNavigation consumers. Grid-capable consumers pass the grid handler in the grid option, so menu, context menu, and select can tree-shake the grid path out while combobox/autocomplete keep grid behavior.

Changes

  • Moved the existing grid navigation branch into gridNavigation.ts.
  • Let grid-capable consumers pass the grid handler through the grid option.
  • Removed the cols option from useListNavigation.
  • Kept the copied Floating UI grid fixtures on explicit test-only column counts.

Bundle size

Measured with pnpm size:snapshot.

Entrypoint Parsed Gzip
@base-ui/react/select -3,268 B -1,204 B
@base-ui/react/context-menu -3,281 B -1,205 B
@base-ui/react/menu -3,268 B -1,204 B
@base-ui/react/autocomplete +74 B +37 B
@base-ui/react/combobox +76 B +41 B
@base-ui/react +83 B +8 B

@atomiks atomiks added the internal Behind-the-scenes enhancement. Formerly called “core”. label May 29, 2026 — with ChatGPT Codex Connector
@atomiks atomiks changed the title [floating-ui] Make grid list navigation tree-shakeable [internal] Make grid list navigation tree-shakeable May 29, 2026
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 29, 2026

commit: 2d2d4ed

@code-infra-dashboard
Copy link
Copy Markdown

code-infra-dashboard Bot commented May 29, 2026

Bundle size

Bundle Parsed size Gzip size
@base-ui/react 🔺+37B(+0.01%) ▼-8B(-0.01%)

Details of bundle changes

Performance

Total duration: 1,325.32 ms -62.38 ms(-4.5%) | Renders: 50 (+0) | Paint: 2,012.71 ms -85.13 ms(-4.1%)

No significant changes — details


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

@netlify
Copy link
Copy Markdown

netlify Bot commented May 29, 2026

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit 2d2d4ed
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a1cc0f241857100080f0f27
😎 Deploy Preview https://deploy-preview-4944--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

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

@atomiks atomiks force-pushed the codex/list-navigation-grid-treeshake branch 5 times, most recently from 369c190 to 6c0f5de Compare May 31, 2026 23:10
`useListNavigation`'s grid path (`cols > 1`) statically imported the grid
helpers (`createGridCellMap`/`getGridNavigatedIndex`/`getGridCellIndexOfCorner`/
`getGridCellIndices`), so every list consumer bundled ~1.2 KB gzip of grid code.
The only consumer that ever enables grid is `AriaCombobox` (combobox/autocomplete
in grid mode); menu, context-menu, and select are 1-D lists that never reach it.

Extract the grid branch into `hooks/gridNavigation.ts` and inject it via an
optional `gridNavigation` prop that only grid-capable consumers supply. Non-grid
consumers no longer reference the grid helpers, so they tree-shake out:

- menu        -1177 B gz
- context-menu -1175 B gz
- select      -1152 B gz
- combobox       +79 B gz (keeps grid; module-boundary cost)
- autocomplete   +70 B gz (keeps grid; module-boundary cost)

Net -3355 B gz across the popup family. Behavior is unchanged; the grid test
fixtures and `useListNavigation` grid tests now inject `gridNavigation` exactly
as `AriaCombobox` does.
@atomiks atomiks force-pushed the codex/list-navigation-grid-treeshake branch from 6c0f5de to 2d2d4ed Compare May 31, 2026 23:14
@atomiks atomiks marked this pull request as ready for review May 31, 2026 23:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

internal Behind-the-scenes enhancement. Formerly called “core”.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant