igniteui-angular 21.2.1 → 21.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "21.2.1",
+  "version": "21.2.3",
   "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
   "author": "Infragistics",
   "license": "SEE LICENSE IN LICENSE",

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

@@ -21,7 +21,7 @@ Create or edit `.vscode/mcp.json` in your project:
   "servers": {
     "igniteui-cli": {
       "command": "npx",
-      "args": ["-y", "igniteui-cli@next", "mcp"]
+      "args": ["-y", "igniteui-cli", "mcp"]
     }
   }
 }
@@ -38,7 +38,7 @@ Create or edit `.cursor/mcp.json`:
   "mcpServers": {
     "igniteui-cli": {
       "command": "npx",
-      "args": ["-y", "igniteui-cli@next", "mcp"]
+      "args": ["-y", "igniteui-cli", "mcp"]
     }
   }
 }
@@ -55,7 +55,7 @@ Edit the Claude Desktop config file:
   "mcpServers": {
     "igniteui-cli": {
       "command": "npx",
-      "args": ["-y", "igniteui-cli@next", "mcp"]
+      "args": ["-y", "igniteui-cli", "mcp"]
     }
   }
 }
@@ -65,7 +65,7 @@ Edit the Claude Desktop config file:
 
 1. Go to **Settings → Tools → AI Assistant → MCP Servers**
 2. Click **+ Add MCP Server**
-3. Set Command to `npx` and Arguments to `igniteui-cli@next mcp`
+3. Set Command to `npx` and Arguments to `-y igniteui-cli mcp`
 4. Click OK and restart the AI Assistant
 
 ## Verifying the Setup

package/skills/igniteui-angular-generate-from-image-design/SKILL.md

@@ -146,7 +146,7 @@ For **every** core Ignite UI component chosen in Steps 3-4, follow this MCP-firs
 - Resolve each value to a palette token or local semantic CSS variable
 - Call `create_component_theme("grid", ...)` with only `{ "header-background": "<resolved token>", "content-background": "<resolved token>", "row-hover-background": "<resolved token>" }`
 
-Apply the generated theme blocks inside `::ng-deep` scoped to the component selector as shown in the `create_component_theme` output.
+Apply the generated theme block using `@include tokens(<theme-name>);` as returned by `create_component_theme`.
 
 Do not run `create_component_theme` for regions built with custom HTML/CSS only.
 

package/skills/igniteui-angular-generate-from-image-design/references/gotchas.md

@@ -118,24 +118,9 @@ igx-nav-drawer {
 ```
 
 ### Dark theme overrides for `IgxGridComponent`
-Grid internals often need explicit dark-theme overrides. Use palette tokens or local semantic CSS variables that map to the design:
+Grid internals often need explicit dark-theme overrides. Use `get_component_design_tokens("grid")` to discover available tokens, then call `create_component_theme` with the tokens that differ from the global theme. Apply the returned theme with the `tokens`:
 ```scss
-:host ::ng-deep igx-grid {
-  .igx-grid__thead,
-  .igx-grid__tr {
-    background: <resolved-surface-token>;
-  }
-
-  .igx-grid__th,
-  .igx-grid__td {
-    color: <resolved-text-token>;
-    border-color: <resolved-border-token>;
-  }
-
-  .igx-grid__tbody {
-    background: <resolved-surface-token>;
-  }
-}
+@include tokens($custom-grid-theme);
 ```
 
 ### Read luminance warnings from theme generation

package/types/igniteui-angular-grids-core.d.ts

@@ -3389,6 +3389,7 @@ declare class IgxGridFilteringCellComponent implements AfterViewInit, OnInit, Do
     get pinnedCss(): boolean;
     get pinnedLastCss(): boolean;
     get pinnedFirstCSS(): boolean;
+    role: string;
     private baseClass;
     constructor();
     ngOnInit(): void;
@@ -7554,6 +7555,10 @@ declare class IgxGridHeaderRowComponent implements DoCheck {
     pinnedEndColumnCollection: ColumnType[];
     /** Unpinned columns of the grid. */
     unpinnedColumnCollection: ColumnType[];
+    /**
+     * @hidden @internal
+     */
+    role: string;
     get activeDescendant(): string;
     hasMRL: boolean;
     width: number;
@@ -8112,6 +8117,11 @@ declare class IgxGridToolbarComponent implements OnDestroy {
      * @internal
      */
     defaultStyle: boolean;
+    /**
+     * @hidden
+     * @internal
+     */
+    role: string;
     protected _grid: GridType;
     protected sub: Subscription;
     constructor();
@@ -10367,6 +10377,10 @@ declare abstract class IgxGroupByAreaDirective {
      */
     dropAreaTemplate: TemplateRef<void>;
     defaultClass: boolean;
+    /**
+     * @hidden @internal
+     */
+    role: string;
     /** The parent grid containing the component. */
     grid: FlatGridType | GridType;
     /**