Essential Studio for Blazor Release Notes

v24.1.41

December 18, 2023

Common

Features

The Syncfusion Blazor components are fully support with .NET 8 version from 2023 Volume 3 Service pack release. Now, the Blazor Web App sample browser have been shipped along with existing .NET 6 sample browser.
Added the following new components in preview mode to Blazor:
Data Form
Dropdown Tree
Stepper
The Image Editor component have been developed to meet industry standards and are now marked production-ready.
The Blazor Playground enhanced flexibility with individual NuGet support for Syncfusion Blazor components. This allows you to include only the components you need.
The Blazor Playground App added default code snippet support to make it easier to get started with Syncfusion Blazor components.
Introducing the new Blazor Hotel Booking App, a showcase web application that allows you to room details. Check out the demo link and GitHub source here.
Introducing the new Blazor Stock Market Dashboard App, a showcase web application that allows you to present dynamic stock prices for various stocks. This app provides comprehensive details, including key statistics, overall performance, and technical information. Check out the demo link and GitHub source here.

Accumulation Chart

Feature

#I354250, #F173672- Provided support for exporting accumulation chart data to Excel in a table format.

<SfButton OnClick="ExcelExport">Excel Export</SfButton>

<SfAccumulationChart @ref="ChartObj">
    <AccumulationChartSeriesCollection>
        <AccumulationChartSeries DataSource="@ChartData" XName="XValue" YName="YValue" Type="AccumulationType.Pie">
        </AccumulationChartSeries>
    </AccumulationChartSeriesCollection>
</SfAccumulationChart>

@code
{
    SfAccumulationChart ChartObj;
    public class ChartDataDetails
    {
        public string XValue { get; set; }
        public double YValue { get; set; }
    }
    public List<ChartDataDetails> ChartData { get; set; } = new List<ChartDataDetails>
    {
        new ChartDataDetails { XValue = "Jan", YValue = 42 },
        new ChartDataDetails { XValue = "Feb", YValue = 44 },
        new ChartDataDetails { XValue = "Mar", YValue = 53 },
        // More data
    };
    async Task ExcelExport()
    {
        await ChartObj.ExportAsync(ExportType.XLSX, "AccumulationChartData");
    }
}

AutoComplete

Bug fixes

#527236 - The issue with “Autocomplete OnClose event was not being triggered” has been resolved.

BarcodeGenerator

Bug fix

#I500985 - Now, the null reference exception will no longer be thrown when the QRCodeText is set as null.

Chart

Bug Fixes

#F185615 - Chart series tooltip is now working when trendline is enabled.

Features

#I353855, #I527624 - Provided support for synchronizing tooltips, zooming and panning, cross-hairs, highlights, and selection features across numerous charts.

<SfButton OnClick="ShowTooltip">ShowTooltip</SfButton>
<SfButton OnClick="HideTooltip">Hide Tooltip</SfButton>

<SfChart @ref="Chart">
 ...
 </SfChart>

@code
{
     public SfChart Chart;

     // Other Chart configurations

     void ShowTooltip()
     {
         Chart.ShowTooltip("Gold", 40);
     }
     void HideTooltip()
     {
         Chart.HideTooltip();
     }
}

#I354250, #F173672 - Provided support for exporting chart data to Excel in a table format.

<SfButton OnClick="ExcelExport">Excel Export</SfButton>

<SfChart @ref="ChartObj">
    <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category" />
    <ChartSeriesCollection>
        <ChartSeries DataSource="@ChartData" XName="XValue" YName="YValue" Type="ChartSeriesType.Column">
        </ChartSeries>
    </ChartSeriesCollection>
</SfChart>

@code
{
    SfChart ChartObj;
    public class ChartDataDetails
    {
        public string XValue { get; set; }
        public double YValue { get; set; }
    }
    public List<ChartDataDetails> ChartData { get; set; } = new List<ChartDataDetails>
    {
        new ChartDataDetails { XValue = "Jan", YValue = 42 },
        new ChartDataDetails { XValue = "Feb", YValue = 44 },
        new ChartDataDetails { XValue = "Mar", YValue = 53 },
        // More data
    };
    async Task ExcelExport()
    {
        await ChartObj.ExportAsync(ExportType.XLSX, "ChartData");
    }
}

#I450433 - Provided support to get the X-axis and Y-axis values as arguments in the chart mouse events.
#F151301 - Provided support to limit the zoom level in the OnZooming event.

Circular Gauge

Features

Circular Gauge elements such as the axis line, ranges, pointers, and annotations can now be animated one by one to create a smooth appearance when rendered initially.

Dashboard Layout

Bug Fixes

#I525283 - Resolved the console error when performing window resizing in the DashboardLayout component.

DataForm `Preview`

The Blazor Data Form allows you to easily create various forms, such as registration, login, or any other forms. It can be automatically generated from your data model using other Blazor components. You can customize the component through various properties, use default editors or custom ones, and organize the form fields in groups and columns.Also check out the documentation here for further references.

Key features

Auto Generated Items - Generates appropriate editing fields corresponding to the property types specified within the Model.
Form Groups - Organizes editing fields into categorized sections with descriptive headings and a columnar structure.
Validators - Provides the option to apply various types of validators, including both built-in and custom validators.
Validation Display - Offers the choice for validation messages to be displayed directly inline or as tooltip.
Templates - Enables users to implement tailor-made editor designs to suit their unique requirements.

Data Grid

Bug Fixes

Resolved the issue where the screen reader did not read the sorting direction.
#F185218 - Resolved the issue where the autofit feature was not working properly after grouping and performing expand and collapse operations.
#I528539 - Resolved the issue where an exception was thrown while performing initial grouping with a virtualization enabled grid.

Features

Introduced a new column freezing mode known as Fixed, in addition to the existing Left, Right modes within the column settings freeze property. This Fixed mode locks columns in place, ensuring their visibility during horizontal scrolling. Explore the demo here.
#FB36933 - Provided support for drag selection while the grid is bound with stacked header with frozen columns.
#I500452 - Added functionality to support drag-and-drop of grid rows between different groups within the Grid. Explore the demo here.
#I510210 - Provided support to render adaptive UI layout for the column chooser and column menu features in the adaptive Grid. Explore the demo here.
#I492757 - The Grid export functionality has been enhanced to export the grid as a memory stream, during server-side exporting instead of initiating direct browser file downloads.
#I470923 - Provided range selection support for virtualization feature.

Breaking Changes

Revamped the frozen feature by replacing the previous three-table approach with a single table, resulting in significant performance improvements and a reduction in file size.

Previous Code
New Code
<div class="e-gridheader e-frozenhdrcont" style="padding-right: 20px;">= $0
	<div class="e-headercontent" style="display: flex; border-right-width: 1px;"> flex
		<div class="e-frozenheader e-frozen-left-header">
			<table class="e-table e-sortfilter" id="sfgridqrølurwmklv_header_table" cellspacing="0.25px" role="presentation"> </table>
		</div>
   <div class="e-movableheader">
   <table class="e-table e-sortfilter" id="sfgridqrelurwmklv_header_table" cellspacing="0.25px" role="presentation">- </table>
</div>
<div class="e-gridheader" style="padding-right: 20px;">
	<div class="e-headercontent" style="border-right-width: 1px;">= 50
		<table class="e-table e-sortfilter" id="sfgrid5fycno2ggwe_header_table" cellspacing="0.25px" role="presentation"> </table>
	</div>
</div>

Improved the grid accessibility over different screen readers by removing the aria-label and updating the suitable roles for each elements(th,td,tr) in the grid. Added a new attribute aria-describedby in grid header cells by including a new span element with the content to describe and with the display property as none, when the features like Grouping, Sorting, Column menu and Filter Menu are enabled in the grid.

Updated the aria-label attribute to title attribute for action icons like filter, column menu icons.

Previous Code
New Code
<tr class="e-columnheader">
	<th class="e-headercell e-rightalign e-mousepointer  " data-uid="gridcell-199247" tabindex="0" aria-colindex="1" data-colindex="0" style="" aria-sort="none" aria-description="Press Enter to sort" rowspan="1" colspan="1">
		<div e-mappinguid="grid-column23718" class="e-headercelldiv" style="text-align:right">
			<span class="e-headertext">Order ID</span>
		</div>
		<div class="e-sortfilterdiv e-icons ">
		</div>
	</th>
</tr>
<tr role="row" class="e-columnheader">
	<th class="e-headercell e-rightalign e-mousepointer  " data-uid="gridcell-29837" role="columnheader" aria-describedby="grid-column2221" tabindex="0" aria-colindex="1" data-colindex="0" style="" aria-sort="none" rowspan="1" colspan="1">
		<div e-mappinguid="grid-column2221" class="e-headercelldiv" style="text-align:right">
			<span class="e-headertext">Order ID</span>
		</div>
		<span id="grid-column2221" style="display:none">Press Enter to sort</span>
		<div class="e-sortfilterdiv e-icons ">
		</div>
	</th>
</tr>

Date Picker

Bug Fixes

#I523016 - Fixed issue where specific date was not being displayed in the datepicker popup.

Diagram

Features

#F178055 - Provided the radial tree layout support.

Bug fixes

#I497217 - Able to draw any connector type when a port constraint is set as PortConstraints.Draw.
#I497906 - Now, the console exception will no longer be thrown when dragging and dropping a BPMN shape node from the palette to the diagram.
#I498429 - Now, the connector annotation is added only once while adding annotation in the CollectionChanged event instead of twice.
#I499464 - Now, the null reference exception will no longer be thrown while dragging the node after loading the JSON data into a diagram.
#I509937 - The tooltip position is updated correctly for symbol palette items when hovering in the MAUI application.
#I523974 - The node position is updated properly when moving the HTML node using the arrow keys.
#I524364 - Now, the null reference exception will no longer be thrown when fast switching between tabs inside the diagram components.

Dialog

Bug fixes

#I513056 - Resolved “The width of the dialog changes after dragging and dropping it and reopening it”.
#I528482 - Fixed the issue where the screen reader was reading the content twice when opening the Dialog.

DocIO

Features

#I436843, #I464361, #F170441 - Create equation using LaTeX in a Word document using AppendMath API.
#I434385 - Provided an API to check comment is resolved or not in DOCX format document.
#I211048, #I226189, #I229312, #I256504, #I296622, #I312794, #I368129, #I391106, #I421968, #F138643 - Configure fallback fonts for Unicode text when glyphs do not exist in specified font during Word to PDF or image conversion.
TIFF images are preserved properly while converting Word documents to PDF.

Bug Fixes

#I521012 – Header is now preserved properly while converting a Word document to PDF.
#I507001 - Track changes revisions are now preserved properly while opening a DOCX format document.
#I521063 - Text in DOCX format document are now compared properly after calling Compare API.

Document Editor

Features

#I158324, #I231373, #F146594, #I254094, #I258260, #I277167, #I276652, #I290372, #I300092, #I323833, #F166119,#I361625, #I362312, #I394582, #I425150, #I444717, #I448820, #I458864, #I499027 - Added support for rulers and tab stop.

Bug Fixes

#I516207 - Resolved the issue of search text of footnote content.
#I513118 - Resolved the Background Color is missing in exported document issue.
#I517682 - Resolved the document corrupted issue on exporting as Docx.
#I514089 - Resolved overlapping issue while pasting.
#I521049 - Resolved the issue in search the font in style dropdown.
#I514009 - Resolved the script error when undoing pasted table.
#I515234 - Resolved the issue in paragraph goes to page end while press enter.
#I516988 - Resolved the SFDT list property is not populated issue.
#I515700 - Resolved script error issue while exporting the document.
#I514962 - Resolved the issue in selection is not updated properly while inserting text.
#I513117 - Resolved editing and last page delete issue.
#I525400 - Resolved issue in paste.
#I513061 - Resolved editing issues in the attached document.
#I526803 - Resolved the issue on paste text-only.
#I521204 - Resolved the accept all and reject all issue.

Dropdown Tree `Preview`

The Dropdown Tree component allows you to select single or multiple values from the hierarchical and self-referential data in a tree-like structure. It has several out-of-the-box features, such as data binding, check boxes, templates, accessibility, and pre-selected values. The available key features are

Data binding - To bind and access a hierarchical and self-referential list of items from a local or server-side data source.
Checkbox - To select more than one item in the Dropdown Tree component without affecting the UI appearance.
Multiple selection - To select more than one item in the component.
Mode - The following visual modes are available to visualize the selected items in the component when AllowMultiSelection or ShowCheckBox is enabled.

Type	Description
`Box`	Selected items will be visualized in chip format.
`Delimiter`	Visualizes selected items in text content format using a delimiter.
`Default`	When focused, the component will act in the box mode. When blurred, the component will act in the delimiter mode.

Filtering - Enables quick filtering of tree items based on characters entered in the search box. This feature supports both local and remote data sources.
Sorting - To display the Dropdown Tree items in ascending or descending order.
Templates - To customize the Dropdown Tree items, header, footer, action failure content, and no records content.
Accessibility - To provide access to all the Dropdown Tree component features through keyboard interaction, on-screen readers, and other assistive technology devices.

File Manager

Breaking Changes

The AjaxSettings property in the BeforeSendEventArgs event has been marked as deprecated and should no longer be used. Use HttpClientInstance instead.

Features

Provided support in File Manager component to download operations via HTTP client request. Now File Manager component, allowing users to perform download operations using either the default form submit method or the modern HTTP client request with a Boolean property UseFormPost in the BeforeDownloadEventargs. The default value of UseFormPost is set to true, directing the File Manager component to utilize the form submit method by default for download operations.

Bug Fixes

#I522670 - The refreshing issue with File Manager component navigation pane when performing drag and drop has been resolved.
#I505439 - Provided support to enable or disable external drag and drop support of the File Manager component. This can be now achieved by setting required selector for DropArea property within UploadSettings of the File Manager.
#I517288 - The error dialog popup issue related to the delete operation in the Blazor File Manager component has been resolved.
#FB47701 - The Exception throws when deleting files through the context menu in the File Manager component has been resolved.
#I521447 - The issue with image resizing option in the File Manager component has been resolved.

Gantt Chart

Bug fixes

#FB49126,#I529891 -The issue with “Editing tooltip template is not working properly for taskbar editing.” has been resolved.

Features

Improved the initial rendering performance of the Gantt Chart by up to 35% in virtualization mode. This enhancement results in a faster and more responsive loading experience for users.
Introduced new event support for actions performed within the Gantt Chart. These new events significantly expand your ability to tailor and enhance your interactions within the Gantt Chart, providing you with more control and flexibility. Below, you will find the corresponding event names and event argument details.

Event Information

Event Name	Argument Name	Properties	Description
Sorting	Syncfusion.Blazor.Grids.SortingEventArgs	Cancel, IsCtrlKeyPressed, Action, ColumnName, Direction, SortedColumns.	Gets or sets the event callback that is invoked before a sorting action is performed or a column is removed from sorting in the Gantt Chart or when the sort column direction changes from Ascending to Descending or vice versa for the same column.
Sorted	Syncfusion.Blazor.Grids.SortedEventArgs	Action, ColumnName, Direction, SortedColumns.	Gets or sets the event callback that is raised after sorting action is performed in the Gantt Chart.
Searching	Syncfusion.Blazor.Grids.SearchingEventArgs	Cancel, SearchText.	Gets or sets the event callback that is raised before the search action is performed in the Gantt Chart.
Searched	Syncfusion.Blazor.Grids.SearchedEventArgs	SearchText.	Gets or sets the event callback that is raised after the search action is performed in the Gantt Chart.
RowCreating	Syncfusion.Blazor.Gantt.GanttRowCreatingEventArgs	Cancel, Data, Index, EditContext.	Gets or sets the event callback that is raised before the add action is performed in the Gantt Chart.
RowCreated	Syncfusion.Blazor.Gantt.GanttRowCreatedEventArgs	Data, Index, EditContext.	Gets or sets the event callback that is raised after the add action is performed in the Gantt Chart.
RowUpdating	Syncfusion.Blazor.Gantt.GanttRowUpdatingEventArgs	Cancel, IsShiftKeyPressed, KeyCode, Data, Index, PreviousData, PrimaryKeys, PrimaryKeyValue.	Gets or sets the event callback that is raised before the save action is performed in the Gantt Chart.
RowUpdated	Syncfusion.Blazor.Gantt.GanttRowUpdatedEventArgs	Data, Index, PreviousData, PrimaryKeys, PrimaryKeyValue.	Gets or sets the event callback that is raised after the save action is performed in the Gantt Chart.
Filtering	Syncfusion.Blazor.Grids.FilteringEventArgs	Cancel, PreventFilterQuery, FilterPredicates, ColumnName.	Gets or sets the event callback that is raised before the filtering or clear filtering action is performed in the Gantt Chart.
Filtered	Syncfusion.Blazor.Grids.FilteredEventArgs	FilterPredicates, ColumnName.	Gets or sets the event callback that is raised after the filtered or clear filtered action is performed in the Gantt Chart.
FilterDialogOpening	Syncfusion.Blazor.Grids.FilterDialogOpeningEventArgs	Cancel, ColumnName, CheckboxListData, FilterChoiceCount, FilterOperators.	Gets or sets the event callback that is raised before the filter dialog is opened in the Gantt Chart.
FilterDialogOpened	Syncfusion.Blazor.Grids.FilterDialogOpenedEventArgs	ColumnName, CheckboxListData, FilterChoiceCount.	Gets or sets the event callback that is raised after the filter dialog is opened in the Gantt Chart.
RowDeleting	Syncfusion.Blazor.Gantt.GanttRowDeletingEventArgs	Cancel, Datas, PrimaryKeys	Gets or sets the event callback that is raised before the delete action is performed in the Gantt Chart.
RowDeleted	Syncfusion.Blazor.Gantt.GanttRowDeletedEventArgs	Datas, PrimaryKeys	Gets or sets the event callback that is raised after the delete action is performed in the Gantt Chart.
ColumnReordering	Syncfusion.Blazor.Grids.ColumnReorderingEventArgs	Cancel, ReorderingColumns, ToColumn.	Gets or sets the event callback that is raised when columns reordering action is performed in the Gantt Chart.
ColumnReordered	Syncfusion.Blazor.Grids.ColumnReorderedEventArgs	ReorderingColumns, ToColumn.	Gets or sets the event callback that is raised when columns are reordered in the Gantt Chart.
GanttDialogOpening	Syncfusion.Blazor.Gantt.GanttDialogOpenEventArgs	Cancel, Data, IsEditAction.	Gets or sets the event callback that is raised before the edit or add dialog opens.
GanttDialogOpened	Syncfusion.Blazor.Gantt.GanttDialogOpenedEventArgs	Action, Data.	Gets or sets the event callback that is raised after the edit or add dialog opened.
Zooming	Syncfusion.Blazor.Gantt.ZoomEventArgs	Cancel, Action, ZoomTimelineSettings.	Gets or sets an event callback that is raised before zoom action is performed.
Zoomed	Syncfusion.Blazor.Gantt.ZoomedEventArgs	Action, ZoomTimelineSettings.	Gets the action name that triggered the zoom operation.
TaskConnectorChanging	Syncfusion.Blazor.Gantt.TaskConnectorChangeEventArgs	PredecessorData, SuccessorData, Cancel, IsStartPredecessor	Gets or sets an event callback that is raised when beginning to connect a taskbar to another.
TaskConnectorChanged	Syncfusion.Blazor.Gantt.TaskConnectorChangedEventArgs	PredecessorData, SuccessorData, IsStartSuccessor, IsStartPredecessor	Gets or sets the event callback that is raised when a dependency connector line is drawn between two taskbar and connection is complete.

The ValidationMode enum property newly added in the TaskbarEditingEventArgs.

Breaking changes

In DataSource model class, Start Date, End Date, BaselineStartDate, BaselineEndDate and Duration properties must be nullable type now, if the data contains null value.

Previous Code
New Code
<SfGantt DataSource="@TaskCollection" >
........
</SfGantt>
@code{
    public List<TaskData> TaskCollection { get; set; }
    public class TaskData
    {
        ...
        public DateTime StartDate { get; set; }
        public DateTime BaselineStartDate { get; set; }
        public DateTime EndDate { get; set; }
        public DateTime BaselineEndDate { get; set; }
        public int Duration { get; set; }
    }
}
<SfGantt DataSource="@TaskCollection" >
........
</SfGantt>
@code{
    public List<TaskData> TaskCollection { get; set; }
    public class TaskData
    {
        ...
        public DateTime? StartDate { get; set; }
        public DateTime? BaselineStartDate { get; set; }
        public DateTime? EndDate { get; set; }
        public DateTime? BaselineEndDate { get; set; }
        public int? Duration { get; set; }
    }
}

HeatMap

Features

The performance of the tooltip over the HeatMap cells is now improved.

Image Editor

Features

Provided support for image straightening allows users to adjust an image by rotating it clockwise or counter clockwise. The rotating degree value should be within the range of -45 to +45 degrees for accurate straightening. Positive values indicate clockwise rotation, while negative values indicate counter clockwise rotation.
Provided support to add additional font families for text annotation.

Breaking Changes

The return type of GetImageDataAsync method has been changed.

Method	Previous Return Type	Current Return Type
GetImageDataAsync	object	byte[]

The event argument of ShapeChanged event has been changed.

Event	Previous Type	Current Type
ShapeChanged	ShapeChangeEventArgs	ShapeChangedEventArgs

The parameters of the below mentioned public methods have been changed.

Method	Parameter	Previous Type	Current Type
SelectAsync	startX	Nullable	double
SelectAsync	startY	Nullable	double
SelectAsync	width	Nullable	double
SelectAsync	height	Nullable	double
EnableFreehandDrawAsync	value	Nullable	—
DisableFreehandDrawAsync	value	Nullable	—
DrawEllipseAsync	x	Nullable	double
DrawEllipseAsync	y	Nullable	double
DrawEllipseAsync	radiusX	Nullable	double
DrawEllipseAsync	radiusY	Nullable	double
DrawEllipseAsync	strokeWidth	Nullable	double
DrawArrowAsync	startX	Nullable	double
DrawArrowAsync	startY	Nullable	double
DrawArrowAsync	endX	Nullable	double
DrawArrowAsync	endY	Nullable	double
DrawArrowAsync	strokeWidth	Nullable	double
DrawPathAsync	strokeWidth	Nullable	double
DrawLineAsync	startX	Nullable	double
DrawLineAsync	startY	Nullable	double
DrawLineAsync	endX	Nullable	double
DrawLineAsync	endY	Nullable	double
DrawLineAsync	strokeWidth	Nullable	double
DrawRectangleAsync	x	Nullable	double
DrawRectangleAsync	y	Nullable	double
DrawRectangleAsync	width	Nullable	double
DrawRectangleAsync	height	Nullable	double
DrawRectangleAsync	strokeWidth	Nullable	double
DrawTextAsync	x	Nullable	double
DrawTextAsync	y	Nullable	double
DrawTextAsync	fontSize	Nullable	int
DrawImageAsync	x	Nullable	double
DrawImageAsync	y	Nullable	double
DrawImageAsync	width	Nullable	int
DrawImageAsync	height	Nullable	int
DrawImageAsync	isAspectRatio	Nullable	boolean
DrawImageAsync	degree	Nullable	int
ImageResizeAsync	width	Nullable	int
ImageResizeAsync	height	Nullable	int
DrawFrameAsync	inset	Nullable	int
DrawFrameAsync	offset	Nullable	int
DrawFrameAsync	borderRadius	Nullable	int
DrawFrameAsync	lineCount	Nullable	int

InPlace Editor

Bug fixes

#I525234 - Fixed an issue where pressing the Tab key would focus the component even when it was in a disabled state.

Kanban

Bug fixes

#I526720 - Now, navigating to another page on a card click in Kanban works properly.
#I504127 - Now, the GetColumnDataByKeys public method can be used to retrieve the data for the particular column.

Linear Gauge

Features

In the Linear Gauge axis, a text pointer can now be displayed to indicate the axis value. The value can also be changed by dragging and dropping the text pointer. Additionally, the text pointer can be animated.
Linear Gauge elements such as the axis line, ranges, and pointers can now be animated one by one to create a smooth appearance when rendered initially.

ListView

Bug Fixes

#I523520 - The issue with adding new item in the ListView component when enabling SortOrder property has been resolved.

Maps

Features

#F184014 – The performance of the navigation line with panning over the Maps component is improved to a possible extent.
The shapefile(*.shp) can now be rendered in the Maps by setting the remote hosted file path in the ShapeData property of MapsLayer. All the map features such as markers, bubbles, navigation lines, polygons and so on can be added over the map layer rendered with shapefile.
The performance of the tooltip is now improved when interactive legend is rendered.

Message

Bug Fixes

The issue with “the close icon focus style is displayed in the Message component” has been resolved.

MultiSelect

Bug fixes

#I54777 - Resolved the issue where the popup collapsed state was not being read correctly through a screen reader.

Features

Introduced adaptive support for the pager dropdown, dynamically rendering on mobile and tablet devices alongside the pager component. The pager message element now adjusts its rendering based on the screen size, ensuring a more responsive and user-friendly experience.

Breaking Changes

Removed name and aria-label attributes from the child elements of the pager container and updated the role attribute from link to button.

Previous Code
New Code
<div class="e-pagercontainer" role="navigation" aria-label="Page Navigation">
	<div class="e-first e-icons e-icon-first e-firstpagedisabled e-disable " title="Go to first page" role="link" aria-label="Go to first page" tabindex="-1">
	</div>
	<div class="e-prev e-icons e-icon-prev e-prevpagedisabled e-disable " title="Go to previous page" role="link" aria-label="Go to previous page" tabindex="-1">
	</div>
	<div class="e-numericcontainer">
		<a class="e-link e-numericitem e-spacing e-currentitem e-active " role="link" tabindex="-1" aria-label="Page 1 of 6 Pages" name="Gotopage 1">1</a>
	</div>
</div>
<div class="e-pagercontainer" role="navigation">
	<div class="e-first e-icons e-icon-first e-firstpagedisabled e-disable " title="Go to first page" role="button" tabindex="-1">
	</div>
	<div class="e-prev e-icons e-icon-prev e-prevpagedisabled e-disable " title="Go to previous page" role="button" tabindex="-1">
	</div>
	<div class="e-numericcontainer">
		<a class="e-link e-numericitem e-spacing e-currentitem e-active " tabindex="-1" title="Page 1 of 6 Pages">1</a>
	</div>
</div>

PDF

Features

#I477716 - Added support for splitting PDF documents without loss of WCAG standard compliance.
#I510759 - Added support to word wrap text content with hyphenation-special character in PDF documents.
Added support for removing unused resources when splitting a PDF document.
Added support to enhance the image quality before performing OCR on images.
Updated BlinkBinaries to latest stable version [117.0.5938.150].
HTML to PDF converter will provide more specific exception messages for the conversion failure.

Bug Fixes

#I525393 - The issue of incorrect extracted text bounds when extracting from a PDF document has been fixed.
#I525788 - The exception no longer occurs when appending the specific PDF document.
Fixed an issue where the issuer name details were not properly retrieved from an existing signature field.
#I518474 - Fixed an issue where document information was not updated properly for a specific PDF document.
The background color is now properly preserved when updating the transparent color in the free text annotation.
#I519560 - The issue of PDF images being replaced with a black box when resizing a multi-page PDF document has been resolved.
The NullReference exception that occurred while using the loaded document’s StructureElement for a specific document has been fixed.

PDF Viewer

Features

Implemented keyboard-based navigation options to enhance the user experience, enabling individuals to navigate through the PDF Viewer more efficiently.
Added support for annotation toolbar on mobile devices. With this feature, users now have the ability to perform various actions such as adding, modifying, removing, and commenting on annotations within PDF documents directly from their mobile devices.

Bug Fixes

#I511388- Resolved the JsonException that occurred while retrieving the form fields in the provided document.
#I513903- The handwritten signature is now drawn properly in the Material3 theme.
#I513712- The issue of pages freezing during zooming operations has been resolved, and form fields are no longer misplaced.
#I512640- The issue where form fields would disappear when pressing the tab key has been resolved.
#I484072- Now, the PDF Viewer renders the bookmark properly during the initial rendering.
#I520783- The Object reference exception that occurred while downloading particular the document with stamp has been resolved.
#I520650- The System.ArgumentException that occurred while loading the particular document with a button field has been resolved.
#I521201- The issue that the ID property of the PDF Viewer is overwritten with a randomly generated string has been resolved.
#I521856- Now, the ShowToolTip property is working properly in PDF Viewer.
#I522851- Now, the EnableContextMenu property is functioning correctly.
#I522937- The issue where a similar annotation is automatically added after selecting the same one without dragging has been resolved.
#I523394- The issue that ExportAnnotationsAsObjectAsync is not working with the given JSON Data has been resolved.
#I522932- The issue that the ExportAnnotationsAsObjectAsync() method throws an error when the last annotation is deleted has been resolved.
#I516387- Now, the additional space does not appear to the right in the print preview.
#I522367- The issue that Existing custom stamps will be removed when we upload new ones has been resolved
#I522713- The issue of ‘Web-service is not listening’ occurring randomly when loading the document programmatically in PDF Viewer (NextGen) has been resolved.

Pivot Table

Bug fixes

#I526244 - The pivot table now fits appropriately to the browser page when the height is set to 100% and the grouping bar UI is enabled.

Features

#I504411, #I498923, #I491105, #I492757, #I491105 - Provided support for exporting both the table and the chart to a single PDF file.

<SfButton OnClick="OnPdfExport" Content="PDF Export"></SfButton>

<SfPivotView @ref="@Pivot" TValue="PivotProductDetails" Height="300" Width="1200" ShowToolbar=false AllowPdfExport=true EnableVirtualization="true">
    <PivotViewDisplayOption Primary="Primary.Chart" View="View.Both"></PivotViewDisplayOption>
    <PivotViewDataSourceSettings DataSource="@Data">
        ....
    </PivotViewDataSourceSettings>
    ....
    <PivotViewEvents TValue="PivotProductDetails" BeforeExport="BeforeExport" ></PivotViewEvents>
</SfPivotView>

@code {
    public List<PivotProductDetails> Data { get; set; }
    SfPivotView<PivotProductDetails> Pivot { get; set; }
    protected override void OnInitialized()
    {
        this.Data = PivotProductDetails.GetProductData();
    }
    private async Task OnPdfExport(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
    {
        Syncfusion.Blazor.Grids.PdfExportProperties ExportProperties = new Syncfusion.Blazor.Grids.PdfExportProperties();
        await this.Pivot.ExportToPdfAsync(ExportProperties, true);
    }
}

Introduced a new Syncfusion assembly Syncfusion.Pivot.Engine is a .NET Core compatible alternative to the Syncfusion.EJ2.Pivot package that is used in a server side application to perform all Pivot calculations such as aggregation, filtering, sorting, grouping, and so on, and only the information to be displayed in the Pivot Table’s viewport is passed to the client side (browser) via web service (Web API) rather than the entire data source.

Breaking Changes

The ExportToPdfAsync method parameters for the pivot table export have now been changed.

Previous

Parameter	Type	Description
pdfExportProperties	`PdfExportProperties`	Provides the pdf export properties. Use this to provide custom column, data source, theme etc.
isMultipleExport	`Nullable<bool>`	Allows to export multiple tables and charts into a single PDF document.
pdfDoc	`System.Object`	Allows the pivot table data to be exported to an external PDF document.

Now

Parameter	Type	Description
pdfExportProperties	`PdfExportProperties`	Provides the pdf export properties. Use this to provide custom column, data source, theme etc.
exportTableAndChart	`Nullable<bool>`	Allows to export both pivot table and pivot chart data into a single PDF document.
asBlob	`Nullable<bool>`	Allows the pivot table data as a memory stream instead of a document.

The ExportToChartAsync method parameters for the pivot chart export have now been changed.

Previous

Parameter	Type	Description
type	`Charts.ExportType`	Defines the export type.
fileName	string	Defines file name of export document.
orientation	`PdfPageOrientation`	Defines the page orientation on pdf export(0 for Portrait mode, 1 for Landscape mode).
width	number	Defines width of the export document.
height	number	Defines width of the export document.

Now

Parameter	Type	Description
type	`Charts.ExportType`	Defines the export type.
fileName	`string`	Defines file name of export document.
orientation	`PdfPageOrientation`	Defines the page orientation on pdf export(0 for Portrait mode, 1 for Landscape mode).
asBase64	`Nullable<bool>`	Allows the pivot chart to be saved as chart image as a base64 string.

The skeleton (aka, HTML) of the pivot table has been restructured. Previously, the pivot table displayed frozen row headers and values data in a two-table manner. It has been simplified to one table. The appearance of the horizontal scrollbar has changed as the row headers were frozen using the CSS attributes. However, the pivot table’s appearance will remain unchanged as the prior version.

Because the DOM structure of the pivot table has changed, the following classes included elements have been removed and can now be identified using the classes listed below.

The frozen and moveable header elements have now been identified within the e-gridheader element using the class names shown below.

Previous	Now	Description
`e-frozenheader > e-table > th.e-headercell`	`e-table > th.e-leftfreeze.e-headercell`	Element defining the frozen column header.
`e-movableheader > e-table > th.e-headercell`	`e-table > th.e-unfreeze.e-headercell`	Element defining the moveable column header.

The frozen and moveable content elements have now been identified within the e-gridcontent element using the class names shown below.

Previous	Now	Description
`e-frozencontent > e-table > th.e-rowcell`	`e-table > th.e-leftfreeze.e-rowcell`	Element defining the frozen content (aka, row headers).
`e-movablecontent > e-table > th.e-rowcell`	`e-table > th.e-unfreeze.e-rowcell`	Element defining the moveable content (aka, values).

Presentation

Features

TIFF images are preserved properly while converting the Presentation to PDF or image.

Range Selector

Feature

#I354250, #F173672- Provided support for exporting range selector data to Excel in a table format.

<SfButton OnClick="ExcelExport">Excel Export</SfButton>

<SfRangeNavigator @ref="RangeSelectorObj" DataSource="@RangeSelectorData" XName="XValue" YName="YValue">
</SfRangeNavigator>

@code
{
    SfRangeNavigator RangeSelectorObj;
    public class RangeSelectorDataDetails
    {
        public double XValue { get; set; }
        public double YValue { get; set; }
    }
    public List<RangeSelectorDataDetails> RangeSelectorData { get; set; } = new List<RangeSelectorDataDetails>
    {
        new RangeSelectorDataDetails { XValue = 10, YValue = 42 },
        new RangeSelectorDataDetails { XValue = 20, YValue = 44 },
        new RangeSelectorDataDetails { XValue = 30, YValue = 53 },
        // More data
    };
    async Task ExcelExport()
    {
        await RangeSelectorObj.ExportAsync(ExportType.XLSX, "RangeSelectorData");
    }
}

Rich Text Editor

Breaking Changes

Now, the shortcut key to open the Insert video dialog has been changed to CTRL+ALT+V from CTRL+SHIFT+V to ensure that the Paste as plain text browser shortcut works properly.

Bug fixes

#I514715 - Now, the content should not be hidden when resizing the image in the Rich Text Editor.
#I521260 - Now, the placeholder value is cleared when typing the content in the Rich Text Editor.
#I526240 - Now, the Create Table toolbar button will work properly when enabling the toolbar dynamically.
#F185293 - Now, the editor scrolls properly to the cursor position when entering in the Rich Text Editor.
#I525319 - Now, the Quick toolbar opens properly when clicking the table and inserting the image in RichTextEditor.
#I510055 - Now, pasting the content as plain text when enterKey is configured as BR works properly in the Rich Text Editor.
#I524918 - Now, when using the RichTextEditorFontSize, the Rich Text Editor is rendered properly without any script errors.

Feature

#I466822 - Provided support for customizing the IsModel, Target, and ZIndex properties of RichTextEditor Dialogs using the RichTextEditorDialogSettings.

    <SfRichTextEditor>
        <RichTextEditorDialogSettings Target="body" IsModal="true" ZIndex="1000"></RichTextEditorDialogSettings>
    </SfRichTextEditor>

Schedule

Bug Fixes

#I525085 - The issue of the selected date not being highlighted and appointments not being rendered in the month agenda view when using the custom adaptor has been fixed.

Stepper `Preview`

The Stepper component enables users to navigate through a series of steps or stages in a process within a web application. Steppers display a list of steps, with the current step highlighted, and allow users to move between steps.

Key features

Step types - Display steps with indicators and labels, only indicators, or only labels.
Orientation - A layout to display steps in a horizontal or vertical orientation.
Linear flow - Enable a step-by-step progression, completing one step before moving on to the next.
Label positioning - Show the label at the top, bottom, left, or right.
Tooltip - Show additional information when users hover over a step, such as a label or customized text.
Templates - Customize the default appearance and content of each step using templates.

Stock Chart

Feature

#I354250, #F173672- Provided support for exporting stock chart data to Excel in a table format.

<SfButton OnClick="ExcelExport">Excel Export</SfButton>

<SfStockChart @ref="StockChartObj">
    <StockChartSeriesCollection>
        <StockChartSeries DataSource="@StockDetails" XName="Date" High="High" Low="Low" Open="Open" Close="Close" Volume="Volume"></StockChartSeries>
    </StockChartSeriesCollection>
</SfStockChart>

@code {
    SfStockChart StockChartObj;
    public class ChartData
    {
        public DateTime Date { get; set; }
        public Double Open { get; set; }
        public Double Low { get; set; }
        public Double Close { get; set; }
        public Double High { get; set; }
        public Double Volume { get; set; }
    }

    public List<ChartData> StockDetails = new List<ChartData>
    {
         new ChartData { Date = new DateTime(2023, 04, 02), Open= 85.9757, High = 90.6657, 
                         Low = 85.7685, Close = 90.5257,Volume = 660187068},
         new ChartData { Date = new DateTime(2023, 04, 09), Open= 89.4471, High = 92,
                         Low = 86.2157, Close = 86.4614,Volume = 912634864},
         // More data
   };
    async Task ExcelExport()
    {
        await StockChartObj.ExportAsync(ExportType.XLSX, "StockChartData");
    }
}

Bug Fixes

#FB47913 - The issue with the Tooltip content not being read by screen readers is resolved.

Tree Grid

Features

Provided the OverScanCount property to reduces the frequency of rendering during scrolling. Check out the demo here.
Introduced new event support for actions performed within the tree grid. These new events significantly expand your ability to tailor and enhance your interactions within the tree grid, providing you with more control and flexibility. Below, you will find the corresponding event names and event argument details.

Event Information

Event Name	Argument Name	Properties	Description
Sorting	Syncfusion.Blazor.Grids.SortingEventArgs	Cancel, IsCtrlKeyPressed, Action, ColumnName, Direction, SortedColumns.	An event that is invoked before a sorting action is performed or a column is removed from sorting in the tree grid or when the sort column direction changes from Ascending to Descending or vice versa for the same column.
Sorted	Syncfusion.Blazor.Grids.SortedEventArgs	Action, ColumnName, Direction, SortedColumns.	An event callback that is raised after sorting action is performed in the tree grid.
Searching	Syncfusion.Blazor.Grids.SearchingEventArgs	Cancel, SearchText.	Gets or sets the event callback that is raised before the search action is performed in the tree grid.
Searched	Syncfusion.Blazor.Grids.SearchedEventArgs	SearchText	Gets or sets the event callback that is raised after the search action is performed in the tree grid.
RowCreating	Syncfusion.Blazor.Grids.RowCreatingEventArgs	Cancel, Data, Index, EditContext	Gets or sets the event callback that is raised before the add action is performed in the tree grid.
RowCreated	Syncfusion.Blazor.Grids.RowCreatedEventArgs	Data, Index, EditContext	Gets or sets the event callback that is raised after the add action is performed in the tree grid.
RowUpdating	Syncfusion.Blazor.Grids.RowUpdatingEventArgs	Cancel, IsShiftKeyPressed, KeyCode, Data, Index, PreviousData, PrimaryKeys, PrimaryKeyValue	Gets or sets the event callback that is raised before the save action is performed in the tree grid.
RowUpdated	Syncfusion.Blazor.Grids.RowUpdatedEventArgs	Data, Index, PreviousData, PrimaryKeys, PrimaryKeyValue	Gets or sets the event callback that is raised after the save action is performed in the tree grid.
RowDeleting	Syncfusion.Blazor.Grids.RowDeletingEventArgs	Cancel, Datas, PrimaryKeys	Gets or sets the event callback that is raised before the delete action is performed in the tree grid.
RowDeleted	Syncfusion.Blazor.Grids.RowDeletedEventArgs	Datas, PrimaryKeys	Gets or sets the event callback that is raised after the delete action is performed in the tree grid.
EditCanceling	Syncfusion.Blazor.Grids.EditCancelingEventArgs	Cancel, Data, PreviousData, PrimaryKeys, Index	Gets or sets the event callback that is invoked before the cancel action is performed in the tree grid, specifically when using normal and dialog edit modes.
EditCanceled	Syncfusion.Blazor.Grids.EditCanceledEventArgs	Data, PreviousData, PrimaryKeys, Index	Gets or sets the event callback that is invoked after the cancel action is performed in the tree grid, specifically when using normal and dialog edit modes.
Filtering	Syncfusion.Blazor.Grids.FilteringEventArgs	Cancel, PreventFilterQuery, FilterPredicates, ColumnName	Gets or sets the event callback that is raised before the filtering or clear filtering action is performed in the tree grid.
Filtered	Syncfusion.Blazor.Grids.FilteredEventArgs	FilterPredicates, ColumnName	Gets or sets the event callback that is raised after the filtered or clear filtered action is performed in the tree grid.
FilterDialogOpening	Syncfusion.Blazor.Grids.FilterDialogOpeningEventArgs	Cancel, ColumnName, CheckboxListData, FilterChoiceCount, FilterOperators	Gets or sets the event callback that is raised before the filter dialog is opened in the tree grid.
FilterDialogOpened	Syncfusion.Blazor.Grids.FilterDialogOpenedEventArgs	ColumnName, CheckboxListData, FilterChoiceCount	Gets or sets the event callback that is raised after the filter dialog is opened in the tree grid.
ColumnReordering	Syncfusion.Blazor.Grids.ColumnReorderingEventArgs	Cancel, ReorderingColumns, ToColumn	Gets or sets the event callback that is raised when columns reordering action is performed in the tree grid.
ColumnReordered	Syncfusion.Blazor.Grids.ColumnReorderedEventArgs	ReorderingColumns, ToColumn	Gets or sets the event callback that is raised when columns are reordered in the tree grid.
ColumnVisibilityChanging	Syncfusion.Blazor.Grids.ColumnVisibilityChangingEventArgs	Cancel, VisibleColumns, HiddenColumns	Gets or sets the event callback that is raised when the tree grid’s column visibility is changing.
ColumnVisibilityChanged	Syncfusion.Blazor.Grids.ColumnVisibilityChangedEventArgs	VisibleColumns, HiddenColumns	Gets or sets the event callback that is raised when the tree grid’s column visibility is changed.
OnRowEditStart	Syncfusion.Blazor.Grids.OnRowEditStartEventArgs	Cancel, PreventDataClone	Gets or sets the event callback that is raised before an editing action is performed in the tree grid.
RowEditing	Syncfusion.Blazor.Grids.RowEditingEventArgs	Cancel, PrimaryKeys, PrimaryKeyValue, Data, Index, EditContext, ForeignKeyData	Gets or sets the event callback that is raised before the edit action is performed in the tree grid.
RowEdited	Syncfusion.Blazor.Grids.RowEditedEventArgs	PrimaryKeys, PrimaryKeyValue, Data, Index, EditContext, ForeignKeyData	Gets or sets the event callback that is raised after the edit action is performed in the tree grid.
PageChanging	Syncfusion.Blazor.Grids.GridPageChangingEventArgs	Cancel, CurrentPage, PreviousPage, CurrentPageSize, TotalPages.	Gets or sets the event callback that is raised before paging action is performed in the tree grid.
PageChanged	Syncfusion.Blazor.Grids.GridPageChangedEventArgs	CurrentPage, PreviousPage, CurrentPageSize, TotalPages.	Gets or sets the event callback that is raised after paging action is performed in the tree grid.

Breaking changes

Revamped the frozen feature by replacing the previous three-table approach with a single table, resulting in significant performance improvements and a reduction in file size.

TreeView

Bug Fixes

#I513048 - The Blazor TreeView drag and drop operation issues on touch devices have been resolved.
#I515720 - The performance issue while selecting the node in the WASM application has been resolved.

XlsIO

Features

#I499890 - I492252 – Pivot field grouping based on date and time is now supported.
#I523654 - Creating Excel documents in Spreadsheet XML format is now supported.
#I503008 - Provided IApplication.IsExcelFile API to detect whether the document is in Excel format.
The fallback font is now supported in Excel to PDF conversion and Worksheet to Image conversion.
Tiff image is now supported in Excel to PDF and Worksheet to Image conversion
The Excel Library now supports creating and parsing the following Excel functions: LAMBDA, SORT, BYROW, BYCOL, TOROW, TOCOL, CHOOSEROWS, CHOOSECOLS, TEXTSPLIT, and TEXTBEFORE.

Essential Studio for Blazor Release Notes

Common

Features

Accumulation Chart

Feature

AutoComplete

Bug fixes

BarcodeGenerator

Bug fix

Chart

Bug Fixes

Features

Circular Gauge

Features

Dashboard Layout

Bug Fixes

DataForm Preview

Data Grid

Bug Fixes

Features

Breaking Changes

Date Picker

Bug Fixes

Diagram

Features

Bug fixes

Dialog

Bug fixes

DocIO

Features

Bug Fixes

Document Editor

Features

Bug Fixes

Dropdown Tree Preview

File Manager

Breaking Changes

Features

Bug Fixes

Gantt Chart

Bug fixes

Features

Breaking changes

HeatMap

Features

Image Editor

Features

Breaking Changes

InPlace Editor

Bug fixes

Kanban

Bug fixes

Linear Gauge

Features

ListView

Bug Fixes

Maps

Features

Message

Bug Fixes

MultiSelect

Bug fixes

Pager

Features

Breaking Changes

PDF

Features

Bug Fixes

PDF Viewer

Features

Bug Fixes

Pivot Table

Bug fixes

Features

Breaking Changes

Presentation

Features

Range Selector

Feature

Rich Text Editor

DataForm `Preview`

Dropdown Tree `Preview`

Stepper `Preview`