Blazor no grid layout found exception

Question

I want to make a simple grid layout with blazor. 2 columns 3 rows. Here I have given the necessary values for the layout, column and row as parameters. when I test the project, it cannot find the grid structure. All items are listed below. When I look at the layout page with F12, it says "No grid layouts found on this page". How should I go about solving this? the codes of my index.razor page where I want to display my items: `

@page "/"
@using OnMuhasebe.Blazor.Core.Components.Dev.Layouts
<DevGridLayout ColumnSpacing="3px"
               RowSpacing="3px"
               RowCount=3
               ColumnCount=3
               RowHeights="@(new[]{"28","28","28"})"
               ColumnWidths="@(new[]{"60%","33%","*"})">

    <GridLayoutItems>
       <DxGridLayoutItem Row="0" Column="0">
           <Template>
               <DxTextBox Text="0-0"></DxTextBox>
           </Template>
       </DxGridLayoutItem>


        <DxGridLayoutItem Row="0" Column="1">
            <Template>
                <DxTextBox Text="0-1"></DxTextBox>
            </Template>
        </DxGridLayoutItem>

        <DxGridLayoutItem Row="0" Column="2">
            <Template>
                <DxTextBox Text="0-2"></DxTextBox>
            </Template>
        </DxGridLayoutItem>

        <DxGridLayoutItem Row="1" Column="0">
            <Template>
                <DxTextBox Text="1-0"></DxTextBox>
            </Template>
        </DxGridLayoutItem>


        <DxGridLayoutItem Row="1" Column="1">
            <Template>
                <DxTextBox Text="1-1"></DxTextBox>
            </Template>
        </DxGridLayoutItem>

        <DxGridLayoutItem Row="1" Column="2">
            <Template>
                <DxTextBox Text="1-2"></DxTextBox>
            </Template>
        </DxGridLayoutItem>

    </GridLayoutItems>

</DevGridLayout>

`

Codes of Dev GridLayout.razor component with parameters: `

<DxGridLayout ColumnSpacing="@ColumnSpacing" RowSpacing="@RowSpacing">
    <Rows>
        @for (int i = 0; i < RowCount; i++)
        {
            if (RowHeights == null)
            {
                <DxGridLayoutRow Height="@DefaultRowHeight" />
            }
            else if (i < RowHeights.Length)
           
            {
                <DxGridLayoutRow Height="@RowHeights[i]" />
            }
            else
            {
                <DxGridLayoutRow Height="@DefaultRowHeight" />
            }
        }
    </Rows>

    <Columns>
        @for (int i = 0; i < ColumnCount; i++)
        {
            if (ColumnWidths == null)
            {
                <DxGridLayoutColumn Width="*" />
           }
            else if (i < ColumnWidths.Length)
            {
                <DxGridLayoutColumn Width="@ColumnWidths[i]" />
            }
            else
            {
                <DxGridLayoutColumn Width="@ColumnWidths[^1]" />
            }
        }
    </Columns>

    <Items>
        @GridLayoutItems
    </Items>
</DxGridLayout>


@code {
    [Parameter] public string ColumnSpacing { get; set; }
    [Parameter] public string RowSpacing { get; set; }
    [Parameter] public int RowCount { get; set; }
    [Parameter] public int ColumnCount { get; set; }
    [Parameter] public string[] RowHeights { get; set; }
    [Parameter] public string[] ColumnWidths { get; set; }
    [Parameter] public string DefaultRowHeight { get; set; } = "28";
    [Parameter] public RenderFragment GridLayoutItems { get; set; }
}

`

I wanted to create a grid layout consisting of 2 columns and 3 rows using blazor and devexpress components. when I tested the project, it did not run the grid layout structure. All items are listed below. Screen output is below; Screenshot