Essential Studio for Blazor Release Notes

v25.1.35
March 15, 2024

Common

Features

  • New component: The Timeline component has been added in Blazor. Explore the demo here

  • Preview to production-ready components: The following components have been developed to meet industry standards and is now marked as production-ready
  • Syncfusion Blazor Components are now compliant with Web Content Accessibility Guidelines (WCAG) 2.2 standards.

  • Introducing the new Blazor Server and WASM Floor Planner, a showcase web application that allows you to create a floor planner to visually design and plan the layout of a floor or building, including the placement of walls, doors, windows, furniture, and other objects. Check out the Server demo link, WASM demo link, and GitHub source here.

  • Introducing the new Blazor Server and WASM Logic Circuit Designer, a showcase web application that allows you to create a logic circuit designer to visually design and simulate digital logic circuits using a wide range of logic gates, input and output components to better visualize and understand how it works, and share your design with others. Check out the Server demo link , WASM demo link, and GitHub source here.

Accumulation Chart

Bug Fix

  • #F186955 - Now, the pie chart legend is displayed when the y-value is zero.

AutoComplete

Features

  • Provided the support for Grouping with Virtualization in AutoComplete. You can check out the demo link here.

Chart

Bug Fixes

  • #I555465 - Fixed issue where range bar width is reduced while clicking the grid column.
  • #I562647 - Resolved issue where chart OnSeriesRender event was triggered multiple times on data update.
  • Spline curve now displays properly for the logarithmic axis.

ComboBox

Features

  • Provided the support for Grouping with Virtualization in ComboBox. You can check out the demo link here.

Data Form

Features

  • Now you can enable floating label functionality in the DataForm by setting the EnableFloatingLabel property to true, which will dynamically move the label above the input field when the user interacts with the form.You can refer the following code example to enable the floating label in the DataForm.
<SfDataForm ID="MyForm" EnableFloatingLabel="true"
            Model="@EventRegistrationModel">

    <FormValidator>
        <DataAnnotationsValidator></DataAnnotationsValidator>
    </FormValidator>

</SfDataForm>

@code {
    private EventRegistration EventRegistrationModel = new EventRegistration()
        {
            FirstName = "Andrew",
            LastName = "Jack"
        };
    public class EventRegistration
    {
        [Required(ErrorMessage = "Please enter your name.")]
        [Display(Name = "First Name")]
        public string FirstName { get; set; }
        [Required(ErrorMessage = "Please enter your last name.")]
        [Display(Name = "Last Name")]
        public string LastName { get; set; }
        [Required(ErrorMessage = "Please enter your email address.")]
        [EmailAddress(ErrorMessage = "Please enter a valid email address.")]
        [Display(Name = "Email ID")]
        public string Email { get; set; }
        [Required(ErrorMessage = "Please enter your phone number.")]
        [Display(Name = "Phone Number")]
        [RegularExpression(@"^\d{10}$", ErrorMessage = "Please enter a valid 10-digit phone number.")]
        public string PhoneNumber { get; set; }
    }
}

Additionally you can refer the demo here for further references.

  • HereAfter DataForm component supports following Data annotations attributes for the model properties.

    • DisplayAttribute - This attribute is used to specify the display name for the model property , Now ShortName , AutoGenerateField , Name , Prompt and GroupName properties will also be supported .
    • DataType - Determines which editor component should rendered based on the DataType attribute value.
    • StringLength - This attribute specifies the maximum and minimum length of characters that can be typed .
    • Bindable - This attribute specifies whether the field should be auto-generated or not. If bindable is set to false, the field will not be auto-generated.
    • ReadOnly - This attribute specifies whether the field should be read-only or not. If ReadOnly is set to true, the field will be read-only.

Bug Fixes

  • I551037 - Resolved the issue where OnUpdate event is not triggering properly when Model property is used.

  • FB50573 - Fixed an issue with ColumnSpan not working correctly in Data Form.

  • F186741 - Resolved the issue where a Console error occurs when assigning a value to the fields of the DataForm in the ParameterSetAsync life cycle.

Data Grid

Bug Fixes

  • #FB51205 - Resolved the issue where filtering didn’t work properly when used with Query property.
  • #I562142 - Resolved the alignment issue in RTL mode when mapping the GridForeignColumn.
  • #FB51500, #F186732 - Resolved the issue where a console error was thrown while clicking on the add icon during dialog edit, particularly when a column visibility is set to false.

Features

  • #FB16721 - Enhanced drag-and-drop functionality between grids, enabling dragging and dropping rows using the drag icon.
  • #I541577 - Enhanced keyboard navigation support for virtualization-enabled DataGrid.
  • #FB25692 - The filtering functionality has been enhanced to include additional filter operators such as NotContains, NotStartWith, NotEndWith, Null, NotNull, IsEmpty and IsNotEmpty. Additionally, Like and Wildcard support have been added. Explore the demo here.
  • #FB36023 - Provided support to add current selection to the Excel and Checkbox filter. Explore the demo here.
  • #FB12524 - Added support for exporting the grid along with its detail template. Hierarchical grid export is now achievable through the exporting of detail templates. Explore the demo here.

Breaking Changes

  • Following the toolbar changes, we have revamped the rendering of toolbar items to utilize the Spacer element instead of relying on the Align property.

    <div class="e-toolbar-items e-tbar-pos">
        <div class="e-toolbar-left">
            <div class="e-toolbar-item " id="sfgridpkblvte1r1n_print" data-index="0" title="Print" aria-disabled="false" padding-left="4px"></div>
        </div>
        <div class="e-toolbar-center" style="margin-left: 468.5px;"></div>
        <div class="e-toolbar-right">
            <div class="e-toolbar-item e-cc e-ccdiv e-cc-toolbar" id="sfgridpkblvte1r1n_columnchooser" data-index="1" title="Columns" aria-disabled="false"></div>
        </div>
    </div>
    <div class="e-toolbar-items">
        <div class="e-toolbar-item " id="sfgridghk1kep2w2y_print" data-index="0" title="Print" aria-disabled="false" padding-left="4px"></div>
        <div class="e-toolbar-item e-spacer " id="e-toolbar-item-59968dce-93da-46aa-b7a3-26676476cf4d" data-index="1"></div>
        <div class="e-toolbar-item e-cc e-ccdiv e-cc-toolbar" id="sfgridghk1kep2w2y_columnchooser" data-index="2" title="Columns" aria-disabled="false"></div>
    </div>

Diagram

Features

  • #I284707 - Provided support for creating swimlane diagrams programmatically or interactively. A swimlane visually groups and categorizes activities or tasks based on the role or department responsible for their execution, aiding in illustrating complex processes involving multiple participants or departments within an organization.

  • #I284707 - Provided support for connectors to dynamically adjust their routes based on the placement or movement of nearby shapes. This feature is achieved by setting the Routing enum value to the constraints property of both the diagram and connectors, ensuring fluid and responsive layout adjustments.

  • Additional keys have been added to our diagram control to improve keyboard interaction.

  • Implemented styling support for symbol descriptions in the symbol palette items.

  • Provided annotation template support for diagram elements such as nodes, connectors, groups, swimlane headers, lanes, and phases. This support grants users the flexibility to customize and personalize their annotations using templates.

Bug fixes

  • #I524501 - Nodes are now rendered properly without overlapping, even with a large layout.
  • #I533276 - All SVG path nodes are now rendered correctly.
  • #F185859 - Rendering of nodes with multiple parents in a complex hierarchy layout now functions correctly.
  • #I559485 - The layout now renders properly when adding multiple path shape nodes in the onInitialized lifecycle method with a delay.

Breaking Changes

The following SymbolDescription class properties were marked as obsolete from 2024 Volume 1 release.

SymbolDescription Comments
TextOverflow This property is deprecated. Use Style.TextOverflow property instead.
TextWrapping This property is deprecated. Use Style.TextWrapping property instead.

Diagram(Classic)

Breaking Changes

With this release, made the decision to exclude the Blazor Diagrams (classic) component from the Syncfusion.Blazor NuGet package. Furthermore, following this release, discontinued the publication of the Syncfusion.Blazor.Diagrams NuGet package and critical bug fixes are provided as patches. Therefore, you are strongly encouraged to migrate to Syncfusion.Blazor.Diagram package. See the migration guide at https://blazor.syncfusion.com/documentation/diagram/migration-classic-to-native for more details.

Dialog

Breaking Changes

  • The Header,Content and Footer property will now sanitize the content to prevent the XSS attacks in the Dialog component. To render HTML content in Dialog component, utilize the DialogTemplates.

  • The DialogButton will now sanitize the Content property to prevent the XSS attacks in the Dialog component. To display HTML content in a DialogButton, you can render it as child content.

Previous

<SfDialog ID="Sample-ID" Width="500px" Visible="true" Header="Templates in Blazor Dialog Component"
          Content="In <a href="https://www.syncfusion.com/blazor-components/blazor-modal-dialog" target="_blank" rel="noreferer noopener">Blazor Dialog</a>, the template support is provided to the header, content and footer sections. So any text or HTML content can be appended in these sections." >
    <DialogButtons>
        <DialogButton IsPrimary="true" Content="<a aria-label=" Opens in a new tab" id='newTab' href='https://blazor.syncfusion.com/documentation/dialog/template' target='_blank'>Learn More</a>"></DialogButton>
    </DialogButtons>
</SfDialog>

Now

<SfDialog ID="Sample-ID" Width="500px" Visible="true">
    <DialogTemplates>
        <Header>Templates in Blazor Dialog Component</Header>
        <Content>
            <p>
                In <a href="https://www.syncfusion.com/blazor-components/blazor-modal-dialog" target="_blank" rel="noreferer noopener">Blazor Dialog</a>, the template support is provided to the header and footer sections. So any text or HTML content can be appended in these sections."
            </p>
        </Content>
    </DialogTemplates>
    <DialogButtons>
        <DialogButton IsPrimary="true">
            <a aria-label=" Opens in a new tab" id='newTab' href='https://blazor.syncfusion.com/documentation/dialog/template' target='_blank'>Learn More</a>
        </DialogButton>
    </DialogButtons>
</SfDialog>

DocIO

Features

  • #I370047, #I515686, #I107555, #I108644, #I116892, #I237097, #I237965, #I257681, #I336732, #F163416 - Now, include \c and \a switches while updating the Table of Contents (TOC) to build table of figures in the Word document.
  • #I565373, #I521060 - Added support to preserve charts with shapes in Word to PDF or image conversion.
  • Added support for wrapped axis titles in charts during Word to PDF or image conversion.
  • Provided support for series line cap formatting in charts during Word to PDF or image conversion.
  • Added support for line dash style formatting in scatter and line charts during Word to PDF or image conversion.
  • Added support for multilevel category labels in charts during Word to PDF or image conversion.
  • Provided support for 100% stacked line charts during Word to PDF or image conversion.
  • Added support for manually positioned chart titles during Word to PDF or image conversion.

Document Editor

Features

  • #I560979 - Added the server action settings API for spellcheck by page.
  • #I304171, #I269478, #419821, #I500679 - Added support for heading navigation support.
  • #I317930, #I318103, #I343750, #349393, #F164868 - Added change case functionality allows users to quickly change the capitalization of the selected text.
  • Document Editor now supports saving the document as a Word Template (DOTX).
  • #I458609, #I355736, #I257172, #I348514, #F165825 - Add support to customize color picker in Document Editor.

Features

  • Provided the support for Grouping with Virtualization in DropDownList. You can check out the demo link here.

Features

  • Provided the TextWrap support for multi line rendering of selected items text in the Blazor Dropdown Tree.
  • Provided the support to customize the selected item using SelectedItemTemplate property.
  • Provided new methods GetTreeViewData for fetching tree data and RefreshAsyncfor refreshing the changes in the Blazor Dropdown Tree component.

Bug Fixes

  • #F186940,#F186952 - The performance issue of the expand action with large data has been resolved.
  • #I555458 - Resolved the incorrect selection when binding the Value property.

File Manager

Features

  • #FB48027 - Provided support for rendering flat data objects in Blazor File Manager, removing the necessity for HTTP client requests and backend URL configuration. This enhancement also eliminates the need to define FileManagerAjaxSettings while rendering the component.

  • #FB46902 - Provided custom sorting support in Blazor File Manager through SortComparer property. This feature allows users to override the standard sorting functionality of the component.

  • Introduced new event support for actions performed within the File Manager component. These new events significantly expand your ability to tailor and enhance your interactions within the File Manager, 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
OnRead ReadEventArgs Path, Folder, Response, Cancel. Gets or sets an event callback that will be invoked when the initial data is set and when the sub folders data are read.
ItemsDeleting ItemsDeleteEventArgs Path, Files, Response, Cancel. Gets or sets an event callback that will be invoked before the delete operation takes place.
ItemsDeleted ItemsDeletedEventArgs Files. Gets or sets an event callback that will be invoked when the file or folder is deleted successfully.
FolderCreating FolderCreateEventArgs Path, ParentFolder, FolderName, Response, Cancel. Gets or sets an event callback that will be invoked before the folder is being created.
FolderCreated FolderCreatedEventArgs Folder. Gets or sets an event callback that will be invoked when the new folder is created successfully.
Searching SearchEventArgs Path, SearchText, Response, Cancel. Gets or sets an event callback that will be invoked when the character is entered in input box for searching files or folders.
Searched SearchedEventArgs SearchResult. Gets or sets an event callback that will be invoked when the search action is completed.
ItemRenaming ItemRenameEventArgs Path, NewName, ShowFileExtension, File, Response, Cancel. Gets or sets an event callback that will be invoked when the file or folder is being renamed.
ItemRenamed ItemRenamedEventArgs File. Gets or sets an event callback that will be invoked when the file or folder is renamed successfully.
ItemsMoving ItemsMoveEventArgs Path, IsCopy, TargetPath , Files, TargetData, Response, Cancel. Gets or sets an event callback that will be invoked when the file or folder is being cut or copied for the reason to be pasted in another path.
ItemsMoved ItemsMovedEventArgs Files. Gets or sets an event callback that will be invoked when the file or folder is being pasted to the destination path.
ItemsUploading ItemsUploadEventArgs Path, Folder, CustomData, Cancel. Gets or sets an event callback that will be invoked when the file or folder upload begins.
ItemsUploaded ItemsUploadedEventArgs Path, Files, IsSelected, AutoDialogClose. Gets or sets an event callback that will be invoked when the file or folder is uploaded.

Bug Fixes

  • #I557469 - The CSS issue affecting the breadcrumb bar of the File Manager component has been resolved.
  • #F186798 - Resolved an icon issue when adding custom context menu item in the File Manager layout.
  • #I557690 - Resolved the issue of switching views from large icons to details view while selecting any file or folder.
  • #F186903 - The issue regarding the drag and drop of multiple items exceeding the component boundary has been resolved.
  • #F185799 - The console error when double-clicking to open the folder in the Blazor FileManager with SQL provider has been resolved.

Gantt Chart

Bug fixes

  • #I563612 - The issue with “The updated record did not get properly in the Custom Adaptor” has been resolved.

Features

  • #I425512 - Introduced split-tasks support in the Gantt Chart, enabling uses to visualize multiple task bars within a single row. This feature enhances the representation of tasks with interruptions or breaks, providing a more detailed and comprehensive view of project timelines and progress. Find the demo link here.
  • #I470918 - Provided support for maintaining dependency lines continuity across all pages while virtualization is enabled.
  • The table below provides information on new and updated methods to Gantt Chart.

    Method Description
    AutoFitColumnsAsync Updates the column width to auto-fit their content, ensuring that the width displays the content without wrapping or hiding.
    FilterByColumnAsync Enhanced this method to perform complex filtering.
    ResetZoomAsync Resets the zoom level to its initial state, as configured during the initial rendering.

Image Editor

Breaking Changes

  • Additional parameter for below mentioned public methods have been added.

    Method Parameter Type Remarks
    ClearSelectionAsync resetCrop boolean Specifies to reset last cropped image selection
    DrawEllipseAsync degree double Specifies the degree to rotate the ellipse
    DrawEllipseAsync isSelected boolean Specifies to show the shape in the selected state
    DrawArrowAsync isSelected boolean Specifies to show the shape in the selected state
    DrawPathAsync isSelected boolean Specifies to show the shape in the selected state
    DrawLineAsync isSelected boolean Specifies to show the shape in the selected state
    DrawRectangleAsync degree double Specifies the degree to rotate the rectangle
    DrawRectangleAsync isSelected boolean Specifies to show the shape in the selected state
    DrawTextAsync isSelected boolean Specifies to show the shape in the selected state
    DrawImageAsync degree double Specifies the degree to rotate the image
    DrawImageAsync opacity double Specifies the opacity value for the image
    DrawImageAsync isSelected boolean Specifies to show the shape in the selected state
    UpdateShapeAsync isSelected boolean Specifies to show the shape in the selected state
  • Additional parameter for ShapeSettings public class have been added.

    Parameter Type Remarks
    Degree double? Specifies the degree of rotated shape
    Opacity double? Specifies the opacity value of the image shape
    RadiusX double? Specifies the width radius of the ellipse shape
    RadiusY double? Specifies the height radius of the ellipse shape
    EndX double? Specifies the X position of the line / arrow shape
    EndY double? Specifies the Y position of the line / arrow shape
    ArrowHead ImageEditorArrowHeadType? Specifies the head type of arrow shape
    ArrowTail ImageEditorArrowHeadType? Specifies the tail type of arrow shape

InPlace Editor

Breaking Changes

  • The InPlaceEditorSaveButton and InPlaceEditorCancelButton will now sanitize the Content property to prevent XSS attacks in the InPlace Editor component. To display HTML content, you can render it as child content.

Previous

<SfInPlaceEditor @bind-Value="@TextValue" TValue="string">
    <EditorComponent>
        <SfTextBox @bind-Value="@TextValue" Placeholder="Enter some text"></SfTextBox>
    </EditorComponent>
    <InPlaceEditorSaveButton Content="<span class="e-icons e-check"></span>" CssClass="e-outline"></InPlaceEditorSaveButton>
    <InPlaceEditorCancelButton Content="<span class="e-icons e-close"></span>" CssClass="e-outline"></InPlaceEditorCancelButton>
</SfInPlaceEditor>

@code {
    public string TextValue = "Andrew";
}

Now

<SfInPlaceEditor @bind-Value="@TextValue" TValue="string">
    <EditorComponent>
        <SfTextBox @bind-Value="@TextValue" Placeholder="Enter some text"></SfTextBox>
    </EditorComponent>
    <InPlaceEditorSaveButton CssClass="e-outline"><span class="e-icons e-check"></span></InPlaceEditorSaveButton>
    <InPlaceEditorCancelButton CssClass="e-outline"><span class="e-icons e-close"></span></InPlaceEditorCancelButton>
</SfInPlaceEditor>

@code {
    public string TextValue = "Andrew";
}

Kanban

Bug Fixes

  • #F186919 - Now the DialogOpen event is triggered once upon double-clicking on the card in the Kanban component.

ListBox

Features

  • Provided the Readonly property support to Blazor Listbox component.

Maps

Features

  • #F185586 - The tooltip and its template can now be displayed over the polygon shapes in the Maps. Tooltip templates can include custom items such as images, text, and HTML elements.

MultiSelect

Bug fixes

  • #FB51454 - Fixed an issue with the SfMultiSelect component where pressing space would select the first item.

PDF

Features

  • Added support for remote goto actions in PDF documents.
  • Added support to identify and optimize identical resources when merging PDF documents.
  • #I530228 - Added support for image backgrounds in HTML file to image conversion.
  • #I486375 - Added support for creating accessible PDFs when converting from HTML to PDF formats.

Bug Fixes

  • #I554285 - Fixed an issue where sticky note comments were not being saved properly once the PDF was updated.
  • #I556724, #I555734 - Fixed issue where text extracted from a PDF document was not being returned properly.

PDF Viewer

Features

  • #I435195 - The support for the AddAnnotationAsync and DeleteAnnotationAsync APIs, enabling the programmatic addition and deletion of annotations, has been enhanced. This improvement extends to all toolbar actions in the PDF Viewer. Additionally, we have implemented additional functionalities for the EditAnnotationAsync API, and it is now functioning as intended.
  • #I523192 - The DocumentEdited event has been exposed to detect document changes, allowing for real-time notification whenever the document is modified.
  • #I474691 - Support for borders in link annotations has been implemented.
  • #I516401 - PDF actions have been implemented within the existing buttons of the PDF document.
  • #I499700 - Implemented support for FitToHeight in the Blazor PDF Viewer.
  • Integrated customizable toolbar support in the mobile and desktop application, enabling the addition of toolbar items at specified indices.
  • Enhanced Blazor PDF viewer with shortcut key support for page navigation, downloading, and panel visibility for comments, bookmarks, and thumbnails.

Bug Fixes

  • #I539561 - Resolved improper pinch behavior during pinch zoom at designated location, ensuring expected point alignment for seamless zooming.
  • #I543182 - Resolved the issue where loading a PDF with a stamp annotation would trigger the AnnotationAdd event.
  • #I539542 - When adding ink annotation with zooming, switching from selection to pan mode using Apple Pencil now functions correctly in the MAUI sample.
  • #I544544 - Resolved smooth scrolling issue in MAUI Hybrid app’s PDFViewer.
  • #I547043 - Toolbar button tooltips are now capitalized properly.
  • #I546635 - Resolved the issue where pressing the delete key while entering a comment on the comment panel deletes the annotation.
  • #I516387 - Print functionality is now working properly in various browsers.
  • #I550924 - Search completed message now appears even when all search matches are on the first page.
  • #I554355 - The IsDocumentEdited property is now updated properly when deleting existing custom stamps.
  • #I533202 - Now, clicking the form field now correctly focuses only the clicked form field instead of the entire component on iPhone.
  • #I555841 - On a mobile device, selecting a word now properly highlights only the selected word instead of the whole page.
  • #I557250 - Resolved the web service not listening error when downloading the form-filled PDF.
  • #I557284 - Clicking the radio button using the UpdateFormFieldsAsync API now correctly reflects the changes when downloading and loading in Adobe.
  • #F186838 - The slowness issue in adding and moving shape annotations has been resolved, and the annotation movement is now faster and more responsive.
  • #I559395 - Small shape annotations are now displayed correctly in the PDF Viewer when importing annotations.
  • #I559817 - The GetDocumentAsync API in the Blazor PDF Viewer NextGen now correctly returns the document

Pivot Table

Features

  • #F174398 - Provided support to display pivot chart’s series for multiple measures on a single y-axis. Check out the demo here.

Presentation

Features

  • #I520747, #F176520 - Provided APIs to crop pictures in PowerPoint Presentations, similar to the crop options in Microsoft PowerPoint.
  • #I548180 - Provided an API overload ISlides.Add(ISlide clonedSlide, PasteOptions pasteOptions) to add the cloned slide in the PowerPoint Presentation.
  • #I565373, #I521060 - Added support to preserve charts with shapes in PowerPoint to PDF or image conversion.
  • Added support for wrapped axis titles in charts during PowerPoint to PDF or image conversion.
  • Provided support for series line cap formatting in charts during PowerPoint to PDF or image conversion.
  • Added support for line dash style formatting in scatter and line charts during PowerPoint to PDF or image conversion.
  • Added support for multilevel category labels in charts during PowerPoint to PDF or image conversion.
  • Provided support for 100% stacked line charts during PowerPoint to PDF or image conversion.
  • Added support for manually positioned chart titles during PowerPoint to PDF or image conversion.

Query Builder

Features

  • Provided Mongo Query support which helps to get / set the mongo query using the GetMongoQuery and SetMongoQuery methods in the Blazor QueryBuilder. Explore the demo here.

  • Provided the Parameter SQL and Named Parameter SQL support which helps to get the parameter SQL and named parameter SQL queries from the query builder using the GetParameterSql and GetNamedParameterSql methods. And set the parameter SQL and named parameter SQL to the query builder using the SetParameterSql and SetNamedParameterSql methods in the Blazor QueryBuilder. Explore the demo here.

  • Provided the Clone support to query builder which will create an exact replica of a rule or group next to the original using the CloneRule and CloneGroup methods in the Blazor QueryBuilder. Explore the demo here.

  • Provided the Lock support which locks all the component in the rule to prevent interaction using the LockRule and LockGroup methods in the Blazor QueryBuilder. Explore the demo here.

Rich Text Editor

Bug fixes

  • #I556446 - Now, when you copy and paste an image in the Rich Text Editor, it works properly.

  • #I564853 - Now the toolbar items show properly when EnableRtl is set to true in the Rich Text Editor.

Schedule

Bug fixes

  • #I514727 - The issue where appointments were rendered in incorrect slots after CRUD operations, before correcting themselves, has been fixed.

Stepper

Bug Fixes

  • #I564974 - Now the issue with Stepper StepRendered event called in loop has been resolved.

Stock Chart

Feature

  • #I509331 - New ExportCompleted event support has been provided for the StockChart Component.

Timeline Preview

The Timeline component enables users to display a series of data in chronological order, providing a visually compelling and user-friendly experience. This showcases user activities, tracking progress, narrating historical timelines, and more.

Explore the demo here

Features

  • Orientation - Display items in a horizontal or vertical orientation.
  • Opposite content - Display additional information opposite to the item content.
  • Items alignment - Items’ content and opposite content can be aligned - before, after, alternate, or alternate reverse.
  • Reverse timeline - Shows the timeline items in the reverse order.
  • Templates - Customize the default appearance, including styling the dot item, templated content, and more.

Toolbar

Features

  • Introducing the Spacer toolbar item type, developed to address the flickering issue that occurs when toolbar items are aligned using the Align property, Spacer ensures a smoother user experience during initial loading. By aligning items using CSS flex, Spacer resolves these glitches and enhances the overall loading performance.

Previously we used Align property to align the toolbar items

<SfToolbar>
    <ToolbarItems>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-cut" Text="Cut" Align="ItemAlign.Left"></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-copy" Text="Copy" Align="ItemAlign.Left" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-paste" Text="Paste" Align="ItemAlign.Left" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-bold" Text="Bold" Align="ItemAlign.Center"></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-underline" Text="Underline" Align="ItemAlign.Center" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-italic" Text="Italic" Align="ItemAlign.Right" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-paint-bucket" Text="Color-Picker" Align="ItemAlign.Right" ></ToolbarItem>
    </ToolbarItems>
</SfToolbar>

Now, we recommend using the Spacer to overcome the initial loading glitches

<SfToolbar>
    <ToolbarItems>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-cut" Text="Cut"></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-copy" Text="Copy" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-paste" Text="Paste" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Spacer"></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-bold" Text="Bold" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-underline" Text="Underline" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Spacer"></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-italic" Text="Italic" ></ToolbarItem>
        <ToolbarItem Type="ItemType.Button" PrefixIcon="e-icons e-paint-bucket" Text="Color-Picker" ></ToolbarItem>
    </ToolbarItems>
</SfToolbar>

Tooltip

Bug Fixes

  • The Content property will now sanitize the content to prevent the XSS attacks in the Tooltip component. To render HTML content in Tooltip content, utilize the ContentTemplate property.

Tree Grid

Bug fixes

  • #I556647, #I546411 - Resolved the issue where expanding and scrolling a single root node showed no records.
  • #I555105 - Fixed an issue where records were not added correctly by dynamically changing the new row position at runtime.
  • #F51270 - Resolved an issue where drag and drop functionality was not working correctly when selecting a record and dropping it onto a selected record from another parent.

Features

  • Improved drag-and-drop functionality between tree grid rows by introducing drag icons in a tree grid column. Users can now utilize the drag icon in each row to reorder the rows via drag-and-drop action. For more details, refer to the documentation.
  • The filtering functionality has been improved with addition of new filter operators: NotContains, NotStartWith, NotEndWith, Null, NotNull, IsEmpty and IsNotEmpty. Furthermore, support for Like and Wildcard has been introduced. Explore the enhanced filtering capabilities in the demo here.

TreeView

Bug Fixes

  • #I556763 - The issue where details of DroppedNodeData were missing in the OnNodeDragStop event has been successfully resolved.
  • #I562464 - The performance issue of the check action with large data in WASM has been resolved.

XlsIO

Features

  • Provided support for wrapped axis titles in chart to image conversion.
  • Provided support for series line cap formatting in chart to image conversion.
  • Provided support for line dash style formatting in scatter and line charts in chart to image conversion.
  • Provided support for multilevel category labels in chart to image conversion.
  • Provided support for 100% stacked line chart in chart to image conversion.
  • Provided support for manually positioned chart titles in chart to image conversion.

Bug Fixes

  • #I552205 - Dotted lines are not rendered properly issue is fixed in the chart to image conversion.
  • Argument out-of-range exception thrown when resaving the Excel file in Thai culture is fixed.