# syncfusion-react-pivot-table

Build and customize Syncfusion PivotView in React with guidance for data binding, grouping, filters, aggregation, exports, and pivot charts.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 709 installs · ★ 3
- Author: Syncfusion Inc
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/syncfusion/react-ui-components-skills/tree/HEAD/skills/syncfusion-react-pivot-table/SKILL.md
- Updated: 2026-10-23
- HTML: https://affpapa.org/en/nevibecode/skills/syncfusion-react-pivot-table

## What it does

This skill guides Claude Code through React PivotView work with Syncfusion. It covers JSON, CSV, and remote data binding, row and column grouping, hierarchies, filtering, sorting, calculated fields, formatting, drill-down, and drill-through.

Its reference files cover setup, data connections, pivot charts, field lists, aggregation, filtering, layout, and report export to Excel or PDF. The agent can use them to check component APIs, properties, and method signatures before producing code.

Remote sources need validation, sanitization, authentication, and HTTPS. React is the supported target, so Angular, Vue, and Blazor implementations are outside this skill’s scope.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-pivot-table -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/syncfusion-react-pivot-table/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/syncfusion-react-pivot-table/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-pivot-table -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/syncfusion-react-pivot-table/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-pivot-table -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/syncfusion-react-pivot-table/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install syncfusion/react-ui-components-skills syncfusion-react-pivot-table
```

2. **Manually: put the files in place**
- File: `.github/skills/syncfusion-react-pivot-table/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-pivot-table -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/syncfusion/react-ui-components-skills --path skills/syncfusion-react-pivot-table
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/syncfusion-react-pivot-table/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-pivot-table -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/syncfusion/react-ui-components-skills/tree/HEAD/skills/syncfusion-react-pivot-table/SKILL.md

## When to use it
- create a React PivotView for data analysis
- bind JSON, CSV, or remote data
- configure grouping, filters, and aggregations
- add drill-down and report export

## Example prompts
- Create a React PivotView that analyzes JSON data and groups fields by rows and columns.
- Configure filtering, sorting, and a calculated field in an existing Syncfusion pivot table.
- Add a pivot chart and Excel and PDF export to this React PivotView.

## Similar
- [react-and-nextjs-data-visualization](https://affpapa.org/en/nevibecode/skills/react-and-nextjs-data-visualization.md) — skill · 13 installs
- [tanstack-table](https://affpapa.org/en/nevibecode/skills/claude-skills-maintainers-tanstack-table.md) — skill · 494 installs
- [globe-gl](https://affpapa.org/en/nevibecode/skills/globe-gl.md) — skill · 1500 installs
- [recharts](https://affpapa.org/en/nevibecode/skills/recharts.md) — skill · 1100 installs
- [Semiotic](https://affpapa.org/en/nevibecode/mcp/semiotic.md) — MCP server · ★ 2716
- [clerk-react-patterns](https://affpapa.org/en/nevibecode/skills/clerk-react-patterns.md) — skill · 19700 installs

From the same set: [syncfusion/react-ui-components-skills](https://affpapa.org/en/nevibecode/by/syncfusion/react-ui-components-skills.md) — 57 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md