IgniteUI

Refresh the Ignite UI AI skills bundled in the ai-config project templates (what ig ai-config copies when the project has no Ignite UI package with its own skills/) from the skills/ folders of the igniteui-angular, igniteui-react, igniteui-webcomponents and…

Changelog section for an Ignite UI CLI release cut, drafted from the PRs merged since the previous cut. WHEN TO USE: drafting or writing a release's CHANGELOG.md section. WHEN NOT TO USE: proposing one changelog line for your own change (the workflows'…

Add a component template (ig add <id>) for Angular, React and/or Web Components, verified against the pinned package version and validated end to end. WHEN TO USE: adding a component template to one or more frameworks. WHEN NOT TO USE: changing package…

Add a tool to the Ignite UI MCP server (@igniteui/mcp-server) or change an existing one: input schema, handler, response text, description, tests and every doc that lists the tool. WHEN TO USE: adding, changing, renaming or removing an MCP tool or its…

Validating template changes: build, the Jasmine template specs (running one spec file), and the smoke test (scripts/smoke-test.sh: scaffold with the local CLI, add templates, install, build); judging results, checking kept projects, triaging failures. WHEN TO…

Template anatomy for Angular (igx-ts), React (igr-ts) and Web Components (igc-ts): folder layout, index.ts fields, placeholders, test files, groups, and every place an Ignite UI version is pinned. WHEN TO USE: adding or changing a component template, locating…

Update or audit the Ignite UI versions that Angular, React and Web Components templates scaffold (ig new / ig add). WHEN TO USE: updating template version pins; asking which pins are stale or conflicting (dry-run). WHEN NOT TO USE: the CLI's own dependencies…

Covers non-grid Ignite UI for Blazor UI components: application setup, form controls (inputs, combos, selects, date/time pickers, calendar, checkbox, radio, switch, slider, rating), layout containers (tabs, stepper, accordion, expansion panel, navigation…

Authors and audits Ignite UI documentation topics - component pages, how-to guides, conceptual overviews and category indexes - across the Angular and cross-platform (React / Web Components / Blazor / WinUI / Uno) doc sets. Applies the Diataxis framework…

Audits and normalizes YAML frontmatter metadata on Ignite UI MDX documentation topics: SEO titles, meta descriptions, llms.description, keywords, canonical links, relatedComponents, mentionedTypes, license and the AI-readable page identity, across the Angular…

Reference guide for authoring and auditing API terms in the multi-platform docs tree. Strict-xplat topics require canonical backticked terms; other populations may use raw ApiLink components. Covers the platformType populations, the apiTerms modes, raw…

Authors and audits Ignite UI documentation topics - component pages, how-to guides, conceptual overviews and category indexes - across the Angular and cross-platform (React / Web Components / Blazor / WinUI / Uno) doc sets. Applies the Diataxis framework…

Reference guide for authoring and auditing API terms in the multi-platform docs tree. Strict-xplat topics require canonical backticked terms; other populations may use raw ApiLink components. Covers the platformType populations, the apiTerms modes, raw…

Guide for authoring and validating json-snippet blocks in xplat MDX: stating a component once as JSON so generation emits each platform's own code, choosing channels, keeping a platform from being stranded, and running the schema, emission, casing and…

Guidance for using PlatformBlock in xplat MDX after ApiLink moved to registry-based resolution: the import, case-sensitive platform names, what must not be wrapped, ComponentBlock nesting, tag balance and platform coverage. WHEN TO USE: adding, fixing or…

Guide for authoring and validating json-snippet blocks in xplat MDX: stating a component once as JSON so generation emits each platform's own code, choosing channels, keeping a platform from being stranded, and running the schema, emission, casing and…

Add a reactive property to an existing Lit web component with proper decorators, types, tests, specification updates, and documentation

Create a new Lit web component following project conventions, including specification, component class, styles, tests, Storybook story, and exports

Code review checklist for component pull requests covering structure, public API, specification accuracy, accessibility, behavior, styles, tests, and build hygiene

Provides rules for writing or updating a SKILL.md in this repository: frontmatter validation for license, name and description, the WHEN TO USE and WHEN NOT TO USE description format, and the 500-line body budget with progressive disclosure into reference…

Update component styling following the SCSS to Lit CSS workflow with proper theme support

Identify the correct Ignite UI Web Components (igniteui-webcomponents, grids, charts, dock manager, React wrappers) for a UI requirement. Give links to the official docs, examples, and API references. WHEN TO USE: the user asks which component fits a UI…

Theme and style Ignite UI Web Components (and igniteui-react) apps with CSS custom properties, optional Sass, and the igniteui-theming MCP server. WHEN TO USE: the user wants to apply or switch a pre-built theme (Material, Fluent, Bootstrap, Indigo,…

Builds Ignite UI Web Components views from Figma designs. Supports Indigo.Design kits, third-party kits (Material 3, Fluent 2, shadcn/ui, Untitled UI, in-house), and plain frames. Uses the Figma, Ignite UI CLI, Ignite UI Theming, and Playwright MCP servers.…

Quick-reference for running Ignite UI for Angular test suites. Covers the full library run (`test:lib`) on Vitest browser mode through the Angular unit-test builder, running a subset with `--include`/`--filter`, watch mode, extras/elements suites, and…

Covers all non-grid Ignite UI for Angular UI components: application scaffolding and setup, form controls (inputs, combos, selects, date/time pickers, calendar, checkbox, radio, switch, slider), layout containers (tabs, stepper, accordion, splitter,…

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…

This skill provides rules for writing or updating a SKILL.md in this repository, including frontmatter validation, discovery description markers, and the 500-line body budget. WHEN TO USE: creating or editing skills. WHEN NOT TO USE: writing custom agents or…

Builds Angular views from Figma designs with Ignite UI for Angular, supporting Indigo.Design kits, third-party kits, and plain frames. Uses Figma, Ignite UI CLI, theming, and Playwright MCP servers. WHEN TO USE: implementing a Figma design or artboard in an…

Implements Angular application views from design images using Ignite UI Angular components. Uses MCP servers (igniteui-cli, igniteui-theming, angular-cli) to discover components, generate themes, and follow best practices. WHEN TO USE: the user provides a…

Generates and customizes Ignite UI for Angular themes including color palettes, typography, elevations, and component-level styles using the Sass theming system and the igniteui-theming MCP server. WHEN TO USE: users ask to theme, restyle, or style Ignite UI…

Quick-reference for building the core Ignite UI for Angular library and related packages. Covers the full production build (`build:lib`), individual partial builds (styles, extras, migrations, schematics, i18n, elements), and the combined build-all command.…

Covers testing in the IgniteUI Blazor (Lite) repository itself: the bUnit unit suite (tests/IgniteUI.Blazor.Tests: base classes, attribute and serialization specs, declarative interop wire contracts) and the Playwright integration suite…

Covers Ignite UI for Blazor non-grid components: project setup and module registration; form controls (input, textarea, combo, select, date/time pickers, calendar, checkbox, radio, switch, slider, rating, mask input, color picker); layout and navigation…

Implements a Blazor view from a design image, screenshot, mockup, or wireframe using Ignite UI for Blazor components: analyzes the image, maps regions to components, generates a matching theme, builds the view with mock data, and refines it until it matches.…

Covers all Ignite UI for Blazor data grids (Grid Lite, Flat Grid, Tree Grid, Hierarchical Grid, Pivot Grid): setup, columns and templates, sorting, filtering, selection, cell and row editing, grouping, summaries, toolbar, Excel/CSV export, paging, remote and…

Covers theming and visual customization for Ignite UI for Blazor: choosing and switching the built-in Bootstrap, Material, Fluent and Indigo themes in light or dark, scoping a theme to part of the page with IgbThemeProvider, generating palettes and component…

Keeps IgniteUI.Blazor.Lite trim- and AOT-compatible when library code changes: source-generated JSON, DynamicallyAccessedMembers annotations, narrow suppressions, and verification through the trimmed PublishSmoke app. WHEN TO USE: touching reflection,…

Implement a Blazing Story story file (.stories.razor) for a Blazor UI component. Use when the user says "create a story for component X", "add stories for X", or similar requests in a Blazing Story (.NET / Blazor / Storybook) project.

Provides rules for writing or updating a SKILL.md in this repository: frontmatter validation for license, name and description, the WHEN TO USE and WHEN NOT TO USE description format, the split between public and contributor skills, and the 500-line body…

Provides rules for writing or updating a SKILL.md in this repository: frontmatter validation for license, name and description, the WHEN TO USE and WHEN NOT TO USE description format, the 500-line body budget with progressive disclosure into reference files,…

Covers choosing, installing, and using Ignite UI for React (Igr*) components: package routing, theme CSS, JSX and slots, events, refs, forms, TypeScript, charts, gauges, maps, and grids. WHEN TO USE: choosing a component for a UI pattern, setting up…

Covers theming Ignite UI for React with CSS custom properties: brand palette, dark mode, size, spacing and roundness, per-component tokens, and scoped themes, optionally through the igniteui-theming MCP server. WHEN TO USE: applying brand colors, switching…

Covers building a React view from a design image (screenshot, mockup, or wireframe) with Ignite UI for React components and generated theme tokens, using the igniteui-cli and igniteui-theming MCP servers when available. WHEN TO USE: the user supplies an image…

Covers migrating from Grid Lite (IgrGridLite) to the premium Ignite UI for React Data Grid (IgrGrid): imports, theme CSS, column and template API changes, sorting and filtering, remote data replacing dataPipelineConfiguration, and the toolbar and export APIs.…

Covers reducing bundle size in apps that use Ignite UI for React: package selection, tree-shaking, and route-level code splitting of grids, charts, maps, and gauges. WHEN TO USE: the bundle or initial load is too large, tree-shaking is not removing unused…

Audits this repository's teaching content against the real file structure. Use when checking README examples, AGENTS.md, CLAUDE.md, .claude/, .github/, or shared skills for accuracy and consistency.

Help a user or agent adopt this repository structure into another project by deciding what to copy, what to adapt, what to skip, and producing a simple adoption plan. Use when someone wants to reuse this repo's AI structure in a new or existing project,…

Reviews pull requests that change the teaching structure of this repository. Use when PRs affect README.md, AGENTS.md, CLAUDE.md, .claude/, .github/, or skills/.

Help a user understand this repository, decide which AI structure pieces they need, and adapt the template to their own project.

Covers Ignite UI for Blazor non-grid components: project setup and module registration; form controls (input, textarea, combo, select, date/time pickers, calendar, checkbox, radio, switch, slider, rating, mask input, color picker); layout and navigation…

Implements a Blazor view from a design image, screenshot, mockup, or wireframe using Ignite UI for Blazor components: analyzes the image, maps regions to components, generates a matching theme, builds the view with mock data, and refines it until it matches.…

Covers all Ignite UI for Blazor data grids (Grid Lite, Flat Grid, Tree Grid, Hierarchical Grid, Pivot Grid): setup, columns and templates, sorting, filtering, selection, cell and row editing, grouping, summaries, toolbar, Excel/CSV export, paging, remote and…

Covers theming and visual customization for Ignite UI for Blazor: choosing and switching the built-in Bootstrap, Material, Fluent and Indigo themes in light or dark, scoping a theme to part of the page with IgbThemeProvider, generating palettes and component…

All Ignite UI Angular UI components: application setup and architecture, form controls (Input Group, Combo, Select, Date/Time Pickers, Calendar, Checkbox, Radio, Switch, Slider, reactive forms), layout (Tabs, Bottom Navigation, Stepper, Accordion, Splitter,…

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…

Customize Ignite UI components styling using the igniteui-theming MCP server for AI-assisted theming. Use when users ask to theme or restyle Ignite UI components, change the color palette, switch between light and dark themes, apply or generate a global…

Build, launch, and drive this Blazor WASM examples app in a headless browser to verify demo pages end-to-end.

Covers non-grid Ignite UI for Blazor UI components: application setup, form controls (inputs, combos, selects, date/time pickers, calendar, checkbox, radio, switch, slider, rating), layout containers (tabs, stepper, accordion, expansion panel, navigation…

Provides guidance on all Ignite UI for Blazor data grid types (Grid Lite, Flat Grid, Tree Grid, Hierarchical Grid, Pivot Grid) including setup, column configuration, sorting, filtering, selection, editing, grouping, summaries, toolbar, export, paging, remote…

Covers all non-grid Ignite UI for Angular UI components: application scaffolding and setup, form controls (inputs, combos, selects, date/time pickers, calendar, checkbox, radio, switch, slider), layout containers (tabs, stepper, accordion, splitter,…

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…

Build framework-correct Ignite UI design output by combining documentation and theming MCP tools.