Ignite UI for Blazor Changelog

    All notable changes for each version of Ignite UI for Blazor are documented on this page.


    IgniteUI.Blazor (Charts)

    • Added the highly-configurable DataLegend component, which works much like the Legend, but it shows values of series and provides many configuration properties for filtering series rows and values columns, styling and formatting values.
    • Added the highly-configurable DataToolTip which displays values and titles of series as well as legend badges of series in a tooltip. This is now the default tooltip for all chart types.
    • Added animation and transition-in support for Stacked Series. Animations can be enabled by setting the IsTransitionInEnabled property to true. From there, you can set the TransitionInDuration property to determine how long your animation should take to complete and the TransitionInMode to determine the type of animation that takes place.
    • Added AssigningCategoryStyle event, is now available to all series in DataChart. This event is handled when you want to conditionally configure aspects of the series items such as Fill background-color and highlighting.
    • New AllowedPositions enumeration for IgbCalloutLayer. Used to limit where the callouts are to be placed within the chart. By default, the callouts are intelligently placed in the best place but this used to force for example TopLeft, TopRight, BottomLeft or BottomRight.
    • New corner radius properties added for Annotation Layers; used to round-out the corners of each of the callouts. Note, a corner radius has now been added by default.
    • New HorizontalViewScrollbarMode and VerticalViewScrollbarMode enumeration to enable scrollbars in various ways. When paired with IsVerticalZoomEnabled or IsHorizontalZoomEnabled, you'll be able to persist or fade-in and out the scrollbars along the axes to navigate the chart.
    • New FavorLabellingScaleEnd, determines whether the axis should favor emitting a label at the end of the scale. Only compatible with Numeric axes (e.g. IgbNumericXAxis, IgbNumericYAxis, IgbPercentChangeYAxis).
    • New IsSplineShapePartOfRange determines whether to include the spline shape in the axis range requested of the axis.
    • New XAxisMaximumGap, determines the maximum allowed value for the plotted series when using XAxisGap. The gap determines the amount of space between columns or bars of plotted series.
    • New XAxisMinimumGapSize, determines the minimum allowed pixel-based value for the plotted series when using XAxisGap to ensure there is always some spacing between each category.

    IgniteUI.Blazor (DockManager)

    • The Blazor Dock Manager is now in "Preview" state, that provides a way to manage a complex layout using different type of panes with various sizes, positions, and behaviors, and that can be docked to various locations within an app. The dock manager allows your end-users to customize it further by pinning, resizing, moving, floating, and hiding panes.

    IgniteUI.Blazor (Data Grid)

    Pagination is used to split a large set of data into a sequence of pages that have similar content. With pagination, data can be displayed in a set number of rows, letting users “scroll” through their data, without needing a scroll bar. The UI for table pagination usually includes things like the current page, total pages, and clickable Previous and Next arrows/buttons that let users flip through the pages of data.

    New Components



    The following breaking changes were introduced

    IgniteUI.Blazor (Data Grid)

    • Changed ValueField property from type string[] to string.

    IgniteUI.Blazor (Inputs)

    • A new ValueChanged event supports 2-way binding and should only be handled if you have not bound the Value property. In order to read the Value field from the control without databinding the ValueChanged event should be handled, otherwise if your data is not bound you should use GetCurrentValueAsync to read the controls Value.

    Date Picker

    • Changed ValueChanged event to SelectedValueChanged.

    Multi-Column ComboBox

    • Changed TextChanged event to TextValueChanged.
    • Changed ValueChanged event to SelectedValueChanged.



    The Igb prefix is now required for the Ignite UI for Blazor components and nested elements within each component. This API change was necessary to avoid ambiguity between Infragistics controls and 3rd party controls.

    For example, <IgbCategoryChart/> instead of <CategoryChart/>

    New Components

    Chart and Map Improvements

    This release introduces a few improvements and simplifications to visual design and configuration options for the geographic map and all chart components.

    Old brushes/outlines New outline/brushes

    IgniteUI.Blazor (Data Grid)

    • New Features Added:
    • New API:
      • Added SelectionChanged event. Used to detect changes on selection interactions e.g. Multiple row selection.
    • Breaking Changes:
      • Changed grid's SummaryScope property's type to SummaryScope from DataSourceSummaryScope
      • Changed GroupHeaderDisplayMode property's type to GroupHeaderDisplayMode from DataSourceSectionHeaderDisplayMode


    New Visual Designs

    Charts & Maps

    This release introduces several new and improved visual design and configuration options for all of the chart components, e.g. DataChart, IgbCategoryChart, and IgbFinancialChart.

    • Changed Bar/Column/Waterfall series to have square corners instead of rounded corners
    • Changed Scatter High Density series’ colors for heat min property from #8a5bb1 to #000000
    • Changed Scatter High Density series’ colors for heat max property from #ee5879 to #ee5879
    • Changed Financial/Waterfall series’ NegativeBrush and NegativeOutline properties from #C62828 to #ee5879
    • Changed marker's thickness to 2px from 1px
    • Changed marker's fill to match the marker's outline for IgbPointSeries, IgbBubbleSeries, IgbScatterSeries, IgbPolarScatterSeries. You can use set MarkerFillMode property to Normal to undo this change
    • Compressed labelling for the IgbTimeXAxis and IgbOrdinalTimeXAxis
    • New Marker Properties:
      • series.MarkerFillMode - Can be set to MatchMarkerOutline so the marker depends on the outline
      • series.MarkerFillOpacity - Can be set to a value 0 to 1
      • series.MarkerOutlineMode - Can be set to MatchMarkerBrush so the marker's outline depends on the fill brush color
    • New Series Property:
      • series.OutlineMode - Can be set to toggle the series outline visibility. Note, for Data Chart, the property is on the series
    • New chart properties that define bleed over area introduced into the viewport when the chart is at the default zoom level. A common use case is to provide space between the axes and first/last data points. Note, the ComputedPlotAreaMarginMode, listed below, will automatically set the margin when markers are enabled. The others are designed to specify a Double to represent the thickness, where PlotAreaMarginLeft etc. adjusts the space to all four sides of the chart:
    • New Highlighting Properties
      • chart.HighlightingMode - Sets whether hovered or non-hovered series to fade, brighten
      • chart.HighlightingBehavior - Sets whether the series highlights depending on mouse position e.g. directly over or nearest item
      • Note, in previous releases the highlighting was limited to fade on hover.
    • Added Highlighting Stacked, Scatter, Polar, Radial, and Shape series:
    • Added Annotation layers to Stacked, Scatter, Polar, Radial, and Shape series:
    • Added support for overriding the data source of individual stack fragments within a stacked series
    • Added custom style events to Stacked, Scatter, Range, Polar, Radial, and Shape series
    • Added support to automatically sync the vertical zoom to the series content
    • Added support to automatically expanding the horizontal margins of the chart based on the initial labels displayed
    • Redesigned color palette of series and markers:
    Old brushes/outlines New outline/brushes

    for example:

    Chart Legend

    • Added horizontal Orientation property to ItemLegend that can be used with Bubble, Donut, and Pie Chart
    • Added LegendHighlightingMode property - Enables series highlighting when hovering over legend items

    Geographic Map


    These features are CTP

    • Added support for wrap around display of the map (scroll infinitely horizontally)
    • Added support for shifting display of some map series while wrapping around the coordinate origin
    • Added support for highlighting of the shape series
    • Added support for some annotation layers for the shape series

    IgniteUI.Blazor (Data Grid)

    • Added EditOnKeyPress aka Excel-style Editing, instantly begin editing when typing.
    • Added EditModeClickAction property - By default double-clicking is required to enter edit mode. This can be set to SingleClick to allow for edit mode to occur when selecting a new cell.
    • Added EnterKeyBehaviors property - aka Excel-style Navigation (Enter Behavior) – controls the behavior of the enter key, e.g. Options are (none, edit, move up, down, left, right)
    • Added EnterKeyBehaviorAfterEdit property - While in edit-mode, this property controls when enter is pressed, e.g. Options are (moves to the cell below, above, right, left)
    • Added SelectAllRows - method.
    • Added Row Range Selection - With GridSelectionMode property set to MultipleRow the following new functionality is now included:
      • Click and drag to select rows
      • Shift and click to select multiple rows.
      • Shift and press the up/down arrow keys to select multiple rows.
    • Pressing space bar toggles selection of active row via GridSelectionMode property set to MultipleRow or SingleRow
    • Added Column Summaries to Column Options Dialog.

    IgniteUI.Blazor (Inputs)

    Date Picker

    • ShowTodayButton - Toggles Today button visibility
    • Label - Adds a label above the date value
    • Placeholder property - adds custom text when no value is selected
    • FormatString - Customize input date string e.g. (yyyy-MM-dd)
    • DateFormat - Specifies whether to display selected dates as LongDate or ShortDate
    • FirstDayOfWeek - Specifies first day of week
    • FirstWeekOfYear - Specifies when to display first week of the year, e.g. (First Full Week, First Four day Week)
    • ShowWeekNumbers - Toggles Week number visibility
    • MinDate & MaxDate - Date limits, specifying a range of available selectable dates.
    • Added Accessibility