<DiagramShapes>
    @foreach (Node node in Nodes)
    {
        <DiagramShape Id="@node.LinkID" >
            <DiagramShapeContent Text="@node.GetDisplayName()" />
            <DiagramShapeFill Color="@node.GetColor()"/>
        </DiagramShape>
    }
</DiagramShapes>

async Task OnPersonClick(DiagramShapeClickEventArgs Args)
{
    foreach (Node node in Nodes)
    {
        if (node.LinkID.Equals(Args.Id))
            node.State = SelectedState.True;
        else
            node.State = SelectedState.False;
    }
}

<GridColumn Field=@nameof(BookingEquipmentCommodityModel.ItemCount) Title="Count" Width="1.5rem" />

                                <GridColumn Field=@nameof(BookingEquipmentCommodityModel.CommodityWeight) Editable="true" Title="Weight" Width="3rem">
                                    <Template Context="cwContext">
                                        @{
                                            var cw = (BookingEquipmentCommodityModel)cwContext;
                                        }
                                        <TelerikNumericTextBox @bind-Value="@cw.CommodityWeight" Arrows="false"></TelerikNumericTextBox>
                                    </Template>
                                </GridColumn>

    private async Task OnBookingGridRead(GridReadEventArgs args)
    {
            // Are any filters selected, if so we need to work from the filtered List
            if (args.Request.Filters.Count > 0)
            {

                await TrimFilters(args.Request.Filters);

    // Removes white space (aka Trim) on any filter input 
    private Task TrimFilters(IList<IFilterDescriptor> filters)
    {
        // Cycle the filters and trim Values
        foreach (var filterDescriptor in filters)
        {
            switch (filterDescriptor)
            {
                case FilterDescriptor singleFilterDescriptor:
                    // Only one filter
                    singleFilterDescriptor.Value = singleFilterDescriptor.Value.ToString()?.Trim();
                    break;
                case CompositeFilterDescriptor compositeFilter:
                {
                    foreach (var subFilter in compositeFilter.FilterDescriptors)
                    {
                        if (subFilter is FilterDescriptor singleSubFilter)
                        {
                            singleSubFilter.Value = singleSubFilter.Value.ToString()?.Trim();
                        }
                    }

                    break;
                }
            }
        }

        return Task.CompletedTask;
    }

public static string GetGridColumnStateJsonScaled<T>(TelerikGrid<T> grid)
{
    var gridTotalWidth = grid.GetState().TableWidth;
    var states = grid.GetState().ColumnStates;
    if (gridTotalWidth.EndsWith("px"))
    {
        var gridWidthPx = decimal.Parse(gridTotalWidth, CultureInfo.InvariantCulture);
        if (gridWidthPx != 0)
        {
            foreach (var state in states.Where(_ => _.Width.EndsWith("px")))
            {
                var colWidthpx = decimal.Parse(state.Width, CultureInfo.InvariantCulture);
                var ratio = Math.Round(colWidthpx * 100 / gridWidthPx, 3);
                state.Width = ratio.ToString(CultureInfo.InvariantCulture) + "%";
            }
        }
    }
    var json = JsonSerializer.Serialize<ICollection<GridColumnState>>(states);
    return json;
}

                <TelerikTreeList @ref=@TreeListTargetRef
                                 Data="@TargetGroups"
                                 SelectedItems="@SelectedTargetGroups"
                                 IdField="@nameof(Group.Id)"
                                 ParentIdField="@nameof(Group.ParentId)"
                                 Pageable="true"
                                 PageSize="10"
                                 Sortable="false"
                                 SelectionMode="TreeListSelectionMode.Single"
                                 FilterMode="@TreeListFilterMode.FilterMenu"
                                 OnStateInit="((TreeListStateEventArgs<Group> args) => OnStateInitHandlerTarget(args))"
                                 SelectedItemsChanged="((IEnumerable<Group> x) => OnTargetGroupSelected(x))">
                    <TreeListSettings>
                        <TreeListPagerSettings InputType="PagerInputType.Input"
                                               Adaptive="true">
                        </TreeListPagerSettings>
                    </TreeListSettings>

                    <TreeListColumns>
                        <TreeListCheckboxColumn SelectAll="false"
                                                SelectChildren="false"
                                                CheckBoxOnlySelection="true"
                                                Width="64px" />

                        <TreeListColumn Field="Name" Title="Name" Expandable="true">
                            <Template>
                                @{
                                    var item = context as Gsi.Customer.Models.Group;
                                    <img height="32" width="32" src="@item.ImageUrl" />
                                    @item.Name
                                }
                            </Template>
                        </TreeListColumn>
                    </TreeListColumns>
                </TelerikTreeList>