igniteui-angular 22.0.0-beta.1 → 22.0.0-beta.3

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 (39) hide show
  1. package/fesm2022/igniteui-angular-grids-core.mjs +60 -5
  2. package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
  3. package/fesm2022/igniteui-angular-grids-grid.mjs +2 -0
  4. package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
  5. package/lib/core/styles/components/column-actions/_column-actions-derived-themes.scss +3 -3
  6. package/lib/core/styles/components/grid/_excel-filtering-derived-themes.scss +4 -4
  7. package/lib/core/styles/components/grid/_grid-derived-themes.scss +8 -8
  8. package/lib/core/styles/components/grid/_grid-theme.scss +3 -3
  9. package/lib/core/styles/components/grid-toolbar/_grid-toolbar-derived-themes.scss +3 -3
  10. package/lib/core/styles/components/paginator/_paginator-derived-themes.scss +3 -3
  11. package/lib/core/styles/components/query-builder/_query-builder-derived-themes.scss +3 -3
  12. package/package.json +6 -6
  13. package/styles/igniteui-angular-dark.css +1 -1
  14. package/styles/igniteui-angular.css +1 -1
  15. package/styles/igniteui-bootstrap-dark.css +1 -1
  16. package/styles/igniteui-bootstrap-light.css +1 -1
  17. package/styles/igniteui-dark-green.css +1 -1
  18. package/styles/igniteui-fluent-dark-excel.css +1 -1
  19. package/styles/igniteui-fluent-dark-word.css +1 -1
  20. package/styles/igniteui-fluent-dark.css +1 -1
  21. package/styles/igniteui-fluent-light-excel.css +1 -1
  22. package/styles/igniteui-fluent-light-word.css +1 -1
  23. package/styles/igniteui-fluent-light.css +1 -1
  24. package/styles/igniteui-indigo-dark.css +1 -1
  25. package/styles/igniteui-indigo-light.css +1 -1
  26. package/styles/maps/igniteui-angular-dark.css.map +1 -1
  27. package/styles/maps/igniteui-angular.css.map +1 -1
  28. package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
  29. package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
  30. package/styles/maps/igniteui-dark-green.css.map +1 -1
  31. package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
  32. package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
  33. package/styles/maps/igniteui-fluent-dark.css.map +1 -1
  34. package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
  35. package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
  36. package/styles/maps/igniteui-fluent-light.css.map +1 -1
  37. package/styles/maps/igniteui-indigo-dark.css.map +1 -1
  38. package/styles/maps/igniteui-indigo-light.css.map +1 -1
  39. package/types/igniteui-angular-grids-core.d.ts +3 -0
@@ -8,9 +8,9 @@
8
8
  $schema: map.get($theme-info, 'schema');
9
9
 
10
10
  :where(igx-column-actions) {
11
- --_column-actions-background: var(--background, var(--ig-column-actions-background));
12
- --_column-actions-foreground: var(--foreground, var(--ig-column-actions-foreground));
13
- --_column-actions-accent-color: var(--accent-color, var(--ig-column-actions-accent-color));
11
+ --_column-actions-background: var(--ig-column-actions-background);
12
+ --_column-actions-foreground: var(--ig-column-actions-foreground);
13
+ --_column-actions-accent-color: var(--ig-column-actions-accent-color);
14
14
 
15
15
  @include tokens(
16
16
  checkbox-theme(
@@ -15,10 +15,10 @@
15
15
  igx-grid-excel-style-filtering,
16
16
  .igx-excel-filter__secondary
17
17
  ) {
18
- --_excel-filtering-background: var(--background, var(--ig-excel-filtering-background));
19
- --_excel-filtering-secondary-background: var(--secondary-background, var(--ig-excel-filtering-secondary-background));
20
- --_excel-filtering-foreground: var(--foreground, var(--ig-excel-filtering-foreground));
21
- --_excel-filtering-accent-color: var(--accent-color, var(--ig-excel-filtering-accent-color));
18
+ --_excel-filtering-background: var(--ig-excel-filtering-background);
19
+ --_excel-filtering-secondary-background: var(--ig-excel-filtering-secondary-background);
20
+ --_excel-filtering-foreground: var(--ig-excel-filtering-foreground);
21
+ --_excel-filtering-accent-color: var(--ig-excel-filtering-accent-color);
22
22
 
23
23
  .igx-excel-filter__menu .igx-button-group,
24
24
  .igx-button-group {
@@ -19,9 +19,9 @@
19
19
  igc-pivot-grid,
20
20
  igx-grid-lite,
21
21
  igc-grid-lite) {
22
- --_grid-background: var(--background, var(--ig-grid-background));
23
- --_grid-foreground: var(--foreground, var(--ig-grid-foreground));
24
- --_grid-accent-color: var(--accent-color, var(--ig-grid-accent-color));
22
+ --_grid-background: var(--ig-grid-background);
23
+ --_grid-foreground: var(--ig-grid-foreground);
24
+ --_grid-accent-color: var(--ig-grid-accent-color);
25
25
 
26
26
  @include tokens(
27
27
  action-strip-theme(
@@ -73,12 +73,12 @@
73
73
  @include tokens(
74
74
  checkbox-theme(
75
75
  $schema: $schema,
76
- $empty-color: var(--header-text-color),
77
- $empty-fill-color: var(--header-background),
78
- $tick-color-hover: color-mix(in srgb, var(--header-text-color) 40%, var(--header-background)),
76
+ $empty-color: var(--ig-grid-header-text-color),
77
+ $empty-fill-color: var(--ig-grid-header-background),
78
+ $tick-color-hover: color-mix(in srgb, var(--ig-grid-header-text-color) 40%, var(--ig-grid-header-background)),
79
79
  $fill-color: var(--_grid-accent-color),
80
- $label-color: var(--header-text-color),
81
- $disabled-color: color-mix(in srgb, var(--header-text-color) 50%, var(--header-background)),
80
+ $label-color: var(--ig-grid-header-text-color),
81
+ $disabled-color: color-mix(in srgb, var(--ig-grid-header-text-color) 50%, var(--ig-grid-header-background)),
82
82
  )
83
83
  );
84
84
  }
@@ -1506,7 +1506,7 @@
1506
1506
  min-height: var(--header-size);
1507
1507
  outline-style: none;
1508
1508
  overflow: hidden;
1509
- transition: color 250ms ease-in-out;
1509
+ transition: color 120ms $ease-in-out-cubic;
1510
1510
  }
1511
1511
 
1512
1512
  %grid-cell-header--filtering {
@@ -1530,7 +1530,7 @@
1530
1530
  flex-grow: 1; /* hey IE, the text should take most of the space */
1531
1531
  // align-self: flex-end; /* commenting out for now on external request */
1532
1532
  line-height: var(--header-size);
1533
- transition: color 250ms ease-in-out;
1533
+ transition: color 120ms $ease-in-out-cubic;
1534
1534
  }
1535
1535
 
1536
1536
  %grid-cell-header-icons {
@@ -1748,7 +1748,7 @@
1748
1748
  %grid-excel-icon--filtered,
1749
1749
  %grid-excel-icon,
1750
1750
  .sort-icon {
1751
- transition: all 250ms ease-in-out;
1751
+ transition: all 120ms $ease-in-out-cubic;
1752
1752
  }
1753
1753
 
1754
1754
  %grid-cell-number {
@@ -11,9 +11,9 @@
11
11
  $schema: map.get($theme-info, 'schema');
12
12
 
13
13
  :where(igx-grid-toolbar) {
14
- --_grid-toolbar-background: var(--background, var(--ig-grid-toolbar-background));
15
- --_grid-toolbar-foreground: var(--foreground, var(--ig-grid-toolbar-foreground));
16
- --_grid-toolbar-accent-color: var(--accent-color, var(--ig-grid-toolbar-accent-color));
14
+ --_grid-toolbar-background: var(--ig-grid-toolbar-background);
15
+ --_grid-toolbar-foreground: var(--ig-grid-toolbar-foreground);
16
+ --_grid-toolbar-accent-color: var(--ig-grid-toolbar-accent-color);
17
17
 
18
18
  @include tokens(
19
19
  column-actions-theme(
@@ -12,9 +12,9 @@
12
12
  $variant: map.get($theme-info, 'variant');
13
13
 
14
14
  :where(igx-paginator) {
15
- --_paginator-background: var(--background, var(--ig-paginator-background));
16
- --_paginator-foreground: var(--foreground, var(--ig-paginator-foreground));
17
- --_paginator-accent-color: var(--accent-color, var(--ig-paginator-accent-color));
15
+ --_paginator-background: var(--ig-paginator-background);
16
+ --_paginator-foreground: var(--ig-paginator-foreground);
17
+ --_paginator-accent-color: var(--ig-paginator-accent-color);
18
18
 
19
19
  @include tokens(
20
20
  drop-down-theme(
@@ -13,9 +13,9 @@
13
13
  @include tokens($theme, $mode: 'scoped', $scope: 'igx-advanced-filtering-dialog');
14
14
 
15
15
  :where(igx-query-builder, igx-advanced-filtering-dialog) {
16
- --_query-builder-background: var(--background, var(--ig-query-builder-background));
17
- --_query-builder-foreground: var(--foreground, var(--ig-query-builder-foreground));
18
- --_query-builder-accent-color: var(--accent-color, var(--ig-query-builder-accent-color));
16
+ --_query-builder-background: var(--ig-query-builder-background);
17
+ --_query-builder-foreground: var(--ig-query-builder-foreground);
18
+ --_query-builder-accent-color: var(--ig-query-builder-accent-color);
19
19
 
20
20
  @include tokens(
21
21
  checkbox-theme(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "igniteui-angular",
3
- "version": "22.0.0-beta.1",
3
+ "version": "22.0.0-beta.3",
4
4
  "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
5
5
  "author": "Infragistics",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -75,15 +75,15 @@
75
75
  "igniteui-trial-watermark": "^3.1.0",
76
76
  "jspdf": "^4.2.1",
77
77
  "lodash-es": "^4.17.21",
78
- "igniteui-theming": "^27.0.0",
78
+ "igniteui-theming": "^27.2.0",
79
79
  "igniteui-i18n-core": "^1.0.5",
80
80
  "@igniteui/material-icons-extended": "^3.1.0"
81
81
  },
82
82
  "peerDependencies": {
83
- "@angular/common": "21",
84
- "@angular/core": "21",
85
- "@angular/animations": "21",
86
- "@angular/forms": "21",
83
+ "@angular/common": "22",
84
+ "@angular/core": "22",
85
+ "@angular/animations": "22",
86
+ "@angular/forms": "22",
87
87
  "hammerjs": "^2.0.8",
88
88
  "@types/hammerjs": "^2.0.46",
89
89
  "igniteui-webcomponents": "^7.2.1",