ApexGrid 3.5 and Enterprise 0.7: Server-Side Depth, Nested Filters, and a Dependency Diet

apex-grid 3.5.0 and apex-grid-enterprise 0.7.0 shipped together on September 12, adding right-to-left support, batch edits, a server-side row model and a nested filter builder. No exported symbol was removed or renamed, but check the table below before you upgrade.

Key takeaways

• The Ignite UI dependencies are gone (3.5.0): five packages leave your lockfile.
• dir="rtl" on the grid or any ancestor mirrors it completely (3.5.0).
• grid.applyEdits() writes many cells as one undo step (3.5.0).
• Server-side row model with grouping, pivot and block pagination (enterprise 0.7.0).
• Advanced filter builder for nested AND / OR queries (enterprise 0.7.0).
• Upgrading is npm install apex-grid@3.5.0 apex-grid-enterprise@0.7.0.

Which defaults changed?

Change	Release	What you will see	How to upgrade
Ignite UI dependencies removed	3.5.0	Five fewer packages in your lockfile, igniteui-webcomponents among them	Drop igniteui-webcomponents if you added it only for the grid. --ag-* overrides and the --ig-primary-* auto-tint hooks behave as before
setup({ theme }) is inert	3.5.0	A one-time console warning; appearance unchanged, since the option never styled the grid	Remove the theme option. The call still compiles
--igx-* custom-property level removed	3.5.0	Nothing: that level never resolved	Grep for --igx-* and use --ag-*
Paginator buttons grow from 22 to 24px	3.5.0	The paginator bar is 2px taller	No option: it meets the WCAG 2.2 AA 24x24 target size

// Before
setup({ theme: 'bootstrap' });

// After (3.5.0)
setup();

Server-side row model

The infinite row model serves one flat list. This one serves a hierarchy: the grid asks a ServerSideDataSource for one group level at a time, fetches a group's children only when it is expanded, and shows aggregates the server computed.

grid.serverSideRowModel = {
  datasource,
  rowGroupCols: ['region', 'country'],
  valueCols: { revenue: ['sum'] },
};

Server-side pivot comes through pivotCols, and blockSize loads a group's children in windows with placeholder rows (grid.isRowLoading). expandServerGroup, collapseServerGroup and refreshServerSide drive it from code. It excludes the infinite row model and client-side grouping and pivoting, since the server owns the shaping.

See the server-side row model docs and the live demo.

Advanced filter builder

<apex-grid-filter-builder> is a visual query builder for nested AND / OR conditions, which a per-column filter cannot express. applyAdvancedFilter(), clearAdvancedFilter() and advancedFilterModel evaluate it client-side, and while a model is active it owns column filtering. The model is plain JSON, so it round-trips through storage or a URL.

const builder = document.createElement('apex-grid-filter-builder');
builder.grid = grid; // Apply and Clear call the grid for you
document.body.append(builder, grid);

See the advanced filter builder docs and the live demo.

Batch edits with grid.applyEdits()

Bulk updates no longer mean one undo entry and one re-render per cell. Each write still emits the cancellable cellValueChanging and then cellValueChanged, and still runs the column's validators, but the batch lands as one undo step and one pipeline run. Rows out of range and uneditable columns are skipped, not thrown on.

const result = grid.applyEdits(
  grid.selectedRows.map((row) => ({
    rowIndex: grid.pageItems.indexOf(row),
    column: 'discount',
    value: 0,
  }))
);
// { applied: 12, unchanged: 3, invalid: 0, cancelled: 0, skipped: 1 }

See batch edits.

Other changes and fixes

• Right-to-left (3.5.0): dir="rtl" on the grid or any ancestor mirrors columns, pinning, resize, reorder and arrow keys, and the range fill and chart-range handles are no longer grabbable on the wrong side (0.7.0). See the RTL guide.
• Accessibility (3.5.0): prefers-reduced-motion is honoured, focus and selection indicators stay visible in forced-colors mode, and targets meet 24x24. See accessibility.
• Custom Elements Manifest (3.5.0): custom-elements.json now lists <apex-grid> with its tag, 29 events and public properties, which the react-apex-grid wrapper generates from.
• Pivoting v2 (0.7.0): grand total and subtotals, spanning column headers, multi-field pivotOn and nested row groups. See pivoting.
• Chart range handle (0.7.0): a charted range stays outlined, and dragging its handle live-redraws the chart. See the range handle.
• Totals and keyboard ranges (0.7.0): grid.totalRow adds a grand-total row, top or bottom, that follows filtering; Shift+Arrow extends a range from the keyboard, with Home/End and Ctrl/Cmd for edges and corners.
• A grid could settle with zero rendered rows at first paint when laid out off-screen (3.5.0, #31).
• A grid moved to another parent kept rendering its old rows after data was reassigned (3.5.0).
• A forged licence key could permanently lift the enterprise watermark; the watermark now comes from apex-commons, and the documented license-watermark CSS part is preserved (0.7.0).
• The optional apexcharts peer accepts ^5.15.0 || ^6.0.0 || ^7.0.0, so ApexCharts 7 installs without a peer warning (0.7.0).

The full lists are in the 3.5.0 and enterprise 0.7.0 GitHub releases.

Upgrading

npm install apex-grid@3.5.0 apex-grid-enterprise@0.7.0

Work through the changes above: drop igniteui-webcomponents if it was only there for the grid, remove setup({ theme }), and grep for --igx-*. Everything else is additive, and <apex-grid-enterprise> stays a drop-in replacement for <apex-grid>.

apex-grid is covered by the Community License, free under $2M in annual revenue, budget or funding. apex-grid-enterprise needs a Premium licence or above whatever your size. See pricing.

Frequently asked questions