Goal

Our application needs to allow end users to dynamically customize the Telerik Blazor DockManager at runtime by:

• Adding new panels
• Removing existing panels
• Rearranging and resizing panels

These changes should be fully user-driven and persisted so that:

• The layout is restored when the user returns
• The layout is consistent across browsers and devices

In short, we want the DockManager to behave as a customizable dashboard whose state can be reliably stored and reloaded from our database.

Problem

The current Telerik Blazor DockManager implementation requires panels to be declared in Razor markup (markup driven) and managed through an external data source.

This creates several challenges:

• The component state (DockState) is tightly coupled to the initial panel definitions.
• Dynamically adding or removing panels from the data source conflicts with the internal DockState.
• To synchronize changes, we must manually manipulate the DockState object using custom code.
• This manipulation relies on internal behavior that is not formally supported and may break in future Telerik releases.

As a result, implementing a truly dynamic and persistent DockManager layout requires complex workarounds that are fragile and difficult to maintain.

Feature Request

We propose enhancing the DockManager with first-class support for dynamic panel synchronization by introducing:

Two coordinated parameters:

• Data – the collection of panels
• DockState – the persisted layout information

Expected behavior:

• If the Data collection contains a panel that is not present in the DockState, the component should automatically:
  • Add the new panel to the layout
  • Place it at the end of the current structure (bottom or right, depending on layout)
  • Update the DockState accordingly
• If the DockState contains a panel that is no longer present in the Data collection, the component should automatically:
  • Remove that panel from the layout
  • Update the DockState accordingly

This would allow developers to treat the DockManager as a true data-driven component, similar to other Telerik Blazor controls, without needing to manually modify internal state structures.

Please add support for protected worksheets and protected workbooks.

The value in a numeric textbox cannot be changed for negative numerbes unless you erase all the text and restart.

Hello,

We want the grid column chooser to have a search bar for the user to search what column they need to add/remove to the grid.
We use many non-visible columns in our grid and allow the user to customize what they want to see via the column chooser.  
However, since the user cannot search the available columns they have to scroll with their mouse through a large list to find what they want.
(Notice the scroll bar in the following screenshot)

Thank you

Current limitation: When DiagramShapeDefaultsEditable.Connect="true", users can draw connections between shapes, but there is no event fired when a new connection is created by the user.
Requested feature: Add OnConnectionCreated event that:

• Fires when user creates a new connection by dragging from one shape to another
• Returns event arguments containing:
  • FromShapeId — the source shape identifier
  • ToShapeId — the target shape identifier
  • Connection — reference to the newly created connection object (or its properties)
• Allows developers to intercept, validate, or customize the connection before it's finalized

Use case: We need to capture user-created connections to persist them to database, validate business rules (e.g., prevent circular dependencies), and set connection properties (type, label, color) based on context.

Description

When clicking a Grid row and the Grid is in GridDataLayoutMode.Stacked mode, the RowClick event fires twice.

Steps To Reproduce

1. Run this example: https://blazorrepl.telerik.com/QgkmvDvQ296Ea3Ij28
2. Click a row in the Grid

Actual Behavior

The RowClick event fires twice.

Expected Behavior

The RowClick event fires once.

Browser

All

Last working version of Telerik UI for Blazor (if regression)

No response

Description

During vertical resizing, a tile's size can get extremely large. Reproduced only in Firefox (tested with version 147). See the attached video.

Steps To Reproduce

1. Run this example: https://blazorrepl.telerik.com/QqkQPVbQ10VEaYKw23
2. Resize the San Francisco tile to span the whole first row.
3. Click on its bottom handle and drag down to resize it.
4. Repeat step 3. and resize the tile making it higher or shorter a few times.

Actual Behavior

The tile will auto-resize to an unexpectedly large height.

Expected Behavior

The tile should resize predictably.

Browser

All, Firefox

Last working version of Telerik UI for Blazor (if regression)

No response

The following KB article shows a workaround for removing the Grid aggregate labels ("Sum" and "Count") from the exported Excel document: https://www.telerik.com/blazor-ui/documentation/knowledge-base/grid-remove-aggregate-labels-in-excel-footr

It would be nice to have this option as a parameter in the Grid. It would allow to toggle on/off this behavior, instead of having to rely on custom code to work around it. 

Or in the OnBeforeExport method, add extra data to GridBeforeExcelExportEventArgs that contains the aggregates so they can be changed.

 private async Task OnBeforeExcelExport(GridBeforeExcelExportEventArgs args)
 {
     await Task.CompletedTask;

     // Loop through all columns and fix the footer aggregate values
     // Replace the default "Sum: 1234.56" text with just the decimal number
     foreach (var column in args.Columns)
     {
         if (column.HasAggregate)
         {
             // Set the number format for the column so Excel treats it as a number
             column.Aggregate.Field.Value == "MyNewValue";
         }
     }
 }

Please expose the chunk upload settings in the FileManager Upload component through FileManagerUploadSettings.

===

TELERIK EDIT:

In the meantime, a possible workaround is to:

• Remove the built-in FileManagerToolBarUploadTool from the FileManager toolbar.
• Use a custom tool that works with a standalone Upload with enabled chunk uploading.
• If necessary, override the styling of the standalone Upload component, so that it looks like a Button. Or, use the standalone Upload component in a Window, as the FileManager does.

Draft feature request (copy/paste)

Title: Add per-column value converters (WPF-style) to Telerik Blazor Grid columns

Product: UI for Blazor → Grid
Type: Feature Request

Description:
In Telerik UI for WPF, grid column definitions can reference a converter by name (e.g., IValueConverter) to transform values for display without writing a custom cell template for each column.

In Telerik UI for Blazor Grid, templates are currently the primary way to change how values render in a column (which works, but becomes repetitive across many columns/grids).

Request:
Add a column-level conversion API that allows specifying a converter/formatter function for display (and optionally editing). Example concepts:

• Converter="nameof(MyConverters.StatusToText)"

• or DisplayConverter="(item) => …" / ValueFormatter="Func<TItem, object, string>"

• optionally ConvertBack-like support for editing scenarios (or separate EditConverter)

Why this is needed:

• Reduces repeated <Template> markup for simple formatting/transformations

• Centralizes formatting/conversion logic in reusable code

• Improves maintainability and consistency across grids

• Eases migration for teams coming from Telerik WPF where converters are a common pattern

Use cases:

• Enum/int → user-friendly text

• Boolean → “Yes/No”, icons, badges

• Null/empty → placeholder text

• Code → display name (via lookup)

• Domain-specific formatting shared across many grids

Workarounds today:

• Column <Template> or computed properties (both valid, but not as concise/reusable for large grids)

• Extracting RenderFragments can reduce repetition, but still requires templating infrastructure for what is logically a simple conversion step

Expected behavior:

• Converter applies consistently anywhere the column renders (cell, export if applicable, etc.)

• Works with sorting/filtering in a predictable way (ideally sorting/filtering still uses raw field value unless explicitly configured)

Current limitation: The Diagram component does not provide native context menu integration. There are no events like OnShapeContextMenu or OnConnectionContextMenu that fire on right-click. Developers cannot show contextual actions (edit, delete, copy, connect) when user right-clicks on diagram elements.

Requested feature: Add context menu support for Diagram elements:

1. Context menu events:
   • OnShapeContextMenu — fires on right-click on a shape
   • OnConnectionContextMenu — fires on right-click on a connection
   • OnCanvasContextMenu — fires on right-click on empty canvas area (for "paste", "add shape" actions)
2. Event arguments:
   • DiagramShapeContextMenuEventArgs:
     • ShapeId — the clicked shape identifier
     • ClientX, ClientY — mouse position for menu placement
     • PageX, PageY — page coordinates
   • DiagramConnectionContextMenuEventArgs:
     • ConnectionId — the clicked connection identifier
     • FromShapeId, ToShapeId — connected shape identifiers
     • ClientX, ClientY, PageX, PageY
   • DiagramCanvasContextMenuEventArgs:
     • ClientX, ClientY, PageX, PageY
     • DiagramX, DiagramY — coordinates in diagram space (for placing new shapes)
3. Integration with TelerikContextMenu:
   • Ability to bind TelerikContextMenu to diagram and show it on right-click events
   • Automatic prevention of browser default context menu

Use case:
In workflow/process diagram editors, context menu is essential for:

• Shape actions: Edit, Delete, Duplicate, Copy/Paste, Change type, View details
• Connection actions: Edit transition, Delete, Change routing
• Canvas actions: Paste, Add new shape at cursor position, Zoom controls
• Conditional actions: Show different menu items based on shape type or state

Currently, there is no way to detect right-click on specific diagram elements. The only workaround is complex JavaScript interop to attach event listeners to SVG elements, which is fragile and breaks on re-render.

Example of desired API:

<TelerikDiagram @ref="@DiagramRef"
                OnShapeContextMenu="@OnShapeRightClick"
                OnConnectionContextMenu="@OnConnectionRightClick"
                OnCanvasContextMenu="@OnCanvasRightClick">
    <DiagramShapes>
        @foreach (var shape in Shapes)
        {
            <DiagramShape Id="@shape.Id">
                <DiagramShapeContent Text="@shape.Name" />
            </DiagramShape>
        }
    </DiagramShapes>
</TelerikDiagram>

<TelerikContextMenu @ref="@ShapeContextMenu" 
                    Data="@ShapeMenuItems"
                    OnClick="@OnShapeMenuClick">
    <ItemTemplate Context="item">
        <TelerikFontIcon Icon="@item.Icon" />
        <span>@item.Text</span>
    </ItemTemplate>
</TelerikContextMenu>

@code {
    private TelerikContextMenu<MenuItem>? ShapeContextMenu;
    private string? ClickedShapeId;
    
    private async Task OnShapeRightClick(DiagramShapeContextMenuEventArgs args)
    {
        ClickedShapeId = args.ShapeId;
        await ShapeContextMenu.ShowAsync(args.ClientX, args.ClientY);
    }
    
    private async Task OnShapeMenuClick(MenuItem item)
    {
        switch (item.Action)
        {
            case "edit":
                await OpenShapeEditor(ClickedShapeId);
                break;
            case "delete":
                await DeleteShape(ClickedShapeId);
                break;
            case "duplicate":
                await DuplicateShape(ClickedShapeId);
                break;
        }
    }
}

Current limitation: The Diagram component only allows zoom through mouse interactions (scroll wheel). The Zoom parameter sets only the initial zoom level and cannot be changed at runtime. There are no methods to programmatically control the viewport.

Requested feature: Add programmatic viewport control API:

1. Two-way Zoom binding:
   @bind-Zoom support with ZoomChanged event
   Event args containing OldZoom and NewZoom values
2. Viewport control methods on TelerikDiagram reference:
   SetZoomAsync(double level) — set zoom to specific level
   ZoomInAsync(double? step) — zoom in by step (default: ZoomRate)
   ZoomOutAsync(double? step) — zoom out by step
   ResetZoomAsync() — reset to initial Zoom value (100%)
   BringIntoViewAsync(IEnumerable<string> shapeIds) — pan/zoom to show specific shapes
   FitToScreenAsync() — auto-zoom to fit all shapes in viewport

Use case:
In enterprise workflow/process editors, users need navigation controls beyond mouse wheel:
Accessibility: Users with trackpads, touch screens, or motor impairments cannot easily use scroll wheel zoom
Toolbar buttons: Standard diagram tools (Visio, Draw.io, Lucidchart) provide +/−/100%/Fit buttons
Programmatic navigation: After adding a new shape, auto-scroll to show it; on search result, navigate to found shape
Keyboard shortcuts: Implement Ctrl+Plus/Minus for zoom without native support

<TelerikDiagram @ref="@DiagramRef"
                @bind-Zoom="@CurrentZoom"
                ZoomChanged="@OnZoomChanged">
    ...
</TelerikDiagram>

<TelerikButton OnClick="@(() => DiagramRef.ZoomInAsync())">+</TelerikButton>
<TelerikButton OnClick="@(() => DiagramRef.ZoomOutAsync())">−</TelerikButton>
<TelerikButton OnClick="@(() => DiagramRef.SetZoomAsync(1.0))">100%</TelerikButton>
<TelerikButton OnClick="@(() => DiagramRef.FitToScreenAsync())">Fit</TelerikButton>

@code {
    private TelerikDiagram? DiagramRef;
    private double CurrentZoom = 1.0;
    
    private async Task NavigateToShape(string shapeId)
    {
        await DiagramRef.BringIntoViewAsync(new[] { shapeId });
    }
}

Current limitation: The Diagram component only allows pan through mouse interactions (Ctrl+drag). There are no methods to programmatically control the viewport.

Requested feature: Add programmatic viewport control API:

1. PanToAsync(double x, double y) — pan viewport to specific coordinates
   PanByAsync(double deltaX, double deltaY) — pan viewport by offset
   BringIntoViewAsync(IEnumerable<string> shapeIds) — pan/zoom to show specific shapes
   FitToScreenAsync() — auto-zoom to fit all shapes in viewport
2. Pan position binding (optional):
   @bind-PanX / @bind-PanY or PanChanged event
   

Use case:
Programmatic navigation: After adding a new shape, auto-scroll to show it; on search result, navigate to found shape

===

Forked from https://feedback.telerik.com/blazor/1708938

The Grid's CheckBoxColumn doesn't support the TextAlign property, making it impossible to center the checkbox with just Grid markup, you have to resort to a workaround.

The TextAlign property in other columns causes style="text-align: center" to be added to the underlying table cell.  This would also work for the checkbox column.

See this test:

<table class="table">
    <tr>
        <td class="table-active" style="width: 40px; text-align: center"><input type="checkbox" /> </td>
        <td>test</td>
    </tr>
</table>

Please add the TextAlign property to the CheckboxColumn.