fix: MultiLine=True causing PropertyColumn Header's ColumnOptions to display inline vs appear as hover in FluentDataGrid

[JD2005L]

🐛 Bug Report

When MultiLine="true", column filter displays as inline instead of as a hover effect. With this option false, it displays as normal (however is being visually clipped by next header cell, needs z-index adjustment).

💻 Repro or Code Sample

<FluentDataGrid MultiLine="true" RowSize="DataGridRowSize.Small" Virtualize="true" TGridItem="AuditLog" Style="height:100%; width:100%" Items="@filteredAuditLogs.AsQueryable()" GridTemplateColumns="1fr 1fr 1fr 1.5fr 1.5fr 3fr 1.5fr" HeaderCellAsButtonWithMenu="true"> <PropertyColumn Title="User" Sortable="true" Property="x => x.Username"> <ColumnOptions> <select @bind="@(filters["UserFilter"])" @bind:event="onchange" @bind:after="ApplyFilters" style="width: 100%;"> <option value="">All</option> @foreach (var user in distinctUsers) { <option value="@user">@user</option> } </select> </ColumnOptions> </PropertyColumn>

🤔 Expected Behavior

Removed multiline-text style from th in devtools:

😯 Current Behavior

💁 Possible Solution

Exclude multiline-text class from header row. Z-index should also be set to appear above header cells, as currently being visually clipped. I implemented the following CSS to take care of the problem in the interim:

th.multiline-text:has(> div.col-options) {
overflow: initial !important;
z-index: 9999 !important;
}

🌍 Your Environment

• Fluent UI Blazor library Version 4.11.0

[vnbaaij]

Duplicate. Already fixed with PR #3118.