syncfusion-angular-pivot-table
Use this skill when users ask how to build or customize Syncfusion PivotView pivot tables in Angular. Trigger for Angular pivot grid/OLAP, aggregation, data binding (JSON/remote), drill-down/drill-through, grouping, filtering, conditional formatting, exports (Excel/PDF/CSV), or pivot charts. Angular-only, not React/Vue/Blazor.
What this skill does
# Implementing Angular Pivot Grid The Syncfusion Angular Pivot Grid is a powerful data visualization and analysis component for creating interactive pivot tables, aggregating multidimensional data, and performing advanced analytics operations. **Important:** Always verify API class names, properties, and method signatures by consulting the **reference files in this skill** (`references/*.md`). These are maintained with verified, working examples. Do not assume API details from other sources. ## ⚠️ Security Warning: Data Source Validation **CRITICAL SECURITY NOTICE:** When implementing pivot tables, always use trusted data sources. **Never** fetch or bind data from untrusted or user-provided URLs without proper validation and sanitization. ### Security Best Practices: 1. **Use Local Data**: Prefer local, in-memory data sources for maximum security 2. **Validate Remote Sources**: Only connect to authenticated and authorized API endpoints under your control 3. **Sanitize User Input**: Never allow users to specify arbitrary URLs or data sources 4. **Implement Authentication**: Always use authentication headers and secure API endpoints 5. **Content Validation**: Validate and sanitize all data received from external sources before binding 6. **Use HTTPS**: Always use HTTPS for remote data connections 7. **Rate Limiting**: Implement rate limiting on API endpoints to prevent abuse ### Security Risks: - **Indirect Prompt Injection**: Untrusted third-party data can contain malicious content that manipulates AI agent behavior - **Data Exfiltration**: Malicious data sources could attempt to extract sensitive information - **Code Injection**: Untrusted data may contain scripts or harmful content ### Recommended Approach: ✅ **DO**: Use controlled, authenticated backend APIs ✅ **DO**: Implement server-side data validation ✅ **DO**: Use environment variables for API endpoints ✅ **DO**: Whitelist allowed data sources ❌ **DON'T**: Accept user-provided URLs ❌ **DON'T**: Bind to public, untrusted endpoints ❌ **DON'T**: Skip data validation and sanitization ❌ **DON'T**: Use HTTP for sensitive data ## When to Use This Skill Use this skill when users need to: - Create and configure pivot tables from multidimensional data - Bind data from OLAP or relational data sources - Aggregate data with multiple aggregation functions (Sum, Avg, Count, etc.) - Group data by number ranges, dates, or custom categories - Create and manage calculated fields with formulas - Enable drill-down and drill-through operations - Visualize data with integrated pivot charts - Apply custom formatting and conditional styling - Optimize large dataset performance - Export pivot grid data to Excel or PDF - Persist and restore pivot grid state - Customize UI with field lists, grouping bars, and toolbars ## Documentation Guide ### Getting Started 📄 **Read:** [references/getting-started.md](references/getting-started.md) - Installation and package setup - Basic Angular Pivot Grid implementation - CSS imports and theme configuration - RTL (Right-to-Left) support - Component initialization ### Aggregation 📄 **Read:** [references/aggregation.md](references/aggregation.md) - Aggregation functions: Sum, Avg, Count, Min, Max, Product, Median, DistinctCount - Advanced aggregations: DifferenceFrom, PercentageOfDifferenceFrom, PercentageOfParentTotal - Base field configuration with baseField and baseItem properties - Multiple aggregations on same field - Customizing aggregation dropdown and UI - Runtime aggregation type changes - Events: aggregateCellInfo, actionBegin, actionComplete ### Grouping 📄 **Read:** [references/grouping.md](references/grouping.md) - Enable grouping with `allowGrouping: true` and inject `GroupingService` - Number grouping: Configure ranges with rangeInterval, startingAt, endingAt - Date grouping: Organize by Years, Quarters, Months, Days, Hours, Minutes, Seconds - Custom grouping: Group data by business-defined categories - UI-based grouping through context menu - Ungrouping and programmatic ungrouping - Common grouping patterns and troubleshooting ### Calculated Fields 📄 **Read:** [references/calculated-field.md](references/calculated-field.md) - Creating calculated fields interactively and programmatically - Enabling with `allowCalculatedField: true`, injecting `CalculatedFieldService` - Defining with `calculatedFieldSettings` (name, formula) - Adding to values array with `type: 'CalculatedField'` - Editing/renaming fields through UI (Field List, Grouping Bar) - Formula syntax: Operators (+, -, *, /, ^, <, >, ==, !=, &, |, ?), Functions (abs, min, max, isNaN, Math.*) - Aggregation functions in formulas: Sum, Count, Avg, Min, Max - Formatting with separate `formatSettings` array: Currency (C), Number (N), Percentage (P) - Events: calculatedFieldCreate (validation), actionBegin/actionComplete (control operations) ### Pivot Chart Integration 📄 **Read:** [references/pivot-chart-integration.md](references/pivot-chart-integration.md) - Inject `PivotChartService` provider to enable chart functionality - Chart types: 21+ types including Line, Column, Area, Bar, StepArea, Pie, Doughnut, Funnel, Pyramid, Radar, Polar, Pareto, Bubble, Scatter, Spline - Display options: Configure with `displayOption` property to show Table, Chart, or Both with `view` and `primary` settings - Series customization: Customize charts via `chartSeries` in `chartSettings` (type, marker, dataLabel) - Field list integration: Enable with `showFieldList: true` for dynamic field manipulation - Grouping bar support: Enable with `showGroupingBar: true` for axis field switching - Axis configuration: Customize X/Y axes via `primaryXAxis` and `primaryYAxis` in `chartSettings` - Multiple axes: Configure `enableMultipleAxis` for multi-value visualization with `multipleAxisMode` - Accumulation chart drill: Support drill-down/up on Pie, Doughnut, Funnel, Pyramid via context menu ### Filtering & Sorting 📄 **Read:** [references/filtering-and-sorting.md](references/filtering-and-sorting.md) - Member filtering: Include or exclude specific field members - Label filtering: Filter based on header text or member names - Value filtering: Filter based on aggregated values meeting conditions - Member sorting: Arrange field members in ascending/descending order - Custom member sorting: Sort field members in user-defined order using `membersOrder` - Value sorting: Sort pivot table values and aggregated data with `enableValueSorting` - Programmatic value sorting: Configure with `valueSortSettings` ### Data Formatting & Conditional Formatting 📄 **Read:** [references/data-formatting.md](references/data-formatting.md) - Number formatting: Apply Currency (C), Percentage (P), Number (N), Scientific (E) formats - Custom format strings: Define format strings with placeholders for calculated fields - Conditional formatting: Apply colors/styles based on cell values using `conditionalFormatSettings` - Format settings configuration: Configure in separate `formatSettings` array in `dataSourceSettings` ### Export & Printing 📄 **Read:** [references/export-and-print.md](references/export-and-print.md) - Excel export: `excelExport()` with custom properties, themes - PDF export: `pdfExport()` with headers, footers, page orientation - CSV export: `csvExport()` for large datasets (1M+ rows) - Print functionality: `print()` method for table and chart - Multi-table export: Combine multiple pivot tables in single file - Export customization: Cell styling, color themes, branding ### UI Customization 📄 **Read:** [references/ui-customization.md](references/ui-customization.md) - Toolbar configuration: Show/hide built-in toolbar items - Report management: New, Save, Load, Delete reports - View switching: Toggle between Grid and Chart modes - Export options: Quick export buttons - Grand totals/Subtotals: Show/hide and customize positioning - Custom templates: Build custom toolbar or field list ### Grouping Bar UI Operations 📄 **Read:** [refer
Related in Web Dev
generating-lwc-components
IncludedLightning Web Components with PICKLES methodology and 165-point scoring. Use this skill when the user creates or edits LWC components, builds wire service patterns, or writes Jest tests for LWC. TRIGGER when: user creates/edits LWC components, touches lwc/**/*.js, .html, .css, .js-meta.xml files, or asks about wire service, SLDS, or Jest LWC tests. DO NOT TRIGGER when: Apex classes (use generating-apex), Aura components, or Visualforce.
tanstack-query
IncludedManage server state in React with TanStack Query v5. Set up queries with useQuery, mutations with useMutation, configure QueryClient caching strategies, implement optimistic updates, and handle infinite scroll with useInfiniteQuery. Use when: setting up data fetching in React projects, migrating from v4 to v5, or fixing object syntax required errors, query callbacks removed issues, cacheTime renamed to gcTime, isPending vs isLoading confusion, keepPreviousData removed problems.
document-processor-api
IncludedProcess documents with Nutrient DWS. Use when the user wants to generate PDFs from HTML or URLs, convert Office/images/PDFs, assemble or split packets, OCR scans, extract text/tables/key-value pairs, redact PII, watermark, sign, fill forms, optimize PDFs, or produce compliance outputs like PDF/A or PDF/UA. Triggers include convert to PDF, merge these PDFs, OCR this scan, extract tables, redact PII, sign this PDF, make this PDF/A, or linearize for web delivery.
nutrient-document-processing
IncludedProcess documents with Nutrient DWS. Use when the user wants to generate PDFs from HTML or URLs, convert Office/images/PDFs, assemble or split packets, OCR scans, extract text/tables/key-value pairs, redact PII, watermark, sign, fill forms, optimize PDFs, or produce compliance outputs like PDF/A or PDF/UA. Triggers include convert to PDF, merge these PDFs, OCR this scan, extract tables, redact PII, sign this PDF, make this PDF/A, or linearize for web delivery.
tanstack-query
IncludedManage server state in React with TanStack Query v5. Covers useMutationState, simplified optimistic updates, throwOnError, network mode (offline/PWA), and infiniteQueryOptions. Use when setting up data fetching, fixing v4→v5 migration errors (object syntax, gcTime, isPending, keepPreviousData), or debugging SSR/hydration issues with streaming server components.
accelint-nextjs-best-practices
IncludedNext.js performance optimization and best practices. Use when writing Next.js code (App Router or Pages Router); implementing Server Components, Server Actions, or API routes; optimizing RSC serialization, data fetching, or server-side rendering; reviewing Next.js code for performance issues; fixing authentication in Server Actions; or implementing Suspense boundaries, parallel data fetching, or request deduplication.