Following instructions at https://blazorui.bitplatform.dev to create *bit-empty* project with example grid at https://blazorui.bitplatform.dev/components/datagrid#example1 fails completely

[asimplebehr]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

The sample code found for BitDataGrid found at https://blazorui.bitplatform.dev/components/datagrid#example1 does not match what is in
<PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.5" />

Expected Behavior

To build and run sample grid, similar to https://blazorui.bitplatform.dev/components/datagrid#example1

Steps To Reproduce

Based on setup instructions found at https://blazorui.bitplatform.dev

dotnet new bit-empty -n BitBlazorEmptyApp
dotnet add package Bit.BlazorUI.Extras
dotnet add package Bit.BlazorUI.Assets
dotnet add package Bit.BlazorUI.Icons

csproj:

<!-- Generated by bit-empty template v-10.4.5 -->

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net10.0</TargetFramework>
    <Nullable>enable</Nullable>
    <ImplicitUsings>enable</ImplicitUsings>
  </PropertyGroup>


  <ItemGroup>
    <PackageReference Include="Bit.BlazorUI" Version="10.4.5" />
    <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.5" />
    <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.5" />
    <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.5" />

    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.5">
        <PrivateAssets>all</PrivateAssets>
        <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
    </PackageReference>

    <PackageReference Include="Bit.SourceGenerators" Version="10.4.5">
        <PrivateAssets>all</PrivateAssets>
        <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
    </PackageReference>

    <Using Include="Bit.BlazorUI" />
  </ItemGroup>
</Project>

dotnet run is fine at this point

using https://blazorui.bitplatform.dev/components/datagrid#example1 to update Home page

<BitDataGrid TItem="Product" Items="@products" Height="430px" MultiSort="true">
    <BitDataGridColumn TItem="Product" Field="Id" Title="ID" Width="70px" Align="BitDataGridColumnAlign.Right" />
    <BitDataGridColumn TItem="Product" Field="Name" Width="220px" />
    <BitDataGridColumn TItem="Product" Field="Category" />
    <BitDataGridColumn TItem="Product" Field="Price" Format="C2" Align="BitDataGridColumnAlign.Right" />
    <BitDataGridColumn TItem="Product" Field="Stock" Align="BitDataGridColumnAlign.Right" />
    <BitDataGridColumn TItem="Product" Field="Rating" Format="N1" Align="BitDataGridColumnAlign.Right" />
</BitDataGrid>

// rest of code omitted

dotnet build

Restore complete (0.4s)
  BitBlazorEmptyApp net10.0 failed with 1 error(s) and 9 warning(s) (3.0s)
    BitBlazorEmptyApp\Components\Pages\Home.razor(7,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\Components\Pages\Home.razor(8,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\Components\Pages\Home.razor(9,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\Components\Pages\Home.razor(10,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\Components\Pages\Home.razor(11,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\Components\Pages\Home.razor(12,9): warning RZ10012: Found markup element with unexpected name 'BitDataGridColumn'. If this is intended to be a component, add a @using directive for its namespace.
    BitBlazorEmptyApp\obj\Debug\net10.0\Microsoft.CodeAnalysis.Razor.Compiler\Microsoft.NET.Sdk.Razor.SourceGenerators.RazorSourceGenerator\Components\Pages\Home_razor.g.cs(108,88): error CS0411: The type arguments for method 'TypeInference.CreateBitDataGrid_0_CaptureParameters<TGridItem>(object, out object, IQueryable<TGridItem>, out IQueryable<TGridItem>, object, out object, object, out object)' cannot be inferred from the usage. Try specifying the type arguments explicitly.
    BitBlazorEmptyApp\Components\Pages\Home.razor(30,16): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset
    BitBlazorEmptyApp\Components\Pages\Home.razor(49,13): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset
    BitBlazorEmptyApp\Components\Pages\Home.razor(49,37): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset

Finally got this to build, based on intellisense:

    <BitDataGrid TGridItem="Product" Items="@products.AsQueryable()" >
        <BitDataGridPropertyColumn Property="p => p.Id" Title="ID"    Align="BitDataGridAlign.Right"/>
        <BitDataGridPropertyColumn Property="p => p.Name"/>
        <BitDataGridPropertyColumn Property="p => p.Category"/>
        <BitDataGridPropertyColumn Property="p => p.Price" Format="C2" Align="BitDataGridAlign.Right"/>
        <BitDataGridPropertyColumn Property="p => p.Stock" Align="BitDataGridAlign.Right"/>
        <BitDataGridPropertyColumn Property="p => p.Rating" Format="N1" Align="BitDataGridAlign.Right"/>
    </BitDataGrid>

Exceptions (if any)

dotnet run

Using launch settings from \BitBlazorEmptyApp\Properties\launchSettings.json...
Building...
BitBlazorEmptyApp\Components\Pages\Home.razor(30,16): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset
BitBlazorEmptyApp\Components\Pages\Home.razor(49,13): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset
BitBlazorEmptyApp\Components\Pages\Home.razor(49,37): warning DateTimeOffsetInsteadOfDateTimeAnalyzer: Replace DateTime usage with DateTimeOffset
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5126
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: D:\research\bitplatform\sandbox\BitBlazorEmptyApp
warn: Microsoft.AspNetCore.Components.Server.Circuits.RemoteRenderer[100]
      Unhandled exception rendering component: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

      Microsoft.JSInterop.JSException: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, JSCallType callType, Object[] args)
         at Bit.BlazorUI.BitDataGridJsRuntimeExtensions.BitDataGridInit(IJSRuntime jsRuntime, ElementReference tableElement)
         at Bit.BlazorUI.BitDataGrid`1.OnAfterRenderAsync(Boolean firstRender)
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
fail: Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost[111]
      Unhandled exception in circuit 'I-al74ZUuuQP9XkcvdfFgk8R8ceNcZXW4Q0-MJZ8BOo'.
      Microsoft.JSInterop.JSException: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, JSCallType callType, Object[] args)
         at Bit.BlazorUI.BitDataGridJsRuntimeExtensions.BitDataGridInit(IJSRuntime jsRuntime, ElementReference tableElement)
         at Bit.BlazorUI.BitDataGrid`1.OnAfterRenderAsync(Boolean firstRender)
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
warn: Microsoft.AspNetCore.Components.Server.Circuits.RemoteRenderer[100]
      Unhandled exception rendering component: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

      Microsoft.JSInterop.JSException: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

Using Firefox for viewing.

Console

[2026-07-06T19:09:54.182Z] Information: Normalizing '_blazor' to 'http://localhost:5126/_blazor'. blazor.web.js:1:50588
[2026-07-06T19:09:54.214Z] Information: WebSocket connected to ws://localhost:5126/_blazor?id=5720EoqRpzIsM4BAzB-Hlg. blazor.web.js:1:50588
[2026-07-06T19:09:54.250Z] Error: Microsoft.JSInterop.JSException: Could not find 'BitBlazorUI.DataGrid.init' ('DataGrid' was undefined).
E@http://localhost:5126/_framework/blazor.web.js:1:6748
resolveInvocationHandler@http://localhost:5126/_framework/blazor.web.js:1:380
S@http://localhost:5126/_framework/blazor.web.js:1:6447
processJSCall@http://localhost:5126/_framework/blazor.web.js:1:4440
beginInvokeJSFromDotNet@http://localhost:5126/_framework/blazor.web.js:1:4125
_invokeClientMethod@http://localhost:5126/_framework/blazor.web.js:1:69241
_processIncomingData@http://localhost:5126/_framework/blazor.web.js:1:66606
kn/this.connection.onreceive@http://localhost:5126/_framework/blazor.web.js:1:60257
connect/</i.onmessage@http://localhost:5126/_framework/blazor.web.js:1:84315

   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, JSCallType callType, Object[] args)
   at Bit.BlazorUI.BitDataGridJsRuntimeExtensions.BitDataGridInit(IJSRuntime jsRuntime, ElementReference tableElement)
   at Bit.BlazorUI.BitDataGrid`1.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

.NET Version

10.0.301

Anything else?

Don't know if this is a bug or an issue, seems to be a bit of both.

windows 11 - latest

[msynk]

Unfortunately, we rushed to release the demo website before publishing the new version of our packages. It will be resolved by deploying the new stable release.