Registro de cambios Ignite UI for React

    Todos los cambios notables para cada versión de Ignite UI for React están documentados en esta página.

    19.3.0 (November 2025)

    igniteui-react-charts (Charts)

    User Annotations

    In Ignite UI for React, you can now annotate the IgrDataChart with slice, strip, and point annotations at runtime using the new user annotations feature. This allows the end user to add more details to the plot such as calling out single important events such as company quarter reports by using the slice annotation or events that have a duration by using the strip annotation. You can also call out individual points on the plotted series by using the point annotation or any combination of these three.

    This is directly integrated with the available tools of the IgrToolbar.

    React user-annotation-create

    Collision Detection for Axis Annotations

    Ability for axis annotations to automatically detect collisions and truncate to fit better. To enable this feature you must set the following properties:

    • ShouldAvoidAnnotationCollisions
    • ShouldAutoTruncateAnnotations

    igniteui-react-maps (Geographic Map)

    • Azure Map Imagery is now RTM.

    Correcciones

    Número de error Control Descripción
    40136 Biblioteca de Excel FormulaParseException exception when loading an Excel workbook
    40262 Hoja de cálculo Igr #Circularity! is displayed when there are warnings. Request to match Excel - display a value eg. 0 instead
    40458 Hoja de cálculo Igr When using Arial font, the igx-spreadsheet cuts off text in the cells
    40490 IgrDatePicker Inputs by Autofill won't give any effects for a date picker

    19.3.0 (October 2025)

    New Components

    igniteui-react-grids (Grids)

    • grid, IgrTreeGrid, IgrHierarchicalGrid

      • Se introdujo una nueva función de combinación de celdas que le permite configurar y combinar celdas en una columna basada en los mismos datos u otra condición personalizada, en una sola celda.

            It can be enabled on the individual columns:

    ```tsx
    <IgrColumn field="field" merge={true}></IgrColumn>
    ```
    The merging can be configured on the grid level to apply either:

        • onSort - only when the column is sorted.

        • always - always, regardless of data operations.

            ```tsx
  <IgrGrid cellMergeMode="always">
  </IgrGrid>
  ```

  The default `cellMergeMode` is `onSort`.

  The functionality can be modified by setting a custom `mergeStrategy` on the grid, in case some other merge conditions or logic is needed for a custom scenario.

  It's possible also to set a `mergeComparer` on the individual columns, in case some custom handling is needed for a particular data field.

      • Added ability to pin individual columns to a specific side (start or end of the grid), so that you can now have pinning from both sides. This can be done either declaratively by setting the pinningPosition property on the column:

            ```tsx
    <IgrColumn field="Col1" pinned={true} pinningPosition="pinningPosition">
    </IgrColumn>
    ```

    ```ts
    pinningPosition = ColumnPinningPosition.End;
    ```

    Or with the API, via optional parameter:

    ```ts
    grid.pinColumn('Col1', 0, ColumnPinningPosition.End);
    grid.pinColumn('Col2', 0, ColumnPinningPosition.Start);
    ```

    If property `pinningPosition` is not set on a column, the column will default to the position specified on the grid's `pinning` options for `columns`.

      • Sorting improvements

        • Eficiencia mejorada del algoritmo de clasificación mediante la transformación de Schwartz. Esta es una técnica, también conocida como decorar-ordenar-desdecorar, que evita volver a calcular las claves de ordenación asociándolas temporalmente con los registros de datos originales.
        • Algoritmos de ordenación refactorizados de recursivo a iterativo.

      • Mejoras de Groupby

        • Algoritmo de agrupación refactorizado de recursivo a iterativo.
        • Operaciones de agrupación optimizadas.

    Correcciones

    Número de error Control Descripción
    1853 Lista Se han eliminado las variables CSS duplicadas en los componentes y temas de la lista
    1871 Tarjeta Consumir colores de temas
    1873 Tarjeta Tamaño del avatar en el encabezado de la tarjeta
    1882 Charlar Acciones de mensaje no representadas después del último mensaje
    1885 Selector de fechas Evento de cambio no emitido para la configuración de entrada no editable
    1894 Selector de fechas Problemas al borrar el valor y el borde de la muesca en el tema Material

    19.2.2 (October 2025)

    igniteui-react-maps (Geographic Map)

    Compatibilidad con imágenes de Azure Map

    The GeographicMap now supports Azure-based map imagery, allowing developers to display detailed, dynamic maps across multiple application types. You can combine multiple map layers, visualize geographic data, and create interactive mapping experiences with ease.

    Nota: La compatibilidad con las imágenes de Mapas de Bing se está eliminando gradualmente. Las claves empresariales existentes se pueden seguir usando para acceder a Bing Maps, lo que garantiza que las aplicaciones actuales sigan funcionando mientras realiza la transición a Azure Maps.

    Explore algunos de los mapas de Azure disponibles públicamente aquí.

    igniteui-react-charts (Charts)

    Nuevos eventos de etiqueta de eje

    The following events have been added to the DataChart to allow you to detect different operations on the axis labels:

    • LabelMouseDown
    • LabelMouseUp
    • LabelMouseEnter
    • LabelMouseLeave
    • LabelMouseMove
    • LabelMouseClick

    Eje compañero

    Added CompanionAxis properties to the X and Y axis that allow you to quickly create a clone of an existing axis. When enabled using the CompanionAxisEnabled property, this will default the cloned axis to the opposite position of the chart and you can then configure that axes' properties.

    Contornos insertados de RadialPieSeries

    There is a new property called UseInsetOutlines to control how outlines on the IgrRadialPieSeries are rendered. Setting this value to true will inset the outlines within the slice shape, whereas a false (default) value will place the outlines half-in half-out along the edge of the slice shape.

    Cambios importantes

    igniteui-react-grids (Grids)

    Contenido de sufijo celular

    Added support for suffix content within the cells that allows you to add additional text or icons to the end of the cell value and style it. The full list of added properties for the cell suffix content is listed below and is available on the IgrDataGridColumn and CellInfo class:

    Tenga en cuenta que el tamaño máximo disponible para los iconos es de 24x24. Puede proporcionar un icono que sea más grande o más pequeño que esto, pero deberá configurar los ajustes del cuadro de vista para escalarlo correctamente para que quepa en el espacio de 24x24 para que sea completamente visible.

    Correcciones

    Número de error Control Descripción
    31624 IgrCategoryChart Resizing the containing window of the IgrCategoryChart causes the chart to fail to render the series
    27304 DataChart El rectángulo de zoom no está colocado de la misma manera que el rectángulo de fondo
    37930 DataChart El color del texto de superposición de anotación de datos no funciona
    30600 DoughnutChart No hay propiedad textStyle para el gráfico o la serie (el gráfico circular tiene esto)
    38231 grid La columna no anclada no vuelve a la posición original si existen columnas ocultas
    33861 Biblioteca de Excel Agregar un gráfico de líneas corrompe el archivo de Excel para la cultura alemana

    Enhancements

    IgrBulletGraph

    • Added new LabelsVisible property

    Gráficos

    • New properties added to the DataToolTipLayer, ItemToolTipLayer, and CategoryToolTipLayer to aid in styling: ToolTipBackground, ToolTipBorderBrush, and ToolTipBorderThickness

    • New properties added to the DataLegend to aid in styling: ContentBackground, ContentBorderBrush, and ContentBorderThickness. The ContentBorderBrush and ContentBorderThickness default to transparent and 0 respectively, so in order to see these borders, you will need to set these properties.

    • Added a new property to IgrChartMouseEventArgs called worldPosition that provides the world relative position of the mouse. This position will be a value between 0 and 1 for both the X and Y axis within the axis space.

    • Added highlightingFadeOpacity to IgrSeriesViewer and IgrDomainChart. This allows you to configure the opacity applied to highlighted series.

    • Expose CalloutLabelUpdating event for domain charts.

    IgrDataGrid

    • Added new property called stopPropagation to DataGrid which prevents mouse events from bubbling to parent elements

    IgrLinearGauge

    • Added new LabelsVisible property

    19.2.1 (September 2025)

    Enhancements

    • Se agregó una mejora: DatePicker debería actualizar la vista de calendario al escribir, como Selector de intervalo de fechas 1818

    Correcciones

    Número de error Control Descripción
    1831 Calendario Estilo de navegación
    1833 Tarjeta Estilos de tamaño de avatar igc ranurados en temas compatibles
    1826 combinado Altura inicial desplegable
    1827 combinado Estilos de tamaños de iconos para el tema Indigo
    1834 DatePicker, DateRangePicker Estilos deshabilitados
    1820 Aporte Estilos de ranura de prefijo y sufijo para el tema Bootstrap
    1824 Aporte Estilos de etiqueta y borde para el tema Material
    1836 Aporte Se ha eliminado la propiedad tabindex invalidada
    1827 Seleccionar Estilos de tamaños de iconos para el tema Indigo
    1809 Cambiar Usar la nueva propiedad de desplazamiento del pulgar
    1837 TileManager Escape incorrecto de la expresión regular interna

    19.2.0 (August 2025)

    • Form associated custom elements now expose the ig-invalid custom state for styling with the :state() CSS selector. See here for additional information
    • Form associated custom elements validity behavior. Now elements will try to mimic :user-invalid, and won't apply invalid styles unless interacted through the UI or through a form requestSubmit()/reset() invocation.

    Correcciones

    Número de error Control Descripción
    1786 Aporte Estado no válido en modo de solo lectura​
    1786 Aporte No se puede aplicar estilo al texto auxiliar
    1795 Tarjeta Avatar de igc ranurado en el tema Indigo
    1786 combinado El borde se superpone al texto de la etiqueta en estado no válido
    1799 Selector de fechas Estilos de alzado índigo
    1783 Selector de intervalo de fechas Devolver el foco a la entrada principal en las interacciones del teclado
    1792 Aporte Alineación de marcadores de posición y etiquetas en el tema Material
    1806 Cajón de navegación Update relative positions styles and animation
    1786 Seleccionar Problemas de temas de estado no válidos
    1797 Área de texto Problemas de interacción del tema material
    1797 Área de texto Comportamiento de cambio de tamaño con parte de sufijo
    1775 Calendario Rellenos de contenedores en modo vertical
    1731 Carrusel Pausar la rotación automática en el foco iniciado por el puntero
    1772 Carrusel Asegurarse de queonSlideChanged se emite un evento cuando se cambia una diapositiva
    1765 Selector de fecha Problemas de estilo
    1764 Selector de intervalo de fechas Bordes y elevación CSS
    1747 Entrada de archivos Estilos de sombra de cuadro no válidos de arranque
    1672 paso a paso Error al establecer la propiedad lineal en escenarios de representación diferida
    1768 Área de texto Estilos de estado de solo lectura
    1755 Desplegable Tamaño del icono en el tema Bootstrap
    1739 Entradas Posicionamiento de etiquetas y lógica de transición en el tema Material

    19.1.0 (July 2025)

    • Componente: selector de intervalo de fechas

    Breaking Changes

    Entrada de archivos

    • onChange & onCancel events detail now returns the underlying component files property.

    Información sobre herramientas

    • Tooltip events will no longer return its anchor target in its detail property

    Behavioral Changes

    Información sobre herramientas

    • Behavioral change: Tooltip default placement is 'bottom' now.
    • Behavioral change: Tooltip will not render an arrow indicator by default unless with-arrow is set.

    Enhancements

    • Se actualizaron los estilos de solo lectura de la mayoría de los componentes asociados al formulario en todos los temas para indicar mejor cuándo un componente está en estado de solo lectura.

    Correcciones

    Número de error Control Descripción
    1710 Selector de calendario y fecha Transferencia de fecha incorrecta para en ciertos escenarios
    1728 combinado Estilos de icono que no distinguen entre mayúsculas y minúsculas en temas
    1726 Aporte Reemplace el borde en el tema fluido con una sombra de cuadro
    1732 Aporte Color de fondo de estado enfocado en el tema Indigo
    1715 Área de texto Modificación de altura de etiqueta y altura de componente

    19.0.1 (July 2025)

    Correcciones

    Número de error Control Descripción
    36448 RadialGauge Las propiedades de formato de etiqueta radial no funcionan. (por ejemplo. Título, Subtítulos)

    igniteui-react-charts (Charts)

    • Add MaximumExtent and MaximumExtentPercentage properties for use with axis labels.

    19.0.0 (April 2025)

    igniteui-react-maps (Geographic Map)

    [!Note] As of June 30, 2025 all Microsoft Bing Maps for Enterprise Basic (Free) accounts will be retired. If you're still using an unpaid Basic Account and key, now is the time to act to avoid service disruptions. Bing Maps for Enterprise license holders can continue to use Bing Maps in their applications until June 30,2028. For more details please visit:

    Microsoft Bing Blogs

    igniteui-react-charts (Charts)

    • Añadido Capas de anotaciones de datos de gráficos:

      • Capa de banda de anotación de datos
      • Capa de línea de anotación de datos
      • Capa de rectificación de anotación de datos
      • Capa de segmento de anotación de datos
      • Capa de tira de anotación de datos

    • The Data Tooltip and Data Legend expose LayoutMode property that you can use to layout the contents of the tooltip or legend in a table or vertical layout structure.

    • The defaultInteraction property of the charts has been updated to include a new enumeration - DragSelect in which the dragged preview Rect will select the points contained within.

    • The ValueOverlay and ValueLayer, in addition to the Chart Data Annotations listed above now expose an OverlayText property that can be used to overlay additional annotation text in the plot area. These appearance of these annotations can be configured by using the many OverlayText-prefixed properties. For example, the OverlayTextBrush property will configure the color of the overlay text.

    • Tipo de serie de capas de línea de tendencia que le permite aplicar una sola línea de tendencia por capa de línea de tendencia a una serie en particular. Esto permite el uso de múltiples líneas de tendencia en una sola serie, ya que puede tener varios tipos de series TrendlineLayer en el gráfico.

    igniteui-react-dashboards (Dashboards)

    • The IgrDashboardTile now supports propagating the aggregations from its DataGrid view to the chart visualization such as sorting, grouping, filtering and selection. This is currently supported by binding the DataSource of the IgrDashboardTile to an instance of LocalDataSource.

    igniteui-react-grids

    Cambios importantes

    Enhancements

    Barra de herramientas

    • Las capas de valor añadidas desde la barra de herramientas ahora aparecen en la leyenda.
    • La herramienta de restablecimiento de zoom se ha movido al menú desplegable de zoom.

    Datos Gráfico circular

    • The chart now exposes a GetOthersContext() method. This will return the contents of the "others" slice.

    Correcciones

    Número de error Control Descripción
    25997 DataGrid Los resúmenes solo se muestran para la primera fila secundaria agrupada
    37023 DataChart La información sobre herramientas se corta o desactiva si se establece Oculto por desbordamiento.
    37685 IgrSpreadsheet Mala representación de los números formateados con fuente Arial.
    37244 Biblioteca de Excel La validación de datos personalizados no funciona.

    19.0.0 (April 2025)

    [!Note]With 19.0.0 the React product introduces many breaking changes done to improve and streamline the API. Please refer to the full Update Guide.

    Update Guide

    Quitado

    Enhancements

    paso a paso

    Stepper Step's titlePosition now defaults to auto, instead of being undefined, which has the same behavior.

    Pestañas

    igr-tab panel property is removed.

    se elimina el componente igr-tab-panel. La pestaña igr ahora abarca tanto el encabezado de la pestaña como el contenido de la pestaña en un solo componente.

    18.9.0 (April 2025)

    New Components

    • TileManager

    Enhancements

    Lista

    Acordeón

    • Added new events Open and Close

    igniteui-react-grids

    Deprecations

    • The clicked event of the button is deprecated. Use the native onClick handler.

    Correcciones

    Número de error Control Descripción
    25602 DataGrid Al cargar un diseño con uno de los operadores de filtro específicos de la fecha, se produce un error de consola TypeError
    28480 IgrCombo Se produce un error de referencia indefinida cuando se reemplaza una fuente de datos
    30319 DataGrid Los registros se ordenan a pesar de que no se haya cambiado ningún valor
    32598 DataGrid Multi-selection is not working correctly
    36374 IgrInput Se enlazaba un valor anterior cuando se enviaba un formulario en cualquier dispositivo táctil

    18.8.1 (March 2025)

    igniteui-react-grids

    En la tabla siguiente se enumeran las correcciones de errores realizadas para el conjunto de herramientas Ignite UI for React de esta versión:

    Número de error Control Descripción
    36864 Cuadrículas Hay una ruta de importación incorrecta "grids/combined" para el paquete con licencia de React

    18.8.0 (February 2025)

    igniteui-react-grids

    • Todas las cuadrículas
      • Added new disabledSummaries for the columns of the grid, allowing the developers to skip some of the summaries
      • Botón de acción Encapsular cuadrícula interna

    igniteui-react

    • Added new allowSplitterDock property for Dockmanager that allows docking directly in a split.
    • Added new useFixedSize property for the IgrSplitPane of Dockmanager that allows new resize behavior.

    Enhancements

    Barra de herramientas

    Correcciones

    En la tabla siguiente se enumeran las correcciones de errores realizadas para el conjunto de herramientas Ignite UI for React de esta versión:

    Número de error Control Descripción
    30286 DataChart El contenido de la descripción emergente de la serie de burbujas se cambia al de los datos de burbujas cercanas al hacer clic en una burbuja
    32906 DataChart DataChart is showing two xAxis on the top
    33605 DataChart ScatterLineSeries no muestra correctamente el color de la línea en la leyenda
    34776 DataChart Repeatedly showing and hiding the DataChart causes memory leakage in JS Heap
    35498 DataChart No se muestra la información sobre herramientas de la serie especificada en IncludedSeries
    34324 grid La condición de ocultación de columna en la plantilla de cuadrícula no funciona
    34678 grid Los valores de enumeración se convierten en cadenas, lo que interrumpe el comportamiento numérico esperado en algunas propiedades de la cuadrícula
    32093 IgrPivotGrid PivotDateDimensionOptions no se aplican a PivotDateDimension
    34053 RadialGauge La posición de la etiqueta de escala se desplaza
    35496 IgrSpreadsheet Error al configurar estilos en Excel con imágenes
    36176 Biblioteca de Excel La excepción se produce al cargar un libro de Excel que tiene una función LET
    36379 Biblioteca de Excel Los colores con cualquier canal alfa en un libro de Excel no se cargan
    26218 Biblioteca de Excel El margen derecho del área de la gráfica se vuelve más estrecho y el patrón de relleno y el primer plano de relleno desaparecen con solo cargar un archivo de Excel
    34083 Biblioteca de Excel TextOperatorConditionalFormat no se carga o guarda correctamente si el texto contiene = en un archivo de Excel de plantilla
    35495 Biblioteca de Excel Las imágenes de las celdas se pierden cuando se carga un archivo de plantilla

    18.7.7 (January 2025)

    • Correcciones

    igniteui-react-grids

    • Todas las cuadrículas
      • Se ha corregido una pérdida de memoria crítica cuando los componentes se abren en varias pestañas duplicadas del navegador.

    18.7.6 (December 2024)

    igniteui-react-charts (Charts)

    Mosaico de panel

    • El nuevo componente Icono de panel es un control de contenedor que analiza y visualiza una colección ItemsSource enlazada o un punto único y devuelve una visualización de datos adecuada en función del esquema y el recuento de los datos. Este control utiliza un componente de barra de herramientas integrado que le permite realizar cambios en la visualización en tiempo de ejecución, lo que le permite ver muchas visualizaciones diferentes de los datos con un código mínimo.

    igniteui-react-charts (Inputs)

    • Color Editor se puede utilizar como un selector de color independiente y ahora está integrado en ToolAction del componente Barra de herramientas para actualizar las visualizaciones en tiempo de ejecución.

    18.7.4 (November 2024)

    General

    18.7.0 (September 2024)

    igniteui-react-charts (Charts)

    • New Data Pie Chart - The IgrDataPieChart is a new component that renders a pie chart. This component works similarly to the IgrCategoryChart, in that it will automatically detect the properties on your underlying data model while allowing selection, highlighting, animation and legend support via the ItemLegend component.

    • New Proportional Category Angle Axis - New axes for the Radial Pie Series in the IgrDataChart, to plot slices similar to a pie chart, a type of data visualization where data points are represented as segments within a circular graph.

    • IgrToolbar

      • Nueva ToolActionCheckboxList Una nueva CheckboxList ToolAction que muestra una colección de elementos con casillas de verificación para seleccionar. Una cuadrícula dentro de ToolAction CheckboxList crece en altura hasta 5 elementos, luego se muestra una barra de desplazamiento. Requiere que se registre IgrCheckboxListModule.

      • Nuevo soporte de filtrado

      • Cambios en el campo del eje Nuevo IconMenu predeterminado en la barra de herramientas cuando se dirige a CategoryChart. Los campos de etiqueta se asignan al eje X y los campos de valor se asignan al eje Y. El gráfico objetivo reacciona en tiempo real a los cambios realizados. IconMenu se oculta cuando el gráfico no tiene establecido ItemsSource.

    igniteui-react

    Cambios importantes

    igniteui-react-grids

    • Todas las cuadrículas
      • Added new RowClick event.
    • IgrPivotGrid
      • Added sortable property for a IgrPivotDimension.
      • Added horizontal layout. Can be enabled inside the new pivotUI property as rowLayout horizontal.
      • Added row dimension summaries for horizontal layout only. Can be enabled for each IgrPivotDimension by setting horizontalSummary to true.
      • Added horizontalSummariesPosition property to the pivotUI, configuring horizontal summaries position.
      • Added row headers for the row dimensions. Can be enabled inside the new pivotUI property as showHeaders true.
      • La navegación por teclado ahora puede moverse hacia adelante y hacia atrás a los encabezados de fila desde cualquier encabezado de dimensión de fila o encabezado de columna.
      • Se agregaron interacciones de teclado para contraer dimensiones de fila usando ALT + → ← ↑ ↓ flechas y encabezados de fila ordenando usando CTRL + ↑ ↓ flechas.

    Cambios importantes

    • Todas las cuadrículas
    • IgrPivotGrid
      • removed showPivotConfigurationUI property. Use pivotUI and set inside it the new showConfiguration option.
    • IgrColumn
      • Removed movable property. Use Grid's moving property now.
      • Removed columnChildren property. Use childColumns instead.
    • columnGroup
      • Removed children property. Use childColumns instead.
    • IgrPaginator
      • Removed isFirstPageDisabled and isLastPageDisabled properties. Use isFirstPage and isLastPage instead.

    18.6.1 (June 2024)

    igniteui-react

    igniteui-react-grids

    • DisplayDensity deprecated in favor of the --ig-size CSS custom property. Check out the Grid Size topic for more.

    • IgrPivotGrid - Configuration of the component can now be applied correctly.

    igniteui-react-charts (Charts)

    • Data Legend Grouping & Data Tooltip Grouping - New grouping feature added. The property GroupRowVisible toggles grouping with each series opting in can assign group text via the dataLegendGroup property. If the same value is applied to more than one series then they will appear grouped. Useful for large datasets that need to be categorized and organized for all users.

    • Chart Selection - New series selection styling. This is adopted broadly across all category, financial and radial series for IgrCategoryChart and IgrDataChart. Series can be clicked and shown a different color, brightened or faded, and focus outlines. Manage which items are effected through individual series or entire data item. Multiple series and markers are supported. Useful for illustrating various differences or similarities between values of a particular data item. Also SelectedSeriesItemsChanged event and selectedSeriesItems are available for additional help to build out robust business requirements surrounding other actions that can take place within an application such as a popup or other screen with data analysis based on the selection.

    • Proportional Category Angle Axis - New axes for the Radial Pie Series in the IgrDataChart, to enable creating pie charts in the allowing robust visualizations using all the added power of the data chart.

    • Treemap Highlighting - Now exposes a highlightingMode property that allows you to configure the mouse-over highlighting of the items in the tree map. This property takes two options: Brighten where the highlight will apply to the item that you hover the mouse over only, and FadeOthers where the highlight of the hovered item will remain the same, but everything else will fade out. This highlight is animated, and can be controlled using the highlightingTransitionDuration property.

    • Treemap Percent-based Highlighting - New percent-based highlighting, allowing nodes to represent progress or subset of a collection. The appearance is shown as a fill-in of its backcolor up to a specific value either by a member on your data item or by supplying a new highlightedDataSource. Can be toggled via highlightedValuesDisplayMode and styled via FillBrushes.

    • IgrToolbar - New IsHighlighted option for ToolAction for outlining a border around specific tools of choice.

    igniteui-react-gauges (Gauges)

    18.6.0 (March 2024)

    igniteui-react-charts

    • New Data Filtering via the initialFilter property. Apply filter expressions to filter the chart data to a subset of records. Can be used for drill down large data.

    • XamRadialChart

      • New Label Mode The IgrCategoryAngleAxis for the now exposes a labelMode property that allows you to further configure the location of the labels. This allows you to toggle between the default mode by selecting the Center enum, or use the new mode, ClosestPoint, which will bring the labels closer to the circular plot area.

    igniteui-react-grids

    igniteui-react-gauges

    • IgrRadialGauge
      • New title/subtitle properties. titleText, subtitleText will appear near the bottom the gauge. In addition, the various title/subtitle font properties were added such as TitleFontSize, TitleFontFamily, TitleFontStyle, TitleFontWeight and titleExtent. Finally, the new titleDisplaysValue will allow the value to correspond with the needle's position.
      • New opticalScalingEnabled and opticalScalingSize properties for the IgrRadialGauge. This new feature will manage the size at which labels, titles, and subtitles of the gauge have 100% optical scaling. You can read more about this new feature in this topic
      • New highlight needle was added. highlightValue and highlightValueDisplayMode when both are provided a value and 'Overlay' setting, this will make the main needle to appear faded and a new needle will appear.
    • IgrLinearGauge
      • New highlight needle was added. highlightValue and highlightValueDisplayMode when both are provided a value and 'Overlay' setting, this will make the main needle to appear faded and a new needle will appear.
    • IgrBulletGraph
      • The Performance bar will now reflect a difference between the value and new highlightValue when the highlightValueDisplayMode is applied to the 'Overlay' setting. The highlight value will show a filtered/subset completed measured percentage as a filled in color while the remaining bar's appearance will appear faded to the assigned value, illustrating the performance in real-time.

    igniteui-react

    • New IgrTextarea component
    • New IgrButtonGroup component
    • IgrDockManager
      • New proximityDock property. If enabled, docking indicators are not visible and the end user can dock the dragged pane by dragging it close to the target pane edges.
      • New containedInBoundaries property. Determines whether the floating panes are kept inside the Dock Manager boundaries. Defaults to false.
      • New showPaneHeaders property. Determines whether pane headers are only shown on hover or always visible. Defaults to always.
    • IgrInput, IgrMaskInput, IgrDateTimeInput, IgrRating
    • IgrInput
    • IgrTree
      • Added toggleNodeOnClick property that determines whether clicking over a node will change its expanded state or not. Defaults to false.
    • IgrRating
      • allowReset added. When enabled selecting the same value will reset the component. Behavioral change - In previous releases this was the default behavior of the rating component. Make sure to set allowReset if you need to keep this behavior in your application.
    • select, IgrDropdown
      • exposed selectedItem, items and groups getters

    Deprecations

    • The Form component has been deprecated. Please, use the native form element instead.
    • The size property and attribute have been deprecated for all components. Use the --ig-size CSS custom property instead. The following example sets the size of the avatar component to small: 
      .avatar {
    --ig-size: var(--ig-size-small);
}
    • IgrDateTimeInput
      • MinValue and MaxValue properties have been deprecated. Please, use min and max instead.
    • IgrRangeSlider

    Quitado

    • Removed our own dir attribute which shadowed the default one. This is a non-breaking change.
    • IgrSlider - ariaLabel shadowed property. This is a non-breaking change.
    • IgrCheckbox - ariaLabelledBy shadowed attribute. This is a non-breaking change.
    • IgrSwitch - ariaLabelledBy shadowed attribute. This is a non-breaking change.
    • IgrRadio - ariaLabelledBy shadowed attribute. This is a non-breaking change.

    18.5.0 (January 2024)

    igniteui-react-charts (Charts)

    • Chart Highlight Filter - The IgrCategoryChart and IgrDataChart now expose a way to highlight and animate in and out of a subset of data. The display of this highlight depends on the series type. For column and area series, the subset will be shown on top of the total set of data where the subset will be colored by the actual brush of the series, and the total set will have a reduced opacity. For line series, the subset will be shown as a dotted line.

    18.4.0 (December 2023)

    igniteui-react-grids (Grid)

    18.3.0 (October 2023)

    igniteui-react-grids - Toolbar -

    • Se ha agregado la acción de la herramienta Guardar para guardar el gráfico en una imagen a través del portapapeles.

    • Vertical orientation has been added via the toolbar's orientation property. By default the toolbar is horizontal, now the toolbar can be shown in vertical orientation where the tools will popup to the left/right respectfully.

    • Custom SVG icons support was added via the toolbar's renderImageFromText method, further enhancing custom tool creation.

    • Cuadrícula: esta es una nueva cuadrícula multiplataforma completamente funcional e incluye funciones como filtrado, clasificación, plantillas, selección de filas, agrupación de filas, fijación de filas y columnas móviles.

    Componentes obsoletos

    DataGrid - The DataGrid is deprecated, please use Grid

    18.2.0 (June 2023)

    New Components

    • Toolbar - This component is a companion container for UI operations to be used primarily with our charting components. The toolbar will dynamically update with a preset of properties and tool items when linked to our IgrDataChart or IgrCategoryChart components. You'll be able to create custom tools for your project allowing end users to provide changes, offering an endless amount of customization.

    igniteui-react-charts (Charts)

    • ValueLayer - A new series type named the IgrValueLayer is now exposed which can allow you to render an overlay for different focal points of the plotted data such as Maximum, Minimum, and Average. This is applied to the IgrCategoryChart and IgrFinancialChart by adding to the new valueLines collection.

    • It is now possible to apply a dash array to the different parts of the series of the IgrDataChart. You can apply this to the series plotted in the chart, the gridlines of the chart, and the trendlines of the series plotted in the chart.

    18.1.0 (November 2022)

    Se agregaron mejoras significativas a los comportamientos predeterminados y se refinó la API de Gráfico de categorías para que sea más fácil de usar. Estas nuevas mejoras en los gráficos incluyen:

    • Diseños responsivos para la rotación horizontal de etiquetas según el tamaño del navegador/pantalla.
    • Representación mejorada para etiquetas redondeadas en todas las plataformas.
    • Se agregaron propiedades de marcador a StackedFragmentSeries.
    • Added shouldPanOnMaximumZoom property.
    • Nuevas propiedades del eje de categorías:
      • ZoomMáximoCategoríaRango
      • ZoomMaximumItemSpan
      • ZoomToCategoryRange
      • ZoomToItemSpan
    • Nueva API de agregación de gráficos para agrupar, ordenar y resumir cadenas de categorías y valores numéricos, lo que elimina la necesidad de agregar previamente o calcular datos del gráfico:
      • Descripciones de clasificación inicial
      • Clasificaciones iniciales
      • Ordenar descripciones
      • Grupos iniciales
      • Descripciones de grupo inicial
      • Descripciones de grupo
      • Resúmenes iniciales
      • Descripcionesde resumen inicial
      • ResumenDescripciones
      • Descripciones de clasificación de grupo inicial
      • Clasificación de grupos
      • Descripciones de clasificación de grupos

    [!Note] Chart Aggregation will not work when using includedProperties | excludedProperties. These properties on the chart are meant for non-aggregated data. Once you attempt to aggregate data these properties should no longer be used. The reason it does not work is because aggregation replaces the collection that is passed to the chart for render. The include/exclude properties are designed to filter in/out properties of that data and those properties no longer exist in the new aggregated collection.

    igniteui-react-grids (Data Grid)

    16.16.0 (June 2022)

    igniteui-react-charts (Charts)

    • Added the highly-configurable DataLegend component, which works much like the IgrLegend, but it shows values of series and provides many configuration properties for filtering series rows and values columns, styling and formatting values.
    • Se agregó DataToolTip altamente configurable que muestra valores y títulos de series, así como insignias de leyenda de series en una información sobre herramientas. Esta es ahora la información sobre herramientas predeterminada para todos los tipos de gráficos.
    • 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 IgrDataChart. 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 CalloutLayer. 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.
    • Se agregaron nuevas propiedades de radio de esquina para las capas de anotación; se utiliza para redondear las esquinas de cada una de las leyendas. Tenga en cuenta que ahora se ha agregado un radio de esquina de forma predeterminada.
    • 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. IgrNumericXAxis, IgrNumericYAxis, PercentChangeAxis).
    • 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-react-grids (Data Grid)

    Se agregó una nueva característica: paginación de filas, que se usa para dividir un gran conjunto de datos en una secuencia de páginas que tienen contenido similar. Con la paginación, los datos se pueden mostrar en un número determinado de filas, lo que permite a los usuarios "desplazarse" por sus datos, sin necesidad de una barra de desplazamiento. La interfaz de usuario para la paginación de tablas suele incluir elementos como la página actual, el total de páginas y las flechas o botones Anterior y Siguiente en los que se puede hacer clic que permiten a los usuarios desplazarse por las páginas de datos.

    16.15.1 (December 2021)

    igniteui-react-grids (Data Grid)

    Cuadrícula de datos

    • Added ValueMultiField, of type string[], in the IgrComboBoxColumn to be used when your items in the drop down contain a key that consists of multiple fields.

    [!Note] The following breaking changes were introduced

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

    igniteui-react-inputs (Inputs)

    Selector de fechas

    • Changed ValueChanged event to SelectedValueChanged.

    Multi-Column ComboBox

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

    16.15.0 (November 2021)

    [!Note] Please ensure package "lit-html": "^2.0.0" or newer is added to your project for optimal compatibility.

    igniteui-react-charts (Charts)

    Esta versión introduce algunas mejoras y simplificaciones en el diseño visual y las opciones de configuración para el mapa geográfico y todos los componentes del gráfico.

    Pinceles/contornos antiguos Nuevo contorno/pinceles
    #8BDC5C
    #8B5BB1
    #6DB1FF
    #F8A15F
    #EE5879
    #735656
    #F7D262
    #8CE7D9
    #E051A9
    #A8A8B7    		 #8BDC5C
    #8961A9
    #6DB1FF
    #82E9D9
    #EA3C63
    #735656
    #F8CE4F
    #A8A8B7
    #E051A9
    #FF903B

    igniteui-react-grids (Data Grid)

    16.14.0 (April 2021)

    igniteui-react-charts (Charts)

    This release introduces several new and improved visual design and configuration options for all of the chart components, e.g. IgrDataChart, IgrCategoryChart, and IgrFinancialChart.

    • Se modificó la serie Barra/Columna/Cascada para que tenga esquinas cuadradas en lugar de esquinas redondeadas.
    • Se cambiaron los colores de la serie Scatter High Density para la propiedad mínima de calor de #8a5bb1 a #000000
    • Se cambiaron los colores de la serie Scatter High Density para la propiedad Heat Max de #ee5879 a #ee5879
    • Changed Financial/Waterfall series’ NegativeBrush and NegativeOutline properties from #C62828 to #ee5879
    • Se cambió el grosor del marcador a 2px desde 1px.
    • Changed marker's fill to match the marker's outline for IgrPointSeries, IgrBubbleSeries, IgrScatterSeries, IgrPolarScatterSeries. You can use set markerFillMode property to Normal to undo this change
    • Compressed labelling for the IgrTimeXAxis and IgrOrdinalTimeXAxis
    • Nuevas propiedades del marcador:
      • 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
    • Propiedad de nueva serie:
      • 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:
    • Nuevas propiedades de resaltado
      • 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
      • Tenga en cuenta que en versiones anteriores el resaltado se limitaba a desvanecerse al pasar el mouse.
    • Se agregó resaltado de series apiladas, dispersas, polares, radiales y de formas:
    • Se agregaron capas de anotación a las series Apiladas, Dispersas, Polares, Radiales y Formas:
    • Se agregó soporte para anular la fuente de datos de fragmentos de pila individuales dentro de una serie apilada.
    • Se agregaron eventos de estilo personalizados a las series Apilado, Dispersión, Rango, Polar, Radial y Forma.
    • Se agregó soporte para sincronizar automáticamente el zoom vertical con el contenido de la serie.
    • Se agregó soporte para expandir automáticamente los márgenes horizontales del gráfico según las etiquetas iniciales mostradas.
    • Paleta de colores rediseñada de series y marcadores:
    Pinceles/contornos antiguos Nuevo contorno/pinceles
    #7446B9
    #9FB328
    #F96232
    #2E9CA6
    #DC3F76
    #FF9800
    #3F51B5
    #439C47
    #795548
    #9A9A9A    		 #8bdc5c
    #8b5bb1
    #6db1ff
    #f8a15f
    #ee5879
    #735656
    #f7d262
    #8ce7d9
    #e051a9
    #a8a8b7

    Por ejemplo:
    chartDefaults1 chartDefaults2
    chartDefaults3 chartDefaults4

    Leyenda del gráfico

    • 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

    igniteui-react-maps (GeoMap)

    [!Note] These features are CTP

    • Se agregó soporte para la visualización envolvente del mapa (desplazarse infinitamente horizontalmente)
    • Se agregó soporte para cambiar la visualización de algunas series de mapas mientras se ajusta alrededor del origen de las coordenadas.
    • Se agregó soporte para resaltar la serie de formas.
    • Se agregó soporte para algunas capas de anotaciones para la serie de formas.

    igniteui-react-grids (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:
      • Haga clic y arrastre para seleccionar filas
      • SHIFT y haga clic para seleccionar varias filas.
      • SHIFT y pulse las teclas de ↑ flecha+ ↓ para seleccionar varias filas.
    • Pressing space bar toggles selection of active row via GridSelectionMode property set to MultipleRow or SingleRow
    • Added Column Summaries to Column Options Dialog.

    igniteui-react-inputs (Inputs)

    Selector de fechas

    • 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.
    • Accesibilidad añadida

    16.12.3 (November 2020)

    igniteui-react-grids (Data Grid)

    [!Note] These breaking changes were introduce in the grid package.

    • Nombre cambiado de PropertyPath

    The data grid component property propertyPath has been renamed to field. This applies to all Column types, GroupDescription, SortDescription & SummaryDescription.

     <IgrTextColumn field="Name"/>

    import { IgrColumnSummaryDescription, IgrColumnSortDescription, IgrColumnGroupDescription } from 'igniteui-react-data-grids'
const productCount = new IgrColumnSummaryDescription();
productCount.field = "ProductName";
const colSortDesc = new IgrColumnSortDescription();
colSortDesc.field = "UnitsInStock";
const income = new IgrColumnGroupDescription();
income.field = "Income";

    16.12.2 (April 2020)

    igniteui-react-grids (Data Grid)

    • Nombre cambiado de Live Grid

    El componente de la cuadrícula de datos y los nombres de sus módulos correspondientes han cambiado de "LiveGrid" a "DataGrid".

    [!Note] These breaking changes were introduce in these packages and components only:

    El nuevo código para importar el grid y su módulo correspondiente es:

    import { IgrDataGrid } from "igniteui-react-data-grids";
import { IgrDataGridModule } from 'igniteui-react-data-grids';
    • Dependencia de pares requerida para Data Grid

    El componente de cuadrícula de datos requiere el paquete "inputs".

    **npm install --save igniteui-react-inputs**

    16.11.7

    • Declaraciones de importación modificadas

    Las declaraciones de importación se han simplificado para usar solo nombres de paquetes en lugar de rutas completas a clases y enumeraciones de API.

    [!Note] These breaking changes were introduce in these packages and components only:

    Paquetes afectados Componentes afectados
    igniteui-react-excel Biblioteca de Excel
    igniteui-react-spreadsheet Hoja de cálculo
    igniteui-react-maps Mapa geográfico, mapa de árbol
    igniteui-react-gauges Gráfico de viñetas, Medidor lineal, Medidor radial
    igniteui-react-charts Gráfico de categorías, Gráfico de datos, Gráfico de anillos, Gráfico financiero], Gráfico circular, control deslizante de zoom
    igniteui-react-core todas las clases y enumeraciones
    igniteui-react-grids Cuadrícula de datos
    • Código después de los cambios

    Ahora, necesita usar solo nombres de paquetes en lugar de rutas completas a clases y enumeraciones de API.

    Tenga en cuenta también que el nombre del componente Data Grid y sus módulos correspondientes también han cambiado.

    // gauges:
import { IgrLinearGauge } from "igniteui-react-gauges";
import { IgrLinearGaugeModule } from "igniteui-react-gauges";
import { IgrLinearGraphRange } from "igniteui-react-gauges";
import { IgrRadialGauge } from 'igniteui-react-gauges';
import { IgrRadialGaugeModule } from 'igniteui-react-gauges';
import { IgrRadialGaugeRange } from 'igniteui-react-gauges';
import { SweepDirection } from 'igniteui-react-core';
// charts:
import { IgrFinancialChart } from 'igniteui-react-charts';
import { IgrFinancialChartModule } from 'igniteui-react-charts';
import { IgrDataChart } from 'igniteui-react-charts';
import { IgrDataChartCoreModule } from 'igniteui-react-charts';
// maps:
import { IgrGeographicMap } from "igniteui-react-maps";
import { IgrGeographicMapModule } from "igniteui-react-maps";
// grids:
import { IgrLiveGrid } from "igniteui-react-data-grids";
import { IgrLiveGridModule } from 'igniteui-react-data-grids';
    • Código antes de los cambios

    Antes, tenías que importar usando rutas completas a clases y enumeraciones de API:

    // gauges:
import { IgrLinearGauge } from "igniteui-react-gauges/ES5/igr-linear-gauge";
import { IgrLinearGaugeModule } from "igniteui-react-gauges/ES5/igr-linear-gauge-module";
import { IgrLinearGraphRange } from "igniteui-react-gauges/ES5/igr-linear-graph-range";

import { IgrRadialGauge } from "igniteui-react-gauges/ES5/igr-radial-gauge";
import { IgrRadialGaugeModule } from "igniteui-react-gauges/ES5/igr-radial-gauge-module";
import { IgrRadialGaugeRange } from "igniteui-react-gauges/ES5/igr-radial-gauge-range";
import { SweepDirection } from "igniteui-react-core/ES5/SweepDirection";

// charts:
import { IgrFinancialChart } from "igniteui-react-charts/ES5/igr-financial-chart";
import { IgrFinancialChartModule } from "igniteui-react-charts/ES5/igr-financial-chart-module";
import { IgrDataChart } from "igniteui-react-charts/ES5/igr-data-chart";
import { IgrDataChartCoreModule } from "igniteui-react-charts/ES5/igr-data-chart-core-module";

// maps:
import { IgrGeographicMap } from "igniteui-react-maps/ES5/igr-geographic-map";
import { IgrGeographicMapModule } from "igniteui-react-maps/ES5/igr-geographic-map-module";

// grids:
import { IgrLiveGrid } from "igniteui-react-data-grids/ES5/igr-live-grid";
import { IgrLiveGridModule } from 'igniteui-react-data-grids/ES5/igr-live-grid-module';