igniteui-angular 21.1.0-rc.5 → 21.1.1

package/skills/igniteui-angular-components/references/setup.md

@@ -2,6 +2,13 @@
 
 > **Part of the [`igniteui-angular-components`](../SKILL.md) skill hub.**
 
+## Contents
+
+- [Installation](#installation)
+- [Required Providers (`app.config.ts`)](#required-providers-appconfigts)
+- [Architecture — Standalone Components](#architecture--standalone-components)
+- [Multi-Entry-Point Imports](#multi-entry-point-imports)
+
 ## Installation
 
 ```bash
@@ -50,7 +57,7 @@ All Ignite UI components are **standalone** — no NgModules needed. Import them
 
 ```typescript
 import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { IgxButtonDirective } from 'igniteui-angular/button';
+import { IgxButtonDirective } from 'igniteui-angular/directives';
 import { IgxDialogComponent } from 'igniteui-angular/dialog';
 
 @Component({
@@ -94,7 +101,7 @@ import { IgxComboComponent } from 'igniteui-angular';
 | Stepper | `igniteui-angular/stepper` |
 | Accordion / Expansion Panel | `igniteui-angular/expansion-panel` |
 | Splitter | `igniteui-angular/splitter` |
-| Navigation Drawer | `igniteui-angular/nav-drawer` |
+| Navigation Drawer | `igniteui-angular/navigation-drawer` |
 | Bottom Navigation | `igniteui-angular/bottom-nav` |
 | List | `igniteui-angular/list` |
 | Tree | `igniteui-angular/tree` |
@@ -109,24 +116,37 @@ import { IgxComboComponent } from 'igniteui-angular';
 | Icon | `igniteui-angular/icon` |
 | Carousel | `igniteui-angular/carousel` |
 | Paginator | `igniteui-angular/paginator` |
-| Linear Progress | `igniteui-angular/linear-progress-bar` |
-| Circular Progress | `igniteui-angular/circular-progress-bar` |
+| Linear Progress | `igniteui-angular/progressbar` |
+| Circular Progress | `igniteui-angular/progressbar` |
 | Chat | `igniteui-angular/chat` |
-| Button / Icon Button | `igniteui-angular/button` |
-| Ripple | `igniteui-angular/ripple` |
-| Tooltip | `igniteui-angular/tooltip` |
-| Drag & Drop | `igniteui-angular/drag-drop` |
+| Button / Icon Button | `igniteui-angular/directives` |
+| Button Group | `igniteui-angular/button-group` |
+| Ripple | `igniteui-angular/directives` |
+| IgxTooltipDirective, IgxTooltipTargetDirective | `igniteui-angular/directives` |
+| Drag & Drop | `igniteui-angular/directives` |
 | Layout Manager (`igxLayout`, `igxFlex`) | `igniteui-angular/directives` |
+| Core utilities, services, base types | `igniteui-angular/core` |
 | Icon Service | `igniteui-angular/icon` |
 | Overlay Service | `igniteui-angular/core` |
 | **Dock Manager** | `igniteui-dockmanager` *(separate package — `npm install igniteui-dockmanager`)* |
 
+**Grid-specific entry points** (tree-shakable imports):
+
+| Component / Feature | Entry Point |
+|---|---|
+| Shared grid infrastructure (columns, toolbar, filtering, sorting, etc.) | `igniteui-angular/grids/core` |
+| Standard grid (`IgxGridComponent`) | `igniteui-angular/grids/grid` |
+| Tree grid (`IgxTreeGridComponent`) | `igniteui-angular/grids/tree-grid` |
+| Hierarchical grid (`IgxHierarchicalGridComponent`, `IgxRowIslandComponent`) | `igniteui-angular/grids/hierarchical-grid` |
+| Pivot grid (`IgxPivotGridComponent`, `IgxPivotDataSelectorComponent`) | `igniteui-angular/grids/pivot-grid` |
+
 ### Convenience Directive Collections
 
 For complex components, use the bundled directive arrays instead of listing every sub-directive individually:
 
 | Token | Entry Point | Includes |
 |---|---|---|
+| `IGX_BUTTON_GROUP_DIRECTIVES` | `igniteui-angular/button-group` | Button group + button directive |
 | `IGX_INPUT_GROUP_DIRECTIVES` | `igniteui-angular/input-group` | Input group + label, hint, prefix, suffix |
 | `IGX_TABS_DIRECTIVES` | `igniteui-angular/tabs` | Tabs + tab item, header, content |
 | `IGX_STEPPER_DIRECTIVES` | `igniteui-angular/stepper` | Stepper + step |
@@ -140,7 +160,7 @@ For complex components, use the bundled directive arrays instead of listing ever
 - [`layout.md`](./layout.md) — Tabs, Stepper, Accordion, Splitter, Navigation Drawer
 - [`data-display.md`](./data-display.md) — List, Tree, Card, Chips, Avatar, Badge, Icon, Carousel, Paginator, Progress, Chat
 - [`feedback.md`](./feedback.md) — Dialog, Snackbar, Toast, Banner
-- [`directives.md`](./directives.md) — Button, Ripple, Tooltip, Drag and Drop
+- [`directives.md`](./directives.md) — Button, Icon Button, Button Group, Ripple, Tooltip, Drag and Drop
 - [`layout-manager.md`](./layout-manager.md) — Layout Manager directives, Dock Manager
 - [`../../igniteui-angular-grids/SKILL.md`](../../igniteui-angular-grids/SKILL.md) — Data Grids
 - [`../../igniteui-angular-theming/SKILL.md`](../../igniteui-angular-theming/SKILL.md) — Theming & Styling

package/skills/igniteui-angular-grids/SKILL.md

@@ -1,7 +1,7 @@
 ---
 name: igniteui-angular-grids
-description: "All grid topics for Ignite UI Angular: grid setup, column configuration, sorting, filtering, selection, editing, grouping, summaries, toolbar, export, paging, remote data, state persistence, Tree Grid, Hierarchical Grid, Grid Lite, and Pivot Grid. Use for any grid-related question."
-user-invokable: true
+description: "Provides guidance on all Ignite UI for Angular data grid types (Flat Grid, Tree Grid, Hierarchical Grid, Grid Lite, Pivot Grid) including setup, column configuration, sorting, filtering, selection, editing, grouping, summaries, toolbar, export, paging, remote data, and state persistence. Use when users ask about grids, tables, data grids, tabular data display, cell editing, batch editing, row selection, column pinning, column hiding, grouping rows, pivot tables, tree-structured data, hierarchical data, master-detail views, or exporting grid data. Do NOT use for non-grid UI components (forms, dialogs, navigation, charts) — use igniteui-angular-components instead. Do NOT use for theming or styling — use igniteui-angular-theming instead."
+user-invocable: true
 ---
 
 # Ignite UI for Angular — Data Grids
@@ -21,8 +21,8 @@ Use the Grid Selection Decision Guide below. If the grid type is not explicitly
 **STEP 2 — Identify every task category involved.**
 Map the user's request to one or more rows in the Task → Reference File table below. A single request often spans multiple categories (e.g., remote paging AND editing requires reading both `paging-remote.md` AND `editing.md`).
 
-**STEP 3 — Read every identified reference file in full.**
-Call `read_file` (or equivalent) on each reference file identified in Step 2. You must do this even if you believe you already know the answer. Do not skip, skim, or partially read a reference file.
+**STEP 3 — Read every identified reference file in full (PARALLEL).**
+Call `read_file` (or equivalent) on **all** reference files identified in Step 2 **in a single parallel batch** — do NOT read them one at a time sequentially. You must do this even if you believe you already know the answer. Do not skip, skim, or partially read a reference file.
 
 **STEP 4 — Only then produce output.**
 Base your code and explanation exclusively on what you read in Step 3. If the reference files do not cover something, say so explicitly rather than guessing.
@@ -33,11 +33,11 @@ Base your code and explanation exclusively on what you read in Step 3. If the re
 |---|---|
 | Grid type selection, column config, column templates, column groups, MRL, pinning, sorting UI, filtering UI, selection | [`references/structure.md`](./references/structure.md) |
 | Grouping, summaries, cell merging, toolbar, export, row drag, action strip, master-detail, clipboard | [`references/features.md`](./references/features.md) |
-| Tree Grid specifics, Hierarchical Grid specifics, Grid Lite setup, Pivot Grid setup | [`references/types.md`](./references/types.md) |
+| Tree Grid specifics, Hierarchical Grid specifics, Grid Lite setup, Grid Lite data operations, Pivot Grid setup | [`references/types.md`](./references/types.md) |
 | Programmatic sorting / filtering / grouping, canonical import patterns, `viewChild` access | [`references/data-operations.md`](./references/data-operations.md) |
 | Cell editing, row editing, batch editing, transactions, validation, summaries | [`references/editing.md`](./references/editing.md) |
 | Paging, remote data, server-side ops, noop strategies, virtual scroll, multi-grid coordination | [`references/paging-remote.md`](./references/paging-remote.md) |
-| State persistence, Tree Grid / Hierarchical Grid / Pivot Grid / Grid Lite data operations | [`references/state.md`](./references/state.md) |
+| State persistence, Tree Grid / Hierarchical Grid / Pivot Grid data operations | [`references/state.md`](./references/state.md) |
 
 > **When in doubt, read more rather than fewer reference files.** The cost of an unnecessary file read is negligible; the cost of hallucinated API usage is a broken application.
 
@@ -59,7 +59,7 @@ Ignite UI has **five grid types**. Picking the correct one is the most important
 
 Ask these questions in order:
 
-1. **Does the user need a lightweight, read-only data display** with sorting, filtering, and virtualization but no editing, selection, or paging? → **Grid Lite** (open-source, MIT licensed)
+1. **Does the user need a lightweight, read-only data display** with sorting, filtering, and virtualization but no editing, selection, or paging? → **Grid Lite** (open-source, MIT licensed). **If the user later needs features beyond Grid Lite's capabilities, upgrade strictly to `igx-grid` (`IgxGridComponent`)** — never recommend non-grid components as a substitute.
 2. **Does the user need pivot-table analytics** (rows/columns/values/aggregations that users can drag-and-drop to reshape)? → **Pivot Grid**
 3. **Does the data have parent-child relationships where each level has a DIFFERENT schema** (e.g., Companies → Departments → Employees)? → **Hierarchical Grid**
 4. **Does the data have parent-child relationships within a SINGLE schema** (e.g., Employees with a `managerId` field, or nested children arrays)? → **Tree Grid**

package/skills/igniteui-angular-grids/references/data-operations.md

@@ -6,6 +6,14 @@
 > For editing and validation — see [`editing.md`](./editing.md).
 > For state persistence — see [`state.md`](./state.md).
 
+## Contents
+
+- [Accessing the Grid Instance](#accessing-the-grid-instance)
+- [Sorting](#sorting)
+- [Filtering](#filtering)
+- [Grouping (Flat Grid Only)](#grouping-flat-grid-only)
+- [Key Rules](#key-rules)
+
 ## Accessing the Grid Instance
 
 All programmatic data operations require a reference to the grid component. Use `viewChild` with the **correct component type** for your grid.
@@ -145,7 +153,8 @@ Sorting modes:
 ### Programmatic Sorting
 
 ```typescript
-import { SortingDirection } from 'igniteui-angular/grids/core';
+import { SortingDirection } from 'igniteui-angular/core';
+// import { SortingDirection } from '@infragistics/igniteui-angular/core'; for licensed package
 
 // Sort a single column
 this.gridRef().sort({ fieldName: 'name', dir: SortingDirection.Asc, ignoreCase: true });
@@ -189,7 +198,7 @@ onSortingDone(event: ISortingEventArgs) {
 Implement `ISortingStrategy` to control how values are compared:
 
 ```typescript
-import { ISortingStrategy, SortingDirection } from 'igniteui-angular/grids/core';
+import { ISortingStrategy, SortingDirection } from 'igniteui-angular/core';
 
 class PrioritySortStrategy implements ISortingStrategy {
   private priorityOrder = ['Critical', 'High', 'Medium', 'Low'];
@@ -248,7 +257,8 @@ import {
   IgxBooleanFilteringOperand,
   FilteringExpressionsTree,
   FilteringLogic
-} from 'igniteui-angular/grids/core';
+} from 'igniteui-angular/core';
+// import { ... } from '@infragistics/igniteui-angular/core'; for licensed package
 
 // Simple single-column filter
 this.gridRef().filter('name', 'John', IgxStringFilteringOperand.instance().condition('contains'), true);
@@ -308,7 +318,7 @@ Control the AND/OR logic between **different column** filters:
 ```
 
 ```typescript
-import { FilteringLogic } from 'igniteui-angular/grids/core';
+import { FilteringLogic } from 'igniteui-angular';
 
 // FilteringLogic.And (default) — row must match ALL column filters
 // FilteringLogic.Or — row must match ANY column filter
@@ -368,7 +378,7 @@ onFilteringDone(event: IFilteringEventArgs) {
 ### Programmatic Grouping
 
 ```typescript
-import { SortingDirection } from 'igniteui-angular/grids/core';
+import { SortingDirection } from 'igniteui-angular/core';
 
 // Group by a column
 this.gridRef().groupBy({ fieldName: 'category', dir: SortingDirection.Asc, ignoreCase: true });

package/skills/igniteui-angular-grids/references/editing.md

@@ -5,6 +5,16 @@
 > For state persistence — see [`state.md`](./state.md).
 > For paging and remote data — see [`paging-remote.md`](./paging-remote.md).
 
+## Contents
+
+- [Editing Data Through the Grid](#editing-data-through-the-grid)
+- [Batch Editing & Transactions](#batch-editing--transactions)
+- [Excel-Style Editing Workflows](#excel-style-editing-workflows)
+- [Editing Events Reference](#editing-events-reference)
+- [Validation](#validation)
+- [Summaries](#summaries)
+- [Key Rules](#key-rules)
+
 ## Editing Data Through the Grid
 
 > **AGENT INSTRUCTION:** When a user says they want to "edit data through the grid", "make the grid editable", or "allow CRUD in the grid", use this section to pick the right editing mode before writing any code.
@@ -423,7 +433,8 @@ Default summaries by type:
 ### Custom Summary Operand
 
 ```typescript
-import { IgxNumberSummaryOperand, IgxSummaryResult } from 'igniteui-angular/grids/core';
+import { IgxNumberSummaryOperand } from 'igniteui-angular/grids/core';
+import { IgxSummaryResult } from 'igniteui-angular/core';
 
 class RevenueSummary extends IgxNumberSummaryOperand {
   operate(data: number[]): IgxSummaryResult[] {

package/skills/igniteui-angular-grids/references/features.md

@@ -5,6 +5,21 @@
 > For Tree Grid, Hierarchical Grid, Grid Lite, Pivot Grid specifics — see [`types.md`](./types.md).
 > For full editing coverage (cell/row/batch) — see [`editing.md`](./editing.md).
 
+## Contents
+
+- [Editing](#editing)
+- [Grouping (Grid only)](#grouping-grid-only)
+- [Summaries](#summaries)
+- [Cell Merging](#cell-merging)
+- [Toolbar](#toolbar)
+- [Export](#export)
+- [Virtualization & Performance](#virtualization--performance)
+- [Row Drag](#row-drag)
+- [Action Strip](#action-strip)
+- [Master-Detail (Grid only)](#master-detail-grid-only)
+- [Clipboard](#clipboard)
+- [Key Rules](#key-rules)
+
 ## Editing
 
 > **Full editing coverage is in [`editing.md`](./editing.md)**, which includes cell editing, row editing, batch editing with transactions, row adding/deleting, validation, and summaries. Use that reference for any editing task.
@@ -43,15 +58,9 @@ For advanced programmatic grouping patterns — see [`data-operations.md`](./dat
 
 ## Summaries
 
-> **Full summaries coverage (built-in and custom summary operands) is in [`editing.md`](./editing.md).**
-
-Quick reference — enable per-column summaries:
-
-```html
-<igx-column field="salary" dataType="number" [hasSummary]="true"></igx-column>
-```
-
-Default summaries by type: **number** → Count/Min/Max/Sum/Average; **date** → Count/Earliest/Latest; **string/boolean** → Count.
+> **Full summaries coverage — built-in summaries, custom summary operands, and summaries with grouping — is in [`editing.md`](./editing.md#summaries).**
+>
+> Quick reference: enable per-column summaries with `[hasSummary]="true"` on an `igx-column`. Default operands: **number** → Count/Min/Max/Sum/Average; **date** → Count/Earliest/Latest; **string/boolean** → Count.
 
 ## Cell Merging
 
@@ -68,7 +77,10 @@ Or apply a custom merge strategy:
 ```
 
 ```typescript
-priceRangeMerge: IgxCellMergeStrategy = {
+import { IGridMergeStrategy } from 'igniteui-angular/core';
+// import { IGridMergeStrategy } from '@infragistics/igniteui-angular/core'; for licensed package
+
+priceRangeMerge: IGridMergeStrategy = {
   shouldMerge(prevCell, curCell) {
     return Math.abs(prevCell.value - curCell.value) < 10;
   }
@@ -79,6 +91,10 @@ priceRangeMerge: IgxCellMergeStrategy = {
 
 > **Docs:** [Toolbar](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/toolbar)
 
+```typescript
+import { IgxGridToolbarComponent } from 'igniteui-angular/grids/core';
+```
+
 ```html
 <igx-grid [data]="data()">
   <igx-grid-toolbar>

package/skills/igniteui-angular-grids/references/paging-remote.md

@@ -5,6 +5,14 @@
 > For editing and validation — see [`editing.md`](./editing.md).
 > For state persistence — see [`state.md`](./state.md).
 
+## Contents
+
+- [Paging](#paging)
+- [Remote Data Operations](#remote-data-operations)
+- [Virtualization](#virtualization)
+- [Multi-Grid Coordination](#multi-grid-coordination)
+- [Key Rules](#key-rules)
+
 ## Paging
 
 > **Docs:** [Paging — Remote Paging](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/paging#remote-paging) (substitute URL prefix per grid type)
@@ -51,7 +59,8 @@ this.gridRef().paginator.perPage = 25;
 ### Remote Paging
 
 ```typescript
-import { GridPagingMode } from 'igniteui-angular/grids/grid';
+import { GridPagingMode } from 'igniteui-angular/grids/core';
+import { IPageEventArgs } from 'igniteui-angular/paginator';
 
 export class RemotePagingComponent {
   data = signal<Product[]>([]);
@@ -120,12 +129,12 @@ import { Component, ChangeDetectionStrategy, signal, viewChild, inject, DestroyR
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { IgxGridComponent, IGX_GRID_DIRECTIVES } from 'igniteui-angular/grids/grid';
 import {
-  IForOfState,
-  ISortingEventArgs,
   IFilteringExpressionsTree,
   NoopSortingStrategy,
   NoopFilteringStrategy
-} from 'igniteui-angular/grids/core';
+} from 'igniteui-angular/core';
+import { IForOfState } from 'igniteui-angular/directives';
+import { ISortingEventArgs } from 'igniteui-angular/grids/core';
 import { debounceTime, Subject } from 'rxjs';
 
 @Component({

package/skills/igniteui-angular-grids/references/state.md

@@ -5,6 +5,15 @@
 > For Tree Grid / Hierarchical Grid / Pivot Grid / Grid Lite setup — see [`types.md`](./types.md).
 > For paging and remote data — see [`paging-remote.md`](./paging-remote.md).
 
+## Contents
+
+- [State Persistence](#state-persistence)
+- [Tree Grid Data Operations](#tree-grid-data-operations)
+- [Hierarchical Grid Data Operations](#hierarchical-grid-data-operations)
+- [Pivot Grid Data Operations](#pivot-grid-data-operations)
+- [Grid Lite Data Operations](#grid-lite-data-operations)
+- [Key Rules](#key-rules)
+
 ## State Persistence
 
 > **Docs:** [State Persistence](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/state-persistence) (substitute URL prefix per grid type)
@@ -20,7 +29,7 @@ Use `IgxGridStateDirective` to persist sorting, filtering, grouping, paging, sel
 ```
 
 ```typescript
-import { IgxGridStateDirective } from 'igniteui-angular/grids/grid';
+import { IgxGridStateDirective } from 'igniteui-angular/grids/core';
 
 export class StatefulGridComponent {
   gridState = viewChild.required(IgxGridStateDirective);
@@ -234,7 +243,7 @@ Setting `[batchEditing]="true"` on the root hierarchical grid automatically prop
 ### Dimension-Based Filtering
 
 ```typescript
-import { FilteringExpressionsTree, FilteringLogic, IgxStringFilteringOperand } from 'igniteui-angular/grids/core';
+import { FilteringExpressionsTree, FilteringLogic, IgxStringFilteringOperand } from 'igniteui-angular/core';
 
 // Create a filter for a dimension
 const regionFilter = new FilteringExpressionsTree(FilteringLogic.Or);
@@ -277,155 +286,12 @@ this.pivotGridRef().pipeTrigger++;
 
 ## Grid Lite Data Operations
 
-**Grid Lite** is a lightweight, open-source (MIT licensed) Web Component grid with an Angular wrapper. It supports **sorting and filtering only** — no editing, grouping, paging, summaries, selection, or export. Its API is **different from** the Flat/Tree/Hierarchical Grid APIs.
-
-> **IMPORTANT**: Grid Lite uses `IgxGridLiteSortingExpression` and `IgxGridLiteFilteringExpression` — NOT `ISortingExpression` or `FilteringExpressionsTree` from the enterprise grids.
-
-### Grid Lite Sorting
-
-```typescript
-import {
-  IgxGridLiteComponent,
-  IgxGridLiteSortingExpression,
-  IgxGridLiteSortingOptions
-} from 'igniteui-angular/grids/lite';
-
-@Component({
-  schemas: [CUSTOM_ELEMENTS_SCHEMA],
-  // ...
-})
-export class GridLiteSortExample {
-  gridRef = viewChild<IgxGridLiteComponent<Product>>('grid');
-
-  // Sorting options: mode can be 'single' or 'multiple'
-  sortingOptions: IgxGridLiteSortingOptions = { mode: 'multiple' };
-
-  // Initial sort state
-  sortExprs: IgxGridLiteSortingExpression[] = [
-    { key: 'name', direction: 'ascending' }
-  ];
-
-  sortByPrice() {
-    // Sort programmatically (single expression or array)
-    this.gridRef().sort({ key: 'price', direction: 'descending' });
-  }
-
-  clearAllSorts() {
-    this.gridRef().clearSort(); // clear all
-    // or: this.gridRef().clearSort('price'); // clear specific column
-  }
-}
-```
-
-```html
-<igx-grid-lite #grid
-  [data]="data"
-  [sortingOptions]="sortingOptions"
-  [(sortingExpressions)]="sortExprs"
-  (sorting)="onSorting($event)"
-  (sorted)="onSorted($event)">
-  <igx-grid-lite-column field="name" header="Name" sortable></igx-grid-lite-column>
-  <igx-grid-lite-column field="price" header="Price" dataType="number" sortable></igx-grid-lite-column>
-</igx-grid-lite>
-```
-
-Sort expression shape: `{ key: string, direction: 'ascending' | 'descending' | 'none' }`
-
-Sorting modes:
-- `'single'` — only one column sorted at a time
-- `'multiple'` — multi-column sorting
-- `triState: true` — allows cycling through ascending → descending → none
-
-### Grid Lite Filtering
-
-```typescript
-import {
-  IgxGridLiteComponent,
-  IgxGridLiteFilteringExpression
-} from 'igniteui-angular/grids/lite';
-
-// Filter expression shape
-const filters: IgxGridLiteFilteringExpression[] = [
-  { key: 'price', condition: 'greaterThan', searchTerm: 100 },
-  { key: 'name', condition: 'contains', searchTerm: 'Widget' }
-];
-
-// Programmatic filtering
-this.gridRef().filter({ key: 'price', condition: 'greaterThan', searchTerm: 100 });
-this.gridRef().clearFilter('price');
-this.gridRef().clearFilter(); // clear all
-```
-
-```html
-<igx-grid-lite #grid
-  [data]="data"
-  [(filteringExpressions)]="filterExprs"
-  (filtering)="onFiltering($event)"
-  (filtered)="onFiltered($event)">
-  <igx-grid-lite-column field="name" header="Name" filterable></igx-grid-lite-column>
-  <igx-grid-lite-column field="price" header="Price" dataType="number" filterable></igx-grid-lite-column>
-</igx-grid-lite>
-```
-
-Filter expression shape: `{ key: string, condition: string, searchTerm: any, criteria?: any[], caseSensitive?: boolean }`
-
-Filter conditions depend on `dataType`:
-- **string**: `contains`, `startsWith`, `endsWith`, `equals`, `doesNotContain`, `doesNotEqual`, `empty`, `notEmpty`, `null`, `notNull`
-- **number**: `equals`, `doesNotEqual`, `greaterThan`, `lessThan`, `greaterThanOrEqualTo`, `lessThanOrEqualTo`, `empty`, `notEmpty`, `null`, `notNull`
-- **boolean**: `all`, `true`, `false`, `empty`, `notEmpty`, `null`, `notNull`
-- **date**: `equals`, `doesNotEqual`, `before`, `after`, `today`, `yesterday`, `thisMonth`, `lastMonth`, `nextMonth`, `thisYear`, `lastYear`, `nextYear`, `empty`, `notEmpty`, `null`, `notNull`
-
-### Grid Lite Remote Data Operations
-
-Grid Lite uses `dataPipelineConfiguration` — a callback-based approach (NOT noop strategies):
-
-```typescript
-import { IgxGridLiteDataPipelineConfiguration } from 'igniteui-angular/grids/lite';
-
-dataPipeline: IgxGridLiteDataPipelineConfiguration<Product> = {
-  sort: async (params) => {
-    // params.grid — the grid instance
-    // params.data — current data array
-    // params.type — 'sort'
-    const result = await fetch(`/api/products?sort=${JSON.stringify(params.grid.sortingExpressions)}`);
-    return await result.json();
-  },
-  filter: async (params) => {
-    const result = await fetch(`/api/products?filter=${JSON.stringify(params.grid.filteringExpressions)}`);
-    return await result.json();
-  }
-};
-```
-
-```html
-<igx-grid-lite #grid
-  [data]="data"
-  [dataPipelineConfiguration]="dataPipeline">
-</igx-grid-lite>
-```
-
-Callbacks can be synchronous (return `T[]`) or asynchronous (return `Promise<T[]>`). When a `dataPipelineConfiguration` callback is provided for a given operation, the client-side pipeline for that operation is bypassed entirely.
-
-### Grid Lite Events
-
-| Event | Cancelable | Payload |
-|---|---|---|
-| `(sorting)` | Yes (`event.detail.cancel = true`) | Sorting expression about to be applied |
-| `(sorted)` | No | Sorting completed |
-| `(filtering)` | Yes (`event.detail.cancel = true`) | Filter expression about to be applied |
-| `(filtered)` | No | Filtering completed |
-
-### Grid Lite Limitations (No Data Operations)
-
-These data operations are **NOT available** in Grid Lite:
-- Editing (cell, row, batch) — no `[editable]`, no `beginEdit()`, no transactions
-- Grouping — no `groupBy()`, no `IgxGroupByRow`
-- Paging — no `IgxPaginatorComponent`
-- Summaries — no `IgxSummaryOperand`
-- Selection — no `rowSelection`, `cellSelection`, or `columnSelection`
-- State persistence — no `IgxGridStateDirective`
-- Export — no `IgxExcelExporterService` or `IgxCsvExporterService`
-- Advanced filtering — no `advancedFilteringExpressionsTree`
+> **Grid Lite sorting, filtering, remote data, events, and limitations are fully documented in [`types.md`](./types.md#grid-lite).** Refer to that file for all Grid Lite data operations — this section intentionally avoids duplicating that content.
+>
+> Key differences from Flat/Tree/Hierarchical Grid APIs:
+> - Uses `IgxGridLiteSortingExpression` / `IgxGridLiteFilteringExpression` (NOT `ISortingExpression` / `FilteringExpressionsTree`)
+> - Uses `dataPipelineConfiguration` for remote ops (NOT noop strategies + events)
+> - Has no editing, grouping, paging, summaries, selection, state persistence, or export
 
 ## Key Rules
 

package/skills/igniteui-angular-grids/references/structure.md

@@ -6,6 +6,15 @@
 > For Tree Grid, Hierarchical Grid, Grid Lite, Pivot Grid specifics — see [`types.md`](./types.md).
 > For programmatic data operations — see [`data-operations.md`](./data-operations.md).
 
+## Contents
+
+- [Quick Start](#quick-start)
+- [Column Configuration](#column-configuration)
+- [Sorting](#sorting)
+- [Filtering](#filtering)
+- [Selection](#selection)
+- [Key Rules](#key-rules)
+
 ## Quick Start
 
 ### Imports