microsoft · Vincent Baaij (vnbaaij) · Jul 21, 2026 · Jul 20, 2026 · Jul 20, 2026 · Jul 20, 2026
@@ -15,20 +15,20 @@
                     RowStyle="@rowStyle"
                     HeaderCellAsButtonWithMenu="true"
                     ColumnResizeLabels="@resizeLabels">
-        <TemplateColumn Tooltip="true" TooltipText="@(c => "Flag of " + c.Name)" Title="Rank" SortBy="@rankSort" Align="Align.Center" InitialSortDirection="SortDirection.Ascending" IsDefaultSortColumn=true>
+        <TemplateColumn Tooltip="true" TooltipText="@(c => "Flag of " + c.Name)" HeaderTooltip="Column options for rank" Title="Rank" SortBy="@rankSort" Align="Align.Center" InitialSortDirection="SortDirection.Ascending" IsDefaultSortColumn=true>
             <img class="flag" src="_content/FluentUI.Demo.Shared/flags/@(context.Code).svg" alt="Flag of @(context.Code)" />
         </TemplateColumn>
-        <PropertyColumn Property="@(c => c.Name)" Sortable="true" Filtered="!string.IsNullOrWhiteSpace(nameFilter)" Tooltip="true" Title="Name of the country">
+        <PropertyColumn Property="@(c => c.Name)" Sortable="true" Filtered="!string.IsNullOrWhiteSpace(nameFilter)" Tooltip="true" HeaderTooltip="Column options for country" Title="Name of the country">
             <ColumnOptions>
                 <div class="search-box">
                     <FluentSearch Autofocus=true @bind-Value=nameFilter @oninput="HandleCountryFilter" @onkeydown="HandleCloseFilterAsync" @bind-Value:after="HandleClear" Placeholder="Country name..." Style="width: 100%;" Label="Filter" />
                 </div>
             </ColumnOptions>
         </PropertyColumn>
-        <PropertyColumn Property="@(c => c.Medals.Gold)" Sortable="true" Align="Align.Start" Tooltip="true" TooltipText="@(c => "That is " + c.Medals.Gold + " x GOLD!!")" />
-        <PropertyColumn Property="@(c => c.Medals.Silver)" Sortable="true" Align="Align.Center" Tooltip="true" />
-        <PropertyColumn Property="@(c => c.Medals.Bronze)" Sortable="false" Align="Align.End" />
-        <PropertyColumn Property="@(c => c.Medals.Total)" Sortable="true" Filtered="@(minMedals != 0 || maxMedals != 130)" Align="Align.End" Tooltip="true">
+        <PropertyColumn Property="@(c => c.Medals.Gold)" Sortable="true" Align="Align.Start" Tooltip="true" TooltipText="@(c => "That is " + c.Medals.Gold + " x GOLD!!")" HeaderTooltip="Column options for gold" />
+        <PropertyColumn Property="@(c => c.Medals.Silver)" Sortable="true" Align="Align.Center" Tooltip="true" HeaderTooltip="Column options for silver" />
+        <PropertyColumn Property="@(c => c.Medals.Bronze)" Sortable="false" Align="Align.End" HeaderTooltip="Adjust column width for bronze" />
+        <PropertyColumn Property="@(c => c.Medals.Total)" Sortable="true" Filtered="@(minMedals != 0 || maxMedals != 130)" Align="Align.End" Tooltip="true" HeaderTooltip="Column options for total">
             <ColumnOptions>
                 <div style="width: 100%; height: 150px;">
                     <FluentSlider Label="@($"Min ({minMedals})")" Min="0" Max="150" Step="1" Orientation="Orientation.Horizontal" @bind-Value=minMedals Immediate="true" Style="width: 100%;">

@@ -25,18 +25,35 @@
         {
             @HeaderCellItemTemplate(this)
         }
-        else if (Grid.HeaderCellAsButtonWithMenu)
-        {
-            string? tooltip = Tooltip ? (HeaderTooltip ?? Title) : null;
-
-            <FluentKeyCode  Only="@(new[] { KeyCode.KeyR })"  OnKeyDown="HandleKeyDown" class="keycapture" style="width: 100%;" StopPropagation="true" @oncontextmenu="@(() => Grid.RemoveSortByColumnAsync(this))">
+            else if (Grid.HeaderCellAsButtonWithMenu)
+            {
+                string? tooltip = Tooltip ? (HeaderTooltip ?? Title) : null;
 
-                @if (AnyColumnActionEnabled)
+                // Ensure the accessible name (aria-label) is anchored to the visible Title
+                // and optionally prepend HeaderTooltip when it differs. Use HeaderTooltip
+                // as the mouse tooltip (Title attribute) when provided.
+                string? ariaLabel = null;
+                if (!string.IsNullOrEmpty(Title))
                 {
-                    <FluentButton Disabled="@(!AnyColumnActionEnabled)" Id="@_columnId" Appearance="Appearance.Stealth" Class="col-sort-button" Style="width: calc(100% - 10px);" @onclick="@HandleColumnHeaderClickedAsync" aria-label="@tooltip" title="@tooltip">
-                        <div class="col-title-text" title="@tooltip">
-                            @HeaderTitleContent
-                        </div>
+                    ariaLabel = Title;
+                    if (!string.IsNullOrEmpty(HeaderTooltip) && HeaderTooltip != Title)
+                    {
+                        ariaLabel = $"{HeaderTooltip} - {ariaLabel}";
+                    }
+                }
+                else
+                {
+                    ariaLabel = HeaderTooltip ?? tooltip;
+                }
+
+                <FluentKeyCode  Only="@(new[] { KeyCode.KeyR })"  OnKeyDown="HandleKeyDown" class="keycapture" style="width: 100%;" StopPropagation="true" @oncontextmenu="@(() => Grid.RemoveSortByColumnAsync(this))">
+
+                    @if (AnyColumnActionEnabled)
+                    {
+                    <FluentButton Disabled="@(!AnyColumnActionEnabled)" Id="@_columnId" Appearance="Appearance.Stealth" Class="col-sort-button" Style="width: calc(100% - 10px);" @onclick="@HandleColumnHeaderClickedAsync" aria-label="@ariaLabel" Title="@(HeaderTooltip ?? Title)" aria-haspopup="menu">
+                            <div class="col-title-text" title="@tooltip">
+                                @HeaderTitleContent
+                            </div>
 
                         @if (Grid.SortByAscending.HasValue && IsActiveSortColumn)
                         {

@@ -1019,7 +1019,7 @@ private async ValueTask<GridItemsProviderResult<TGridItem>> ResolveItemsRequestA
         return GridItemsProviderResult.From(Array.Empty<TGridItem>(), 0);
     }
 
-    private string AriaSortValue(ColumnBase<TGridItem> column)
+    private string? AriaSortValue(ColumnBase<TGridItem> column)
          => _sortByColumn == column
              ? (_sortByAscending ? "ascending" : "descending")
              : "none";

@@ -38,6 +38,10 @@ export async function initialize(anchorId, menuId, menuOpen, anchoredRegionModul
     // Dispose existing listeners if any
     dispose(anchorId);
 
+    if (anchorId && menuId) {
+        document.getElementById(anchorId)?.setAttribute("aria-expanded", menuOpen);
+    }
+
     if (!menuId || !menuOpen) {
         return;
     }

diff --git a/...d/DataGridSortByTests.DataGridSortByTests_SortByColumnIndex_Ascending.verified.razor.html b/...d/DataGridSortByTests.DataGridSortByTests_SortByColumnIndex_Ascending.verified.razor.html
@@ -14,7 +14,7 @@
           </span>
         </div>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Item2</div>

diff --git a/.../DataGridSortByTests.DataGridSortByTests_SortByColumnIndex_Descending.verified.razor.html b/.../DataGridSortByTests.DataGridSortByTests_SortByColumnIndex_Descending.verified.razor.html
@@ -14,7 +14,7 @@
           </span>
         </div>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Item2</div>

diff --git a/...d/DataGridSortByTests.DataGridSortByTests_SortByColumnTitle_Ascending.verified.razor.html b/...d/DataGridSortByTests.DataGridSortByTests_SortByColumnTitle_Ascending.verified.razor.html
@@ -14,7 +14,7 @@
           </span>
         </div>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Item2</div>

diff --git a/.../DataGridSortByTests.DataGridSortByTests_SortByColumnTitle_Descending.verified.razor.html b/.../DataGridSortByTests.DataGridSortByTests_SortByColumnTitle_Descending.verified.razor.html
@@ -14,7 +14,7 @@
           </span>
         </div>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="30" blazor:onclick="31" blazor:onfocus="32" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Item2</div>

diff --git a/...lectTests.FluentDataGrid_ColumSelect_MultiSelect_Customized_Rendering.verified.razor.html b/...lectTests.FluentDataGrid_ColumSelect_MultiSelect_Customized_Rendering.verified.razor.html
@@ -2,10 +2,10 @@
 <table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" b-ppmhrkw1mj="" blazor:elementreference="">
   <thead b-ppmhrkw1mj="">
     <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="3" blazor:onclick="4" blazor:ondblclick="5" blazor:onfocus="6" b-upi3f9mbnn="">
-      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" b-w6qdxfylwy="">
         <div style="cursor: pointer; margin-left: 12px;" blazor:onclick="26" blazor:onkeydown="27">➖</div>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="28" blazor:onclick="29" blazor:onfocus="30" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="28" blazor:onclick="29" blazor:onfocus="30" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Name</div>

diff --git a/...GridColumSelectTests.FluentDataGrid_ColumSelect_MultiSelect_Rendering.verified.razor.html b/...GridColumSelectTests.FluentDataGrid_ColumSelect_MultiSelect_Rendering.verified.razor.html
@@ -2,14 +2,14 @@
 <table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" b-ppmhrkw1mj="" blazor:elementreference="">
   <thead b-ppmhrkw1mj="">
     <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="3" blazor:onclick="4" blazor:ondblclick="5" blazor:onfocus="6" b-upi3f9mbnn="">
-      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" b-w6qdxfylwy="">
         <svg style="width: 20px; fill: var(--accent-fill-rest); cursor: pointer;" focusable="false" viewBox="0 0 20 20" aria-hidden="true" blazor:onclick="47" blazor:onkeydown="48">
           <title>Some rows are selected.</title>
           <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path>
           <path d="M6 3a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3H6ZM4.5 6c0-.83.67-1.5 1.5-1.5h8c.83 0 1.5.67 1.5 1.5v8c0 .83-.67 1.5-1.5 1.5H6A1.5 1.5 0 0 1 4.5 14V6ZM7 6a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H7Z"></path>
         </svg>
       </th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Name</div>

diff --git a/...ridColumSelectTests.FluentDataGrid_ColumSelect_SingleSelect_Rendering.verified.razor.html b/...ridColumSelectTests.FluentDataGrid_ColumSelect_SingleSelect_Rendering.verified.razor.html
@@ -2,8 +2,8 @@
 <table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" b-ppmhrkw1mj="" blazor:elementreference="">
   <thead b-ppmhrkw1mj="">
     <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="3" blazor:onclick="4" blazor:ondblclick="5" blazor:onfocus="6" b-upi3f9mbnn="">
-      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" aria-sort="none" b-w6qdxfylwy=""></th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" b-w6qdxfylwy=""></th>
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Name</div>

diff --git a/...umSelectTests.FluentDataGrid_ColumSelect_SingleStickySelect_Rendering.verified.razor.html b/...umSelectTests.FluentDataGrid_ColumSelect_SingleStickySelect_Rendering.verified.razor.html
@@ -2,8 +2,8 @@
 <table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 50px auto;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" b-ppmhrkw1mj="" blazor:elementreference="">
   <thead b-ppmhrkw1mj="">
     <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="3" blazor:onclick="4" blazor:ondblclick="5" blazor:onfocus="6" b-upi3f9mbnn="">
-      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" aria-sort="none" b-w6qdxfylwy=""></th>
-      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="1" class="column-header select-all col-justify-center" style="grid-column: 1; text-align: center; align-content: center; min-width: 50px; padding-top: calc(var(--design-unit) * 2.5px); height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" b-w6qdxfylwy=""></th>
+      <th col-index="2" class="column-header col-justify-start" style="grid-column: 2; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="26" blazor:onclick="27" blazor:onfocus="28" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Name</div>

diff --git a/tests/Core/DataGrid/FluentDataGridTests.FluentDataGrid_Default.verified.razor.html b/tests/Core/DataGrid/FluentDataGridTests.FluentDataGrid_Default.verified.razor.html
@@ -2,7 +2,7 @@
 <table id="xxx" class="fluent-data-grid grid" style="grid-template-columns: 1fr;" aria-rowcount="4" blazor:onclosecolumnoptions="1" blazor:onclosecolumnresize="2" b-ppmhrkw1mj="" blazor:elementreference="">
   <thead b-ppmhrkw1mj="">
     <tr class="fluent-data-grid-row" data-row-index="0" role="row" row-type="header" blazor:onkeydown="3" blazor:onclick="4" blazor:ondblclick="5" blazor:onfocus="6" b-upi3f9mbnn="">
-      <th col-index="1" class="column-header col-justify-start" style="grid-column: 1; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" aria-sort="none" b-w6qdxfylwy="">
+      <th col-index="1" class="column-header col-justify-start" style="grid-column: 1; min-width: 100px; height: 32px; min-height: 40px; z-index: 5;" blazor:oncontextmenu:preventdefault="" blazor:onkeydown="23" blazor:onclick="24" blazor:onfocus="25" scope="col" b-w6qdxfylwy="">
         <div style="display: flex; justify-content: flex-start;" b-pxhtqoo8qd="">
           <div class="col-title" style="width: calc(100% - 10px);" b-pxhtqoo8qd="">
             <div class="col-title-text" b-pxhtqoo8qd="">Name</div>