22.0.1

What's Changed

• fix(hgrid): add and use lifecycle placeholder for grid connection eve… by @MayaKirova in #17230
• docs(changelog): update touch gesture instructions for Angular 22 and… by @mddragnev in #17350
• Back-merging a left-over fix by @ChronosSF in #17363
• fix(migrations): restore dynamic import helper as cjs by @damyanpetev in #17360

Full Changelog: 22.0.0...22.0.1

22.0.0

New Features

• Theming

  • Added derived themes for the Grid and related internal components. When a parent component theme is included, its internal controls now derive their tokens from the parent theme colors, keeping nested buttons, icons, inputs, dropdowns, checkboxes, scrollbars, chips, and other helper components visually aligned.

  • The derived themes are introduces for the following components:

    • Grid
    • Excel Filtering
    • Grid Toolbar
    • Paginator
    • Column Actions
    • Query Builder and Advanced Filtering Dialog

  • The derived themes are applied through the existing component theme mixins, so no additional mixin call is required. To style the whole IgxGrid, provide the $background, $foreground, and $accent-color properties to grid-theme() and include the generated theme with tokens(). The $foreground property is optional; when omitted, it is derived automatically as a contrast color for the background. Internal components inherit derived tokens from the parent component theme.

  You can also style each compound component inside the grid with its own theme by providing the same color properties. The generated tokens are scoped to that component and affect the nested controls inside it.

      $grid-theme: grid-theme(
          $schema: $schema,
          $background: #ffffff,
          $foreground: #1f2937,
          $accent-color: #0061a8
      );
  
      $excel-filtering-theme: excel-filtering-theme(
          $schema: $schema,
          $background: #ff2323,
          $accent-color: #21fc9a
      );
  
      $query-builder-theme: query-builder-theme(
          $schema: $schema,
          $background: #f235ff,
          $accent-color: #89a800
      );
  
      $grid-toolbar-theme: grid-toolbar-theme( ... );
  
      $paginator-theme: paginator-theme( ... );
  
      $column-actions-theme: column-actions-theme( ... );
  
      igx-grid {
          @include tokens($grid-theme);
      }
  
      igx-grid-excel-style-filtering,
      .igx-excel-filter__secondary {
          @include tokens($excel-filtering-theme);
      }
  
      igx-advanced-filtering-dialog {
          @include tokens($query-builder-theme);
      }
  
      ...

  • Added a dedicated excel-filtering-theme() for styling the Excel Style Filtering. Use it instead of the excel-filtering color properties from grid-theme().

Breaking Changes

• IgxInputGroupComponent, IgxSelectComponent, IgxDatePickerComponent, IgxDateRangePickerComponent, IgxTimePickerComponent
  • The default type has changed from line to box. The ng update migration automatically adds type="line" to existing instances that do not already have an explicit type binding to preserve their appearance.

General

• IgxSelectComponent
  • The default positioning strategy has changed from the internal overlap strategy to AutoPositionStrategy. The dropdown now opens below (or above, if there is not enough space) the input element, consistent with other connected components.
  • Added IgxSelectOverlapPositionStrategy - a new publicly exported strategy that preserves the previous behavior of aligning the selected item's text over the input text. To opt into the previous overlap behavior:

    this.select.overlaySettings = {
        positionStrategy: new IgxSelectOverlapPositionStrategy(this.select)
    };

22.0.0-rc.2

New Features

• Theming

  • Added derived themes for the Grid and related internal components. When a parent component theme is included, its internal controls now derive their tokens from the parent theme colors, keeping nested buttons, icons, inputs, dropdowns, checkboxes, scrollbars, chips, and other helper components visually aligned.

  • The derived themes are introduces for the following components:

    • Grid
    • Excel Filtering
    • Grid Toolbar
    • Paginator
    • Column Actions
    • Query Builder and Advanced Filtering Dialog

  • The derived themes are applied through the existing component theme mixins, so no additional mixin call is required. To style the whole IgxGrid, provide the $background, $foreground, and $accent-color properties to grid-theme() and include the generated theme with tokens(). The $foreground property is optional; when omitted, it is derived automatically as a contrast color for the background. Internal components inherit derived tokens from the parent component theme.

  You can also style each compound component inside the grid with its own theme by providing the same color properties. The generated tokens are scoped to that component and affect the nested controls inside it.

      $grid-theme: grid-theme(
          $schema: $schema,
          $background: #ffffff,
          $foreground: #1f2937,
          $accent-color: #0061a8
      );
  
      $excel-filtering-theme: excel-filtering-theme(
          $schema: $schema,
          $background: #ff2323,
          $accent-color: #21fc9a
      );
  
      $query-builder-theme: query-builder-theme(
          $schema: $schema,
          $background: #f235ff,
          $accent-color: #89a800
      );
  
      $grid-toolbar-theme: grid-toolbar-theme( ... );
  
      $paginator-theme: paginator-theme( ... );
  
      $column-actions-theme: column-actions-theme( ... );
  
      igx-grid {
          @include tokens($grid-theme);
      }
  
      igx-grid-excel-style-filtering,
      .igx-excel-filter__secondary {
          @include tokens($excel-filtering-theme);
      }
  
      igx-advanced-filtering-dialog {
          @include tokens($query-builder-theme);
      }
  
      ...

  • Added a dedicated excel-filtering-theme() for styling the Excel Style Filtering. Use it instead of the excel-filtering color properties from grid-theme().

Breaking Changes

• IgxInputGroupComponent, IgxSelectComponent, IgxDatePickerComponent, IgxDateRangePickerComponent, IgxTimePickerComponent
  • The default type has changed from line to box. The ng update migration automatically adds type="line" to existing instances that do not already have an explicit type binding to preserve their appearance.

General

• IgxSelectComponent
  • The default positioning strategy has changed from the internal overlap strategy to AutoPositionStrategy. The dropdown now opens below (or above, if there is not enough space) the input element, consistent with other connected components.
  • Added IgxSelectOverlapPositionStrategy - a new publicly exported strategy that preserves the previous behavior of aligning the selected item's text over the input text. To opt into the previous overlap behavior:

    this.select.overlaySettings = {
        positionStrategy: new IgxSelectOverlapPositionStrategy(this.select)
    };

22.0.0-beta.4

What's Changed

• feat(lint): making unused vars an error and fixing lint by @kdinev in #17316
• fix(elements): Ensure ForOF out of bound row gets deleted before moving to opposite side. by @dkamburov in #17334
• fix(elements): add csSuppress to PivotAggregation - master by @IMinchev64 in #17311
• feat(grid): update grid border-related styles by @didimmova in #17333

Full Changelog: 22.0.0-beta.3...22.0.0-beta.4

21.2.9

What's Changed

• fix(elements): Ensure ForOF out of bound row gets deleted before moving to opposite side. by @skrustev in #17199
• fix(elements): add csSuppress to PivotAggregation - 21.2.x by @IMinchev64 in #17312
• fix(*): add mustCoerceToInt to relevant props - 21.2.x by @IMinchev64 in #16625

Full Changelog: 21.2.8...21.2.9

22.0.0-beta.3

What's Changed

Full Changelog: 21.2.0...22.0.0-beta.3

21.2.8

What's Changed

• fix(combo): address NG0100 in zoneless apps - 21.2.x by @ddaribo in #17315
• fix(hierarchical-grid): hide child row editing overlay on scroll - 21.2.x by @georgianastasov in #17303
• fix(grid): preserve refs and return new array to reflect changes by @IvanKitanov17 in #17320

Full Changelog: 21.2.7...21.2.8

22.0.0-beta.2

Full Changelog: 22.0.0-beta.1...22.0.0-beta.2

22.0.0-beta.1

What's Changed

• feat(skills): updating all skills with igniteui-cli mcp refs by @kdinev in #17235
• fix(badge): update sample to match the right way to use of the badge… by @Marina-L-Stoyanova in #17237
• fix(skills): removing references to next from the CLI MCP setup by @kdinev in #17245
• docs(skills): add refs to the igniteui-angular-generate-from-image-design skill by @georgianastasov in #17213
• docs(skills): Replace ng-deep with tokens in generate-from-image-design skill by @georgianastasov in #17228
• fix(date-range-picker): prevent mutating passed date range values - master by @georgianastasov in #17231
• Fix ARIA grid structure violations for WCAG 1.3.1 compliance by @Copilot in #16823
• fix(button-group): fix button group colors in selected state by @didimmova in #17267
• fix(grid): wrap theme-builder selectors in where pseudo selector by @didimmova in #17240
• fix(combo,select): reset to INITIAL state on control.disable() when touched/dirty by @simeonoff in #17262
• fix(igxGrid): Hide overlays on scroll + special handling for row edit by @MayaKirova in #17243
• fix(pivot-grid): align IPivotAggregator aggregator type with PivotAggregation by @Hristo313 in #17271
• fix(grid-lite): column field NoInfer to avoid fallback type compat issue by @damyanpetev in #17249
• Revert "Revert "fix(api-docs): export chat and grid lite"" by @MayaKirova in #17284
• fix(skills): removed misleading listing of bar as category chart type by @ivanvpetrov in #17261
• refactor(input-group): add styling support for more input types by @simeonoff in #17270
• fix(skills): correct references in skills by @onlyexeption in #17294
• Update milestone due date and rename AI Copilot to Agent by @radomirchev in #17296
• fix(date-picker): fix discrepencies in datepicker by @didimmova in #17282
• fix(date-picker): update indigo elevations by @didimmova in #17288
• fix(pivot): Fix infinite ResizeObserver loop in Pivot Grid when horizontal layout by @mddragnev in #17289
• fix(igxGrid): In case zone is already stable emit detect and emit chu… by @MayaKirova in #17268
• feat(grid-migration): add migration guide from Grid Lite to Premium D… by @Marina-L-Stoyanova in #17304
• fix(date-picker): invoke markForCheck() on overlay open/close to prevent NG0100 in zoneless apps by @ddaribo in #17306
• fix(hierarchical-grid): align selected data with expanded row indexes - master by @georgianastasov in #17299
• feat(themes): add derived themes for inner components by @didimmova in #17257
• fix(combo): address NG0100 in zoneless apps by @ddaribo in #17314

Full Changelog: 21.2.0...22.0.0-beta.1

22.0.0-beta.0

What's Changed

• feat(skills): updating all skills with igniteui-cli mcp refs by @kdinev in #17235
• fix(badge): update sample to match the right way to use of the badge… by @Marina-L-Stoyanova in #17237
• fix(skills): removing references to next from the CLI MCP setup by @kdinev in #17245
• docs(skills): add refs to the igniteui-angular-generate-from-image-design skill by @georgianastasov in #17213
• docs(skills): Replace ng-deep with tokens in generate-from-image-design skill by @georgianastasov in #17228
• fix(date-range-picker): prevent mutating passed date range values - master by @georgianastasov in #17231
• Fix ARIA grid structure violations for WCAG 1.3.1 compliance by @Copilot in #16823
• fix(button-group): fix button group colors in selected state by @didimmova in #17267
• fix(grid): wrap theme-builder selectors in where pseudo selector by @didimmova in #17240
• fix(combo,select): reset to INITIAL state on control.disable() when touched/dirty by @simeonoff in #17262
• fix(igxGrid): Hide overlays on scroll + special handling for row edit by @MayaKirova in #17243
• fix(pivot-grid): align IPivotAggregator aggregator type with PivotAggregation by @Hristo313 in #17271
• fix(grid-lite): column field NoInfer to avoid fallback type compat issue by @damyanpetev in #17249
• Revert "Revert "fix(api-docs): export chat and grid lite"" by @MayaKirova in #17284
• fix(skills): removed misleading listing of bar as category chart type by @ivanvpetrov in #17261
• refactor(input-group): add styling support for more input types by @simeonoff in #17270
• fix(skills): correct references in skills by @onlyexeption in #17294
• Update milestone due date and rename AI Copilot to Agent by @radomirchev in #17296
• fix(date-picker): fix discrepencies in datepicker by @didimmova in #17282
• fix(date-picker): update indigo elevations by @didimmova in #17288
• fix(pivot): Fix infinite ResizeObserver loop in Pivot Grid when horizontal layout by @mddragnev in #17289
• fix(igxGrid): In case zone is already stable emit detect and emit chu… by @MayaKirova in #17268
• feat(grid-migration): add migration guide from Grid Lite to Premium D… by @Marina-L-Stoyanova in #17304
• fix(date-picker): invoke markForCheck() on overlay open/close to prevent NG0100 in zoneless apps by @ddaribo in #17306
• fix(hierarchical-grid): align selected data with expanded row indexes - master by @georgianastasov in #17299
• feat(themes): add derived themes for inner components by @didimmova in #17257
• fix(combo): address NG0100 in zoneless apps by @ddaribo in #17314

Full Changelog: 21.2.0...22.0.0-beta.0