Skip to content

apex-grid 3.0.0

Choose a tag to compare

@github-actions github-actions released this 09 Jun 19:45
· 1 commit to main since this release

apex-grid 3.0.0 is a major release: a full visual refresh built on CSS
custom-property theming, and the start of a free/pro split — Excel export moves
to the new apex-grid-enterprise package.

⚠️ Breaking changes

Excel (XLSX) export moved to apex-grid-enterprise

exportToXLSX() and the toolbar "Export XLSX" entry are no longer in the
community package. CSV export stays free (exportToCSV()).

The toolbar export menu is now driven by a generic seam so derived grids can add
their own formats:

  • get exportFormats(): ReadonlyArray<ExportFormat> — defaults to [{ id: 'csv', … }]
  • exportAs(formatId, options) — the toolbar dispatches the chosen format here

Migration: if you used grid.exportToXLSX(...), switch to the enterprise
package:

npm install apex-grid-enterprise
import 'apex-grid-enterprise/define';
const grid = document.querySelector('apex-grid-enterprise');
grid.exportToXLSX({ filename: 'users', sheetName: 'Users' });

Changed

CSS-variable theming (no theme import)

The grid now styles itself out of the box through --ag-* custom properties.
There is no theme to import and no configureTheme() call. Rebrand by
overriding tokens on apex-grid (or any ancestor):

apex-grid {
  --ag-brand: #7c3aed;        /* selection, focus, accents */
  --ag-radius: 12px;          /* outer card radius */
  --ag-row-h: 40px;           /* row height */
}

When igniteui-webcomponents is present, brand tokens auto-tint from its
palette (--ig-primary-500).

Neutral restyle + flat edge by default

Grayscale chrome with brand color reserved for state/accents. The grid host no
longer paints a heavy floating-card shadow — it shows a flat 1px hairline
edge
. Opt back into the elevated look with the new hook:

apex-grid { --ag-grid-shadow: var(--ag-shadow-card); } /* restore card */
apex-grid { --ag-grid-shadow: none; }                  /* no edge at all */

Install

npm install apex-grid lit igniteui-webcomponents
import 'apex-grid/define';