Installation

Install the React bindings (the framework-agnostic core is pulled in automatically):

npm i @kanunilabs/pivotgrid-react

(Any package manager works — yarn add / pnpm add too.)

The React package declares its UI libraries as peer dependencies. npm 7+ installs these automatically; if your setup doesn't, add the ones your app doesn't already have:

npm i @dnd-kit/core lucide-react zustand

Styles

Import the stylesheet once, near your app root:

import '@kanunilabs/pivotgrid-react/styles.css';

The Web Worker: nothing to configure

The engine runs its aggregation in a Web Worker, and the worker is compiled into the package and started from a Blob URL. There is no file to copy, no bundler recipe and nothing to import — Vite, webpack, Next.js and Parcel all work as they are. The same is true of the import and export workers.

If you have a strict Content-Security-Policy

A Blob worker needs worker-src to allow blob::

Content-Security-Policy: worker-src 'self' blob:

If you cannot change the policy, the grid falls back to loading the worker file from node_modules on its own — and where that fails too, point workerUrl at a copy you serve. The file ships in the package either way.

Vite — import the worker as an asset URL:

import workerUrl from '@kanunilabs/pivotgrid-core/dist/pivot.worker.js?url';

<BasePivotGrid workerUrl={workerUrl} /* ... */ />

Next.js and other bundlers — copy pivot.worker.js from node_modules/@kanunilabs/pivotgrid-core/dist/ into a served path (e.g. public/) and point at it:

<BasePivotGrid workerUrl="/pivot.worker.js" /* ... */ />

The same route is worth taking if you would rather serve the worker from a CDN, so it caches separately from your app bundle.

TypeScript

Types ship with the packages — no @types/* needed. The public API is fully typed, including PivotField, PivotLocale, and the component props.

Next: render your first grid.