igniteui-angular 22.1.3 → 22.2.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (158) hide show
  1. package/README.md +2 -2
  2. package/combo/README.md +19 -0
  3. package/drop-down/README.md +40 -4
  4. package/fesm2022/igniteui-angular-accordion.mjs +7 -7
  5. package/fesm2022/igniteui-angular-action-strip.mjs +15 -12
  6. package/fesm2022/igniteui-angular-action-strip.mjs.map +1 -1
  7. package/fesm2022/igniteui-angular-avatar.mjs +7 -7
  8. package/fesm2022/igniteui-angular-badge.mjs +7 -7
  9. package/fesm2022/igniteui-angular-banner.mjs +15 -12
  10. package/fesm2022/igniteui-angular-banner.mjs.map +1 -1
  11. package/fesm2022/igniteui-angular-bottom-nav.mjs +22 -22
  12. package/fesm2022/igniteui-angular-button-group.mjs +12 -13
  13. package/fesm2022/igniteui-angular-button-group.mjs.map +1 -1
  14. package/fesm2022/igniteui-angular-calendar.mjs +73 -66
  15. package/fesm2022/igniteui-angular-calendar.mjs.map +1 -1
  16. package/fesm2022/igniteui-angular-card.mjs +31 -31
  17. package/fesm2022/igniteui-angular-carousel.mjs +27 -24
  18. package/fesm2022/igniteui-angular-carousel.mjs.map +1 -1
  19. package/fesm2022/igniteui-angular-chat-extras.mjs +6 -6
  20. package/fesm2022/igniteui-angular-chat.mjs +12 -12
  21. package/fesm2022/igniteui-angular-checkbox.mjs +7 -7
  22. package/fesm2022/igniteui-angular-chips.mjs +15 -12
  23. package/fesm2022/igniteui-angular-chips.mjs.map +1 -1
  24. package/fesm2022/igniteui-angular-combo.mjs +273 -122
  25. package/fesm2022/igniteui-angular-combo.mjs.map +1 -1
  26. package/fesm2022/igniteui-angular-core.mjs +188 -59
  27. package/fesm2022/igniteui-angular-core.mjs.map +1 -1
  28. package/fesm2022/igniteui-angular-date-picker.mjs +76 -82
  29. package/fesm2022/igniteui-angular-date-picker.mjs.map +1 -1
  30. package/fesm2022/igniteui-angular-dialog.mjs +13 -13
  31. package/fesm2022/igniteui-angular-directives.mjs +321 -457
  32. package/fesm2022/igniteui-angular-directives.mjs.map +1 -1
  33. package/fesm2022/igniteui-angular-drop-down.mjs +331 -104
  34. package/fesm2022/igniteui-angular-drop-down.mjs.map +1 -1
  35. package/fesm2022/igniteui-angular-expansion-panel.mjs +28 -28
  36. package/fesm2022/igniteui-angular-grids-core.mjs +556 -518
  37. package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
  38. package/fesm2022/igniteui-angular-grids-grid.mjs +91 -85
  39. package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
  40. package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs +59 -46
  41. package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs.map +1 -1
  42. package/fesm2022/igniteui-angular-grids-lite.mjs +12 -12
  43. package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +113 -86
  44. package/fesm2022/igniteui-angular-grids-pivot-grid.mjs.map +1 -1
  45. package/fesm2022/igniteui-angular-grids-tree-grid.mjs +57 -57
  46. package/fesm2022/igniteui-angular-grids-tree-grid.mjs.map +1 -1
  47. package/fesm2022/igniteui-angular-icon.mjs +10 -10
  48. package/fesm2022/igniteui-angular-input-group.mjs +52 -63
  49. package/fesm2022/igniteui-angular-input-group.mjs.map +1 -1
  50. package/fesm2022/igniteui-angular-list.mjs +45 -42
  51. package/fesm2022/igniteui-angular-list.mjs.map +1 -1
  52. package/fesm2022/igniteui-angular-navbar.mjs +13 -13
  53. package/fesm2022/igniteui-angular-navigation-drawer.mjs +16 -16
  54. package/fesm2022/igniteui-angular-paginator.mjs +24 -21
  55. package/fesm2022/igniteui-angular-paginator.mjs.map +1 -1
  56. package/fesm2022/igniteui-angular-progressbar.mjs +19 -19
  57. package/fesm2022/igniteui-angular-query-builder.mjs +44 -31
  58. package/fesm2022/igniteui-angular-query-builder.mjs.map +1 -1
  59. package/fesm2022/igniteui-angular-radio.mjs +59 -35
  60. package/fesm2022/igniteui-angular-radio.mjs.map +1 -1
  61. package/fesm2022/igniteui-angular-select.mjs +35 -43
  62. package/fesm2022/igniteui-angular-select.mjs.map +1 -1
  63. package/fesm2022/igniteui-angular-simple-combo.mjs +44 -33
  64. package/fesm2022/igniteui-angular-simple-combo.mjs.map +1 -1
  65. package/fesm2022/igniteui-angular-slider.mjs +28 -28
  66. package/fesm2022/igniteui-angular-snackbar.mjs +7 -7
  67. package/fesm2022/igniteui-angular-splitter.mjs +37 -27
  68. package/fesm2022/igniteui-angular-splitter.mjs.map +1 -1
  69. package/fesm2022/igniteui-angular-stepper.mjs +34 -34
  70. package/fesm2022/igniteui-angular-switch.mjs +7 -7
  71. package/fesm2022/igniteui-angular-tabs.mjs +34 -34
  72. package/fesm2022/igniteui-angular-time-picker.mjs +34 -40
  73. package/fesm2022/igniteui-angular-time-picker.mjs.map +1 -1
  74. package/fesm2022/igniteui-angular-toast.mjs +7 -7
  75. package/fesm2022/igniteui-angular-tree.mjs +33 -30
  76. package/fesm2022/igniteui-angular-tree.mjs.map +1 -1
  77. package/fesm2022/igniteui-angular-virtual-scroll.mjs +1257 -0
  78. package/fesm2022/igniteui-angular-virtual-scroll.mjs.map +1 -0
  79. package/fesm2022/igniteui-angular.mjs +1 -0
  80. package/fesm2022/igniteui-angular.mjs.map +1 -1
  81. package/input-group/README.md +2 -0
  82. package/lib/core/styles/components/scrollbar/scrollbar-component.scss +0 -2
  83. package/lib/core/styles/components/scrollbar/scrollbar-theme.scss +23 -51
  84. package/lib/grids/core/src/column-actions/themes/_derived.scss +3 -3
  85. package/lib/grids/core/src/filtering/excel-style/themes/_derived.scss +3 -3
  86. package/lib/grids/themes/_derived.scss +3 -3
  87. package/lib/query-builder/src/query-builder/themes/_derived.scss +3 -3
  88. package/migrations/migration-collection.json +10 -0
  89. package/migrations/update-22_2_0/changes/theme-changes.json +77 -0
  90. package/migrations/update-22_2_0/index.d.ts +3 -0
  91. package/migrations/update-22_2_0/index.js +18 -0
  92. package/migrations/update-22_2_0/index.spec.d.ts +1 -0
  93. package/migrations/update-22_2_0/index.spec.js +88 -0
  94. package/migrations/update-22_2_0_grid-summary-borders/changes/theme-changes.json +17 -0
  95. package/migrations/update-22_2_0_grid-summary-borders/index.d.ts +3 -0
  96. package/migrations/update-22_2_0_grid-summary-borders/index.js +64 -0
  97. package/migrations/update-22_2_0_grid-summary-borders/index.spec.d.ts +1 -0
  98. package/migrations/update-22_2_0_grid-summary-borders/index.spec.js +100 -0
  99. package/package.json +6 -2
  100. package/schematics/tsconfig.tsbuildinfo +1 -1
  101. package/simple-combo/README.md +3 -0
  102. package/skills/igniteui-angular-components/references/form-controls.md +58 -0
  103. package/styles/igniteui-angular-dark.css +1 -1
  104. package/styles/igniteui-angular.css +1 -1
  105. package/styles/igniteui-bootstrap-dark.css +1 -1
  106. package/styles/igniteui-bootstrap-light.css +1 -1
  107. package/styles/igniteui-dark-green.css +1 -1
  108. package/styles/igniteui-fluent-dark-excel.css +1 -1
  109. package/styles/igniteui-fluent-dark-word.css +1 -1
  110. package/styles/igniteui-fluent-dark.css +1 -1
  111. package/styles/igniteui-fluent-light-excel.css +1 -1
  112. package/styles/igniteui-fluent-light-word.css +1 -1
  113. package/styles/igniteui-fluent-light.css +1 -1
  114. package/styles/igniteui-indigo-dark.css +1 -1
  115. package/styles/igniteui-indigo-light.css +1 -1
  116. package/styles/maps/igniteui-angular-dark.css.map +1 -1
  117. package/styles/maps/igniteui-angular.css.map +1 -1
  118. package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
  119. package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
  120. package/styles/maps/igniteui-dark-green.css.map +1 -1
  121. package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
  122. package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
  123. package/styles/maps/igniteui-fluent-dark.css.map +1 -1
  124. package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
  125. package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
  126. package/styles/maps/igniteui-fluent-light.css.map +1 -1
  127. package/styles/maps/igniteui-indigo-dark.css.map +1 -1
  128. package/styles/maps/igniteui-indigo-light.css.map +1 -1
  129. package/types/igniteui-angular-action-strip.d.ts +1 -0
  130. package/types/igniteui-angular-banner.d.ts +1 -0
  131. package/types/igniteui-angular-calendar.d.ts +3 -1
  132. package/types/igniteui-angular-carousel.d.ts +1 -0
  133. package/types/igniteui-angular-chips.d.ts +1 -0
  134. package/types/igniteui-angular-combo.d.ts +56 -12
  135. package/types/igniteui-angular-core.d.ts +64 -11
  136. package/types/igniteui-angular-date-picker.d.ts +4 -4
  137. package/types/igniteui-angular-directives.d.ts +50 -164
  138. package/types/igniteui-angular-drop-down.d.ts +76 -4
  139. package/types/igniteui-angular-grids-core.d.ts +64 -28
  140. package/types/igniteui-angular-grids-grid.d.ts +4 -7
  141. package/types/igniteui-angular-grids-hierarchical-grid.d.ts +5 -4
  142. package/types/igniteui-angular-grids-pivot-grid.d.ts +11 -5
  143. package/types/igniteui-angular-grids-tree-grid.d.ts +1 -1
  144. package/types/igniteui-angular-icon.d.ts +1 -1
  145. package/types/igniteui-angular-input-group.d.ts +2 -2
  146. package/types/igniteui-angular-list.d.ts +1 -0
  147. package/types/igniteui-angular-paginator.d.ts +1 -0
  148. package/types/igniteui-angular-query-builder.d.ts +5 -1
  149. package/types/igniteui-angular-radio.d.ts +16 -1
  150. package/types/igniteui-angular-select.d.ts +1 -2
  151. package/types/igniteui-angular-simple-combo.d.ts +7 -0
  152. package/types/igniteui-angular-splitter.d.ts +6 -1
  153. package/types/igniteui-angular-stepper.d.ts +1 -1
  154. package/types/igniteui-angular-time-picker.d.ts +2 -2
  155. package/types/igniteui-angular-tree.d.ts +4 -3
  156. package/types/igniteui-angular-virtual-scroll.d.ts +408 -0
  157. package/types/igniteui-angular.d.ts +1 -0
  158. package/virtual-scroll/README.md +332 -0
@@ -1282,10 +1282,10 @@ class IgxIconService {
1282
1282
  }
1283
1283
  }
1284
1284
  }
1285
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1286
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconService, providedIn: "root" }); }
1285
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1286
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconService, providedIn: "root" }); }
1287
1287
  }
1288
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconService, decorators: [{
1288
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconService, decorators: [{
1289
1289
  type: Injectable,
1290
1290
  args: [{
1291
1291
  providedIn: "root",
@@ -1475,10 +1475,10 @@ class IgxIconComponent {
1475
1475
  }
1476
1476
  this.addIconClass(className);
1477
1477
  }
1478
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1479
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxIconComponent, isStandalone: true, selector: "igx-icon", inputs: { ariaHidden: "ariaHidden", family: "family", name: "name", active: ["active", "active", booleanAttribute] }, host: { properties: { "class": "this.elementClasses", "class.igx-icon--inactive": "this.getInactive", "attr.aria-hidden": "this.ariaHidden" } }, usesOnChanges: true, ngImport: i0, template: "<!-- This is only here for backwards compatibility in case -->\n<!-- ligatures are used and the name is provided as content -->\n@if (!iconRef.name) {\n <ng-content></ng-content>\n}\n\n@switch (iconRef.type) {\n @case (\"liga\") {{{ iconRef.name }}}\n\n @case (\"svg\") {\n <div [innerHTML]=\"getSvg\"></div>\n }\n}\n", styles: ["@scope(.igx-icon){:scope:is(igx-icon){display:inline-flex;width:1em;height:1em;font-size:var(--size);direction:inherit}:scope:is(igx-icon) div,:scope:is(igx-icon) svg{display:block;width:var(--ig-icon-size, inherit);height:var(--ig-icon-size, inherit);fill:currentColor}:scope:is(igx-icon)[igxPrefix].material-icons,:scope:is(igx-icon)[igxSuffix].material-icons{font-family:Material Icons,sans-serif}}@layer ig.base{.igx-icon{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));color:var(--color)}.igx-icon--inactive{color:var(--disabled-color);opacity:.54}.igx-icon--success{color:var(--ig-success-500)}.igx-icon--error{color:var(--ig-error-500)}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
1478
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1479
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxIconComponent, isStandalone: true, selector: "igx-icon", inputs: { ariaHidden: "ariaHidden", family: "family", name: "name", active: ["active", "active", booleanAttribute] }, host: { properties: { "class": "this.elementClasses", "class.igx-icon--inactive": "this.getInactive", "attr.aria-hidden": "this.ariaHidden" } }, usesOnChanges: true, ngImport: i0, template: "<!-- This is only here for backwards compatibility in case -->\n<!-- ligatures are used and the name is provided as content -->\n@if (!iconRef.name) {\n <ng-content></ng-content>\n}\n\n@switch (iconRef.type) {\n @case (\"liga\") {{{ iconRef.name }}}\n\n @case (\"svg\") {\n <div [innerHTML]=\"getSvg\"></div>\n }\n}\n", styles: ["@scope(.igx-icon){:scope:is(igx-icon){display:inline-flex;width:1em;height:1em;font-size:var(--size);direction:inherit}:scope:is(igx-icon) div,:scope:is(igx-icon) svg{display:block;width:var(--ig-icon-size, inherit);height:var(--ig-icon-size, inherit);fill:currentColor}:scope:is(igx-icon)[igxPrefix].material-icons,:scope:is(igx-icon)[igxSuffix].material-icons{font-family:Material Icons,sans-serif}}@layer ig.base{.igx-icon{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));color:var(--color)}.igx-icon--inactive{color:var(--disabled-color);opacity:.54}.igx-icon--success{color:var(--ig-success-500)}.igx-icon--error{color:var(--ig-error-500)}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
1480
1480
  }
1481
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconComponent, decorators: [{
1481
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconComponent, decorators: [{
1482
1482
  type: Component,
1483
1483
  args: [{ selector: "igx-icon", changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<!-- This is only here for backwards compatibility in case -->\n<!-- ligatures are used and the name is provided as content -->\n@if (!iconRef.name) {\n <ng-content></ng-content>\n}\n\n@switch (iconRef.type) {\n @case (\"liga\") {{{ iconRef.name }}}\n\n @case (\"svg\") {\n <div [innerHTML]=\"getSvg\"></div>\n }\n}\n", styles: ["@scope(.igx-icon){:scope:is(igx-icon){display:inline-flex;width:1em;height:1em;font-size:var(--size);direction:inherit}:scope:is(igx-icon) div,:scope:is(igx-icon) svg{display:block;width:var(--ig-icon-size, inherit);height:var(--ig-icon-size, inherit);fill:currentColor}:scope:is(igx-icon)[igxPrefix].material-icons,:scope:is(igx-icon)[igxSuffix].material-icons{font-family:Material Icons,sans-serif}}@layer ig.base{.igx-icon{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));color:var(--color)}.igx-icon--inactive{color:var(--disabled-color);opacity:.54}.igx-icon--success{color:var(--ig-success-500)}.igx-icon--error{color:var(--ig-error-500)}}\n"] }]
1484
1484
  }], ctorParameters: () => [], propDecorators: { elementClasses: [{
@@ -1507,11 +1507,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
1507
1507
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
1508
1508
  */
1509
1509
  class IgxIconModule {
1510
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
1511
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: IgxIconModule, imports: [IgxIconComponent], exports: [IgxIconComponent] }); }
1512
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconModule }); }
1510
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
1511
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxIconModule, imports: [IgxIconComponent], exports: [IgxIconComponent] }); }
1512
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconModule }); }
1513
1513
  }
1514
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxIconModule, decorators: [{
1514
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxIconModule, decorators: [{
1515
1515
  type: NgModule,
1516
1516
  args: [{
1517
1517
  exports: [IgxIconComponent],