ZingGrid Lanzamientos

ZingGridControles de cuadrículaJavaScript
Versión 2.2.1 (1 oct 2026)

Descubre las novedades en cada versión, con detalles de funciones, mejoras y problemas resueltos.

ene
feb
mar
abr
may
jun
jul
ago
sept
oct
nov
dic
ZingGrid 2.2.11 oct 2026
Funciones
  • Additional Filter Summary Chart Features:
    • Added more filter summary chart types.
      • calendar: Available for "date" column type. A drilldown calendar that adapts its view to the dataset's date range across four views: month, year, 2-3 years, and 4+ years. Filtering is performed by selecting a single or group of nodes, or through the calendar selection overlay to select nodes or provide a date range.
      • ring: Similar to "pie" chart but in a ring shape. Filter is applied by clicking on a node.
      • toggle: Available for "boolean" column type. Chart that filters by switching between two options.
    • [filter-summary-lens].
      • Adds a lens icon to each filter summary chart. When clicked, an overlay displays a larger, fully interactive version of the chart for easier viewing and filtering.
    • [filter-summary-ring-thickness].
      • Sets the thickness of the ring chart. Accepts a number between 0 and 1.
    • [filter-summary-mode="cumulative"|"exclusive"].
      • Controls whether applying a filter summary in one column clears the active filter summary in other columns.
      • "cumulative" (default): filters from multiple columns are combined, narrowing the results further with each one applied.
      • "exclusive": only one column can be filtered at a time, so filtering a new column clears any filter already applied to another column.
    • [filter-summary-row-collapsed].
      • When true, the filter summary row starts collapsed (hidden) on initial render.
    • Additional support for [filter-summary-node-sort].
      • "gradient" option to order nodes by color when ZGColumn[type="color"].
      • Smarter default sort order for categorical charts ([filter-summary-node-sort="default"]).
        • Charts with 10 or fewer nodes are sorted by count, descending (highest count first).
        • Charts with more than 10 nodes are sorted alphabetically by label (too many to scan by count).
    • "Clear filter" button added to the filter-toggle column to easily clear all filters.
    • Context menu includes menu options to update filter summary chart type.
    • Added [filter-on="raw"|"rendered"] support.
    • Added [type-color-mode] support when rendering color label in filter summary chart.
    • Grid state supports saving the filter summary row state.
    • Added <zg-calendar-selection> component and CSS variables.
    • Added get/set methods for all filter-summary-related attributes.
    • Added filter summary lens mode events.
      • ZGColumn#filter:summary:lens:open.
      • ZGColumn#filter:summary:lens:close.
    • Added CSS variables for <zg-filter-summary> component.
    • Added keyboard navigation support.
  • Card Mode Support:
    • [card-density-breakpoint]
      • Sets the minimum viewport tier at which the card field is visible. Fields without a [card-density-breakpoint] are always visible.
    • [card-resizable]
      • Enables resizing of cards in card mode. Cards are resized responsively within a min/max cards-per-row range. The "fixed" option sizes cards to a single, unchanging cards-per-row count instead.
      • Added <zg-card-resize> component and CSS variables.
    • [compact]
      • Supports a compact view in card mode.
    • [column-drag]
      • Allows dragging a card item (header and content) in card mode.
      • Added keyboard navigation support for both card and row mode.
    • [editor="inline"]
      • Card items now support inline editing -- previously only supported "modal" in card mode.
    • [filter="menu"]
      • Works like filter menu in row layout, except it requires specifying a column to filter.
    • [filter="summary"]
      • Specifies the column to open the filter summary chart on.
    • [frozen-cards-top/bottom]
      • Sets the number of cards to freeze to the top or bottom.
      • Similar to [frozen-rows-top/bottom], but works separately.
    • [header-tooltip-*]
      • Appends header tooltip icon to card header. On hover, header tooltip displays.
    • [height]
      • Now supported in card mode -- previously ignored.
    • [row-details-*]
      • Opens row details in either a bottom drawer or sidebar.
    • [selector]
      • Supports whole card selection.
    • [sort]
      • Supported through a menu that allows specifying a column and sort order.
      • Added <zg-sort-menu> component and CSS variables.
    • [zebra]
      • Cards now support zebra background styling.
  • Breaking Changes:
    • Renamed --zg-filter-summary-underline-color to --zg-filter-summary-node-hover.
    • Renamed ZGColumn#filter:summary:close/open to ZGRow#filterSummaryClose/Open.
    • Updated icon for [column-resizable].
    • Added new icon for [column-drag].
    • Columns are now highlighted during column drag or resize.
Correcciones
  • Fixed histogram selection min/max labels to display selection min/max values and not the chart's min/max.
  • Fixed histogram bin ranges for numeric columns.
  • Fixed filter summary crosshair bug, which was applying to whole <zg-filter-summary> row instead of targeted column.
  • Fixed filter summary chart labels for button column type -- render "label" instead of all the indices.
  • Fixed filter summary chart labels for date column type when [type-date-format] or [type-date-from-now] is set.
  • Fixed hot reload bug with filterSummaryColumn().
  • Fixed filterSummaryColumn() by applying null check to selection element.
  • Fixed filterSummaryColumn() to handle incorrect arguments:
    • Convert non-array filter term to expected array format.
    • For histogram, logs developer warning if 2 arguments are not provided.
    • Logs developer warning if array elements are not expected number or string types.
  • Fixed missing borders for <zg-control-bar> and <zg-pager> in card mode.
  • Fixed [align] bug with headers in card mode.
  • Fixed [column-drag-action="reorder"] by setting cursor to "ew-resize" to indicate moving columns left/right only.
  • Fixed color input field for color column type in creator modal.
  • Removed whitespace in <zg-body> when grid displays no data in card mode.
  • Fixed keyboard navigation for nested headers.
  • Fixed keyboard navigation order for card header items (selector, info, editor, duplicate, remover, etc).
  • Fixed triggering for <zg-column-resize> when header text overlaps.
  • Fixed drag-select selection in [frozen-rows-top/bottom].
  • Fixed [context-menu] option labels to say "cards"/"card items" in card mode instead of "rows"/"cells".
  • Fixed ZGColumn[type-row-details-template] and ZGColumn[type-row-details-renderer] to render row details content.
  • Fixed the size of FontAwesome icons when using [icon-set="fa"].
  • Fixed CSS variables:
    • Missing top border in --zg-head-border, --zg-foot-border, and --zg-foot-border-top.
    • Padding not applying in --zg-foot-padding.
ZingGrid 2.2.011 jun 2026
Funciones
  • Filter Summary Chart
    • ZingGrid's new built-in filter summary chart provides a visual way to explore and filter data using an interactive summary chart.
    • This feature can be enabled at either the grid- or column-level by setting [filter="summary"].
  • [filter-summary-chart]
    • Specifies which chart type the filter summary chart renders.
    • The default behaviors are:
      • pie: for boolean-like column types.
      • histogram: for numeric column types.
      • bar: for all other column types.
    • The supported options are bar, default, histogram, pie.
    • Can be set at both the grid- or column-level.
  • [filter-summary-node-sort]
    • This attribute configures the node sort order.
    • The default behaviors are:
      • bar: count-desc.
      • histogram: value for numeric types and alphabetically for the rest.
      • pie: count-desc.
    • The following node sort orders are supported:
      • alphabetical: alphabetically by their label.
      • count-asc: count in ascending order.
      • count-desc: count in descending order.
      • default: default based on chart and column type.
      • value: node numeric value.
      • none: retain original order.
    • Can be set at both the grid- or column-level.
  • [filter-summary-multi-node]
    • This attribute accepts only "disabled" to disable the default behavior of selecting multiple nodes in a bar or pie chart.
    • Can be set at both the grid- or column-level.
  • Filter Summary Method: filterSummaryColumn()
    • Trigger filter with filterSummaryColumn(). This method accepts two arguments:
      • sFieldIndex: Index of column.
      • sFilterTerms: Array of filter terms. For bar or pie, expects at least one element. For histogram, expects one or two elements, where the first represents the starting node and the second the ending node.
  • Filter Summary Events
    • The column:filter event triggers when filtering through the filter summary charts.
    • The following events trigger when toggling the filter summary row:
      • column:filter:summary:close.
      • column:filter:summary:open.
  • The filter attribute also accepts "all" to enable all three filters (inline, menu, summary).
  • Additional Features
    • Filter toggle row appended to grid to toggle filter summary row.
    • Clear button appears when filter is active to clear filter results.
    • Long labels are truncated.
    • Color type nodes are set to the color they represent.
    • NaN nodes are yellow.
    • Boolean false nodes are red.