Documentation

Enterprise & licensing

Advanced analytics ship in @kanunilabs/pivotgrid-react-enterprise: the no-code calculated-field editor, live chart integration, drill-down to source records, the visual prefilter builder, the node context menu (bulk expand/collapse), and styled Excel & PDF export. EnterprisePivotGrid is a drop-in replacement for BasePivotGrid — it accepts the same props and adds these.

Private registry

The enterprise package is delivered from our private registry with per-customer credentials. After purchase you receive a ready-to-paste .npmrc by email (also manageable from your dashboard):

@kanunilabs:registry=https://registry.kanunilabs.com/
//registry.kanunilabs.com/:_auth=<value from your email or dashboard>
//registry.kanunilabs.com/:always-auth=true

Then install:

npm i @kanunilabs/pivotgrid-react-enterprise

Setup details, CI usage and credential rotation are covered in the Private registry access guide.

License key

Set your key once at startup, then use EnterprisePivotGrid in place of BasePivotGrid:

import { EnterprisePivotGrid, LicenseManager } from '@kanunilabs/pivotgrid-react-enterprise';

LicenseManager.setLicenseKey('KLAB1....');

export function MyProGrid(props) {
  return <EnterprisePivotGrid {...props} />;
}

Without a valid license the grid still renders, but shows an "Unlicensed" watermark and logs a console notice. Licenses are verified offline (signed) and optionally checked online for revocation:

<EnterprisePivotGrid
  licenseKey="KLAB1...."
  licenseValidateUrl="https://api.kanunilabs.com/api/license/validate"
/>

Using the Enterprise features

Once you render EnterprisePivotGrid, the calculated-field editor, prefilter builder, node context menu and styled Excel/PDF export light up automatically — the footer's "Add Calculated Measure" and "Filter Builder" buttons open their editors, right-clicking a row/column node offers bulk expand/collapse, and the Excel/PDF items in the Export menu become active. No extra wiring is needed.

Two features are opt-in because you decide where their UI renders:

Charts

Sync a live chart to the pivot with chartIntegrationOptions, then render the emitted data with ChartFactory (column, bar, line, area, pie, scatter, polar, combination):

import { useState } from 'react';
import {
  EnterprisePivotGrid,
  ChartFactory,
  ChartDataTransformer,
} from '@kanunilabs/pivotgrid-react-enterprise';
import type { ChartSyncResult } from '@kanunilabs/pivotgrid-react';

export function ChartedPivot({ data, fields }) {
  const [sync, setSync] = useState<ChartSyncResult | null>(null);
  return (
    <>
      <EnterprisePivotGrid
        gridId="sales"
        data={data}
        initialFields={fields}
        chartIntegrationOptions={{ transformer: ChartDataTransformer.transform, maxPoints: 20 }}
        onChartSync={setSync}
      />
      {sync && (
        <ChartFactory type="column" data={sync.chartData} series={sync.chartSeries} locale="en" />
      )}
    </>
  );
}

Drill-down

Open the source records behind any aggregated cell by handling onCellClick and rendering PivotDrillDownModal with the event's records:

import { useState } from 'react';
import { EnterprisePivotGrid, PivotDrillDownModal } from '@kanunilabs/pivotgrid-react-enterprise';
import type { CellClickEvent } from '@kanunilabs/pivotgrid-react';

export function DrillablePivot({ data, fields }) {
  const [drill, setDrill] = useState(null);
  return (
    <>
      <EnterprisePivotGrid
        gridId="sales"
        data={data}
        initialFields={fields}
        onCellClick={(e: CellClickEvent) => {
          if ((e.cellType === 'data' || e.cellType === 'grandTotal') && e.records?.length) {
            setDrill({ records: e.records, rowPath: e.rowPath, colPath: e.colPath });
          }
        }}
      />
      {drill && <PivotDrillDownModal {...drill} onClose={() => setDrill(null)} />}
    </>
  );
}

Explore all of these live in the Enterprise playground sections.

See Pricing for tiers, or the API Reference for the full surface.