blazor bg roadmap

Telerik UI for Blazor

What's New

Telerik UI for Blazor Supports Both Server-Side Blazor and WebAssembly

We are happy to share that Telerik UI for Blazor is compatible with Blazor WebAssembly release candidate and we promise to be fully compatible with the official release shortly after it is officially announced by Microsoft later this month.

Visual Studio 2019

New Component: Editor

The addition of the Telerik UI for Blazor Editor component is here to let your users create rich text and visual documents without ever leaving the confines of your app. Generate HTML files which you can present elsewhere in the app or export them as more standard document types to be printed or used in other software packages.

Telerik UI for Blazor Editor Component

New Component: TreeList

The Telerik UI for Blazor TreeList component complements your favorite Grid control – it too is a list container but one which displays the hierarchical relationships of the underlying data. For example, an expense report for a business trip might contain things like plane tickets, taxi and parking, which all should be nested inside a general Travel category. The TreeList is the perfect tool for that job.

Telerik UI for Blazor TreeList Overview

New Component: Context Menu

Users instinctively know that when they need to access advanced options, they can right click on an UI element. Making context menus to live up to that expectation is now easy thanks to the new Telerik UI for Blazor Context menu control.

Telerik UI for Blazor Context Menu Templates

New Component: Stock Chart

A crucial element of many financial applications is the need to display in detail the deviation of a financial instrument over some period of time. By adding the Telerik UI for Blazor Stock Chart component, we aim to ease the work of all of our FinTech developers.

Telerik UI for Blazor Stock Chart Overview

New Grid feature: OnRowContextMenu

Right-clicking with a mouse or long-holding on mobile will result in the OnRowContextMenu event being fired. Handling this event is best combined with the ContextMenu component to show any relevant commands.

New Grid feature: OnRowExpand, OnRowCollapse

When a user expands or collapses a row, the Grid will broadcast the OnRowExpand and OnRowCollapse events respectively. These can be used to display or remove any additional commands / details about the data (e.g. an expanded row might be used as a datapoint on a Chart).

New Grid feature: Grouping with OnRead

It is now possible to use manual data management with OnRead with grouped data! When data is grouped, it can no longer be represented with a flat list of items as each group acts as a container for several items. For that reason, previously it was impossible to read from the grid using OnRead but that’s no longer the case. Check the demo for an example on how to achieve it.

New Chart Series: OHLC and Candlestick

Two new chart types were introduced in this release – the Candlestick and the OHLC (open-high-low-close). Both are invaluable financial helpers as they display the price of a financial instrument at its highest, lowest, when the market was opened and when it closed.

Telerik UI for Blazor OHLC Chart

New Menu feature: Separators

We have enhanced menu items with the ability to mark some of them as separators. Separators only render as a single line and will discard any text icons, children or navigable link. Use them to separate logically grouped sequences of menu items.

New Menu feature: Disabled Menu Items

Menu items which cannot be used in the current state of the application can now be disabled. Disabled items will still render but the user will not be able to interact with them.

New Component: Toggle Button

The newly added Telerik UI for Blazor ToggleButton is the perfect tools when you want to provide users with capabilities of flipping a switch in your app – whether it’s muting/unmuting the volume in a media player or toggling between dark and light mode, the ToggleButton looks sleek and is highly customizable to fit any page. See it in action on the demo page.

Telerik UI for Blazor ToggleButton Component

New Component: Button Group

The Telerik UI for Blazor ButtonGroup component takes the other new component – the ToggleButton and expands it. Manage multiple toggle buttons to implement groups exclusive options like radio buttons. Or make them non-exclusive, for example to implement Bold, Italic and Underline in a text editor.

Telerik UI for Blazor ButtonGroup Component

New Grid Feature: Row Click And Double Click Events

Whenever a row in the Grid is clicked or double-clicked, the corresponding event is fired and you can handle it to do interesting things like showing a detailed view of that row in a separate control or  fetching/sending more data about this particular item to the server. Read the full guide in the docs.

New Grid Feature: Support For Dynamic ExpandoObject

The Telerik UI for Blazor Grid can also use data from a weakly-typed ExpandoObject. This is often the case when connecting to a backend based on older technologies and usually makes integration much harder the Grid takes care of it.

New Grid Feature: Bind Grid To DataTable

The Telerik UI for Blazor Grid can also use data from a DataTable object. This makes it easier to connect with legacy code which is still using DataTables – like in this example.

New Grid Feature: Custom Filter Rows and Menus

Custom filter rows and Custom filter menus provide you with the ability to replace the built-in filters on top of each column in the Grid with a more user-friendly filter for your specific case. Discover how can you use both in the filter row demo and in the filter menu demo.

Telerik UI for Blazor Grid Custom Filter Row

New Chart Features: Click Event On A Chart Element

The Telerik UI for Blazor Chart component now exposes a Click event, triggered when the user clicks on the chart. Handling this event opens the door for new interactions like showing detailed info about clicked chart element like in our sample app.

New Chart Features: Chart Tooltip

Users can now hover over the Telerik UI for Blazor Chart to get more detailed information about a particular data point on it and developers can customize the tooltip to show whatever relevant information is necessary.

New TreeView Feature: Node Click Event / Selecteditemschanged Event

The OnItemClick and SelectedItemsChanged events will now fire to let you react to more user actions and provide appropriate results.

New TreeView Feature: Selection Of Nodes

Nodes in the TreeView can be Selected so they can be processed in some way – e.g. selecting an item in TreeView displaying file and folder structure can open the file contents in a separate component like in this example.

Telerik UI for TreeView Node Selection

New TextBox Feature: Additional Parameters

There are several new minor parameters have been added to Telerik UI for Blazor TextBox component like control over AutoComplete, InputMode, PlaceHolder and TabIndex.

New Component: Drawer

The Telerik UI for Blazor Drawer component is a navigation component which provides a dismissive panel. It is the perfect choice for when you need to hide unnecessary details in your menus but still give users the option to bring them back when they need them. Customize it to your heart’s content and enable any of the various operation modes to achieve what you need.

Telerik UI for Blazor Drawer Component

New Component: DateRangePicker

The new DateRangePicker component for Telerik UI for Blazor allows users to pick date ranges. The range can be selected from a calendar popup or edited via start/end date inputs. Both options work in sync so users can use either. The control provides related events and the ability to exclude certain dates from selection.

Telerik UI for Blazor DateRangePicker Component

New Calendar feature: Calendar Range Selection

A new selection mode was added to the Telerik UI for Blazor Calendar component. Users can now select range of dates in Blazor applications to specify time intervals for whatever needs your application might have.

Telerik UI for Blazor Calendar Range Selection

New Grid feature: Export to Excel

We now support exporting Grid data directly to Excel with a single click. We strived to preserve everything so the generated file will have the same filtering, sorting, paging, grouping, column order and size as the original Grid component.

Telerik UI for Blazor Export to Excel

New Visual Studio Extension

We also released a Visual Studio Extension. The wizard streamlines interactions with the Telerik UI for Blazor suite and makes setting up projects easy – convert your existing Blazor project to a Telerik UI for Blazor-enabled project in seconds.

Mac Installer for Telerik UI for Blazor

Mac users, rejoice! You can now install the Telerik UI for Blazor suite via the new Mac installer.

Telerik UI for Blazor Mac Installer

Enhancements in our Blazor UI suite continue with new additions to the Grid grouping feature with column aggregates as well as group header and footer templates. These new add-ons will let you easily display totals of your grid data and highlight values worth attention. They also bring us one step closer to having a full-feature Grid component.

Grid grouping in Telerik UI for Blazor

New Scheduler feature: Recurring appointments

Mark events in the Telerik UI for Blazor Scheduler as recurring – pick the interval in days, weeks, months or years and set a limit on the number of recurrences or an end date.

Telerik Scheduler Recurring Appointments

New Grid feature: Column reordering & resizing

It can be very convenient for users to move columns around and resize them in order to see the most of their data. With this latest update, the Telerik UI for Blazor Grid now supports both operations to put even more power in your users’ hands. 


New Grid feature: Blazor Grid state management

The state of the Grid component includes the current sorting, filtering and grouping selections as well as the indices of the expanded hierarchical rows. With this update, you can now programmatically access and modify the grid’s state which is powerful in many ways:  

  • Save and restore the grid to a user’s preferred state (e.g. Peter sorts his online purchases by price, Karen sorts them chronologically) 

  • Group, sort, filter or otherwise control the state from code (e.g. the data is too large so group it by default but also let the user explore it on their own) 

Telerik Blazor Grid State Management Example

New Component: Blazor Tooltip

The gist of web development is rich visualization of data and one key element of that is the ability to show a Tooltip component. You decide when (click or hover) and where should the tooltip appear (top, bottom, left or right) and there are no limits on what it can contain – text, images or even other components. 

Telerik UI for Blazor Tooltip Component

New Component: Blazor Upload

Uploading files is now a one-liner: 

<TelerikUpload SaveUrl="@SaveUrl" RemoveUrl="@RemoveUrl"/>

Thanks to the Upload component for Telerik UI for Blazor you can make it trivial for users to upload their files to your application. And as always, its fully customizable – pick the file extensions you care about, set limits on min and max file size, upload when a file is selected or wait for the user to press a button – it’s up to you. 

Telerik UI for Blazor Upload Component

New Grid feature: Blazor Grid Grid "Select All" Configuration

The Grid already has a feature which allows you to select multiple rows to execute the same operation on all of them simultaneously. You also have the option to select all rows in the Grid – but this one was a bit unclear – does it select all currently visible rows or all rows in the Grid? We’ve left it to you to decide how should this behave so we’ve added a SelectAllMode attribute which controls exactly that.

New Grid feature: Blazor Grid Frozen Columns

It won’t be a Telerik UI for Blazor release without an update to the Grid. We are now adding the ability to freeze columns which does exactly as the name suggests – frozen columns stay in-place when the user scrolls horizontally.

Telerik Blazor Grid Frozen Column

New Component: Blazor Pager

The new Telerik UI for Blazor Pager component is a flexible tool for controlling paginated components like the Grid or the ListView we just discussed. You only need to specify the page size and the total number of items and then handle the event we fire every time the user changes the page. Your handler is free to load the data dynamically to avoid loading everything up-front. Or not – it’s up to you.

Telerik Blazor Pager Component

New Component: Blazor ListView

We place a lot of love on the Grid but sometimes the data is better suited for a good ListView component. The ListView is available in 2.10.0 and follows the tested recipe of being fully customizable. Bind your data source to the control, use the custom templates for rendering and editing items, and the header and footer of the list. Combine with the built-in buttons like Add and Save or add your own custom buttons to build it exactly as you want it.

Telerik Blazor ListView Editing

New Scheduler feature: Blazor Scheduler Month View

The Telerik UI for Blazor Schedular not only has Day, MultiDay and Week views, it now offers Scheduler Month view. To keep the view of the month well-coordinated, up to two activities appear each day at the slot. For cases where there are more than two appointments a day an ellipsis button provides access to the detailed DayView for the specific day.

You can simultaneously allow multiple views, so your users can easily turn to the Scheduler's preferred way of visualizing events as seen in the example below.

Telerik UI Blazor Scheduler Month View

New Grid feature: Blazor Grid Automatically Generated Columns

When binding your model to a Grid component, wouldn’t it be better if you could just pass the data and have the Grid figure out your components? If you are working on a big application, you likely have many properties, and if you are working on a small one, then data is likely to change. In both cases, you avoid modifiying your UI with the new AutoGenerated columns feature of Telerik UI for Blazor’s Grid.

You only need to enable the AutoGenerated feature and the Grid itself will create a column for every property on your model. Check how to use enable it in our demo.

Since this might not be enough for some of you, we also allow the autogenerated columns to be customized – with additional attributes you can specify alternative column titles, specific column order, column width or you can even run validation! Check out the sample code demonstrating the behavior of auto-generated columns using custom attributes.

New Grid feature: Blazor Grid Column Virtualization

Dealing with a large number of columns while using the Telerik UI for Blazor data grid just got easier with our new  Grid column virtualization feature. It is a great addition for all of you who need to look for ways to optimize both user experience and performance. The Grid Column Virtualization works well with both Virtualized Rows and AutoGenerated Columns. If you would like to see a detailed example of how to enable both features visit our release blog post.

Telerik Blazor Grid Column Virtualization

New Component: Blazor Checkbox

By introducing a Checkbox control, we are moving a step closer to completing all frequently used input components.Users may pick between 3 states – Checked, Unchecked and Indeterminate (e.g. useful for a “Select All” checkbox). Of course, you are free to redefine the visuals and you get full programmatic control via data-binding and several events to notify you for any user actions. 

Telerik Blazor Checkbox Component

UI for Blazor

Demo Buy Try

New features & Roadmap

Have a feature request?

Post your feedback via the Blazor UserVoice portal or the Public forums

What's new across all Telerik products?

See the updates feed

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Compare pricing

Check out the offers. Purchase an individual suite, or treat yourself to one of our bundles.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.