MudDataGridPager: Fix page-size select absorbing toolbar space

[danielchalmers]

Fixes #13580 — a v9.8.0 regression from #13573.

What happened

#13573 changed .mud-table-pagination-spacer from flex: 1 1 100% to flex: 1 1 auto. The 100% basis had over-subscribed the flex line, so flex-grow never ran on any toolbar child. With an auto basis there is positive free space on the line for the first time — and .mud-select carries flex-grow: 1 (_select.scss:3). The spacer and the select then split the slack and the select balloons.

MudDataGridPager renders <MudSelect> as a direct child of the toolbar, so it is affected. MudTablePager nests it in <div class="@PaginationClassname">, so it is not — which is exactly what the reporter noticed.

The change

One rule, scoped to direct children so MudTablePager cannot be reached:

.mud-table-pagination-toolbar {
  & > .mud-select {
    flex-grow: 0;
  }
}

flex-grow: 0 rather than flex: 0 0 auto: both measure byte-identical across every scenario below, including a 200px container, because the select is never the shrink target. The narrower statement leaves shrink alone.

Verification

Real compiled stylesheets from the v9.7.0 tag, the v9.8.0 tag, and v9.8.0 + this change, applied to pager DOM captured from dev.mudblazor.com, measured over CDP at --force-device-scale-factor=1.

Rows-per-page select outer width:

scenario	v9.7.0	v9.8.0	this PR
DataGrid, 1400px container	88px	532px	88px
DataGrid, 780px container	88px	226px	88px
DataGrid, 320px container	88px	102px	88px
DataGrid, 1400px, RightToLeft	96px	536px	96px
MudTable, 1400px (control)	88px	88px	88px

Toolbar height, nav-button inset from the end edge, and overflow are identical to v9.7.0 in every LTR and RTL case.

#13573's benefit is preserved. At a 320px container on a 700px viewport (narrow container, wide viewport — the max-width: 416px rule does not fire):

	v9.7.0	v9.8.0	this PR
nav buttons inside the container	0 of 4	4 of 4	4 of 4
drawn outside the container	183px	0px	0px
toolbar height	52px	69px	69px

Not addressed here

Both are pre-existing in v9.8.0 and unchanged by this PR:

• At a 200px container the toolbar still overflows by 13px.
• A wrapped second row places the nav buttons at the start of the line rather than the end (270px inset at a 380px viewport). This is the residual already noted when MudTablePager: Fix navigation icons displaying outside container when minimized #13573 landed.

Separately, .mud-select { flex-grow: 1 } applies to any MudSelect placed directly in a flex container, so this failure mode can recur wherever a flex parent gains free space.

Checklist:

• I've read the contribution guidelines
• My code follows the style of this project
• I've added or updated relevant unit tests — CSS-only; bUnit does not apply stylesheets, so this is covered by the measurements above rather than a test

[danielchalmers]

Each sheet is v9.7.0 / v9.8.0 / v9.8.0+fix stacked top to bottom. Blue outline = the rows-per-page select; red rings = nav buttons drawn outside the container.

1

2

3

4