Skip to content

Commit 45f622b

Browse files
authored
Merge branch '8.2.x' into fix-#6053-8.2.x
2 parents 4aee533 + 788ce62 commit 45f622b

File tree

19 files changed

+283
-154
lines changed

19 files changed

+283
-154
lines changed

projects/igniteui-angular/migrations/migration-collection.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,11 @@
5555
"version": "8.2.3",
5656
"description": "Updates Ignite UI for Angular from v8.2.0 to v8.2.3",
5757
"factory": "./update-8_2_3"
58+
},
59+
"migration-12": {
60+
"version": "8.2.6",
61+
"description": "Updates Ignite UI for Angular from v8.2.3 to v8.2.6",
62+
"factory": "./update-8_2_6"
5863
}
5964
}
6065
}
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"$schema": "../../common/schema/theme-props.schema.json",
3+
"changes": [
4+
{
5+
"name": "$button-background",
6+
"remove": true,
7+
"owner": "igx-grid-toolbar-theme"
8+
},
9+
{
10+
"name": "$button-text-color",
11+
"remove": true,
12+
"owner": "igx-grid-toolbar-theme"
13+
},
14+
{
15+
"name": "$button-hover-background",
16+
"remove": true,
17+
"owner": "igx-grid-toolbar-theme"
18+
},
19+
{
20+
"name": "$button-hover-text-color",
21+
"remove": true,
22+
"owner": "igx-grid-toolbar-theme"
23+
},
24+
{
25+
"name": "$button-focus-background",
26+
"remove": true,
27+
"owner": "igx-grid-toolbar-theme"
28+
},
29+
{
30+
"name": "$button-focus-text-color",
31+
"remove": true,
32+
"owner": "igx-grid-toolbar-theme"
33+
}
34+
]
35+
}
Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
import * as path from 'path';
2+
3+
// tslint:disable:no-implicit-dependencies
4+
import { EmptyTree } from '@angular-devkit/schematics';
5+
// tslint:disable-next-line:no-submodule-imports
6+
import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/testing';
7+
8+
describe('Update 8.2.6', () => {
9+
let appTree: UnitTestTree;
10+
const schematicRunner = new SchematicTestRunner('ig-migrate', path.join(__dirname, '../migration-collection.json'));
11+
const configJson = {
12+
defaultProject: 'testProj',
13+
projects: {
14+
testProj: {
15+
sourceRoot: '/testSrc'
16+
}
17+
},
18+
schematics: {
19+
'@schematics/angular:component': {
20+
prefix: 'appPrefix'
21+
}
22+
}
23+
};
24+
25+
beforeEach(() => {
26+
appTree = new UnitTestTree(new EmptyTree());
27+
appTree.create('/angular.json', JSON.stringify(configJson));
28+
});
29+
30+
it('should update igx-carousel-theme prop', done => {
31+
appTree.create(
32+
'/testSrc/appPrefix/component/test.component.scss',
33+
`$my-toolbar-theme: igx-grid-toolbar-theme(
34+
$background-color: null,
35+
$button-background: null,
36+
$title-text-color: null,
37+
$button-text-color: null,
38+
$button-hover-background: null,
39+
$button-hover-text-color: null,
40+
$button-focus-background: null,
41+
$button-focus-text-color: null,
42+
$dropdown-background: null,
43+
$item-text-color: null,
44+
$item-hover-background: null,
45+
$item-hover-text-color: null,
46+
$item-focus-background: null,
47+
$item-focus-text-color: null
48+
);`
49+
);
50+
const tree = schematicRunner.runSchematic('migration-12', {}, appTree);
51+
expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss'))
52+
.toEqual(
53+
`$my-toolbar-theme: igx-grid-toolbar-theme(
54+
$background-color: null,
55+
$title-text-color: null,
56+
$dropdown-background: null,
57+
$item-text-color: null,
58+
$item-hover-background: null,
59+
$item-hover-text-color: null,
60+
$item-focus-background: null,
61+
$item-focus-text-color: null
62+
);`
63+
);
64+
done();
65+
});
66+
67+
it('should update igx-grid-paginator-theme', done => {
68+
appTree.create(
69+
'/testSrc/appPrefix/component/test.component.scss',
70+
`$dark-grid-paginator: igx-grid-paginator-theme($color: black);
71+
@include igx-grid-paginator($dark-grid-paginator);
72+
.igx-grid-paginator__pager {
73+
@include igx-button($dark-button);
74+
}
75+
$dark-grid-paginator-schema: extend($_dark-grid-pagination,());`
76+
);
77+
const tree = schematicRunner.runSchematic('migration-12', {}, appTree);
78+
expect(tree.readContent('/testSrc/appPrefix/component/test.component.scss'))
79+
.toEqual(
80+
`$dark-grid-paginator: igx-paginator-theme($color: black);
81+
@include igx-paginator($dark-grid-paginator);
82+
.igx-grid-paginator__pager {
83+
@include igx-button($dark-button);
84+
}
85+
$dark-grid-paginator-schema: extend($_dark-pagination,());`
86+
);
87+
done();
88+
});
89+
});
Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import {
2+
Rule,
3+
SchematicContext,
4+
Tree
5+
} from '@angular-devkit/schematics';
6+
import { getProjects, getWorkspace } from '../common/util';
7+
import { UpdateChanges } from '../common/UpdateChanges';
8+
9+
const version = '8.2.6';
10+
11+
export default function(): Rule {
12+
return (host: Tree, context: SchematicContext) => {
13+
const themes = ['$_base-dark-grid-pagination',
14+
'$_dark-grid-pagination',
15+
'$_dark-fluent-grid-pagination',
16+
'$_light-grid-pagination',
17+
'$_fluent-grid-pagination',
18+
'$_round-shape-grid-pagination',
19+
'$_default-shape-grid-pagination',
20+
'$_square-shape-grid-pagination'];
21+
22+
const newThemes = ['$_base-dark-pagination',
23+
'$_dark-pagination',
24+
'$_dark-fluent-pagination',
25+
'$_light-pagination',
26+
'$_fluent-pagination',
27+
'$_round-shape-pagination',
28+
'$_default-shape-pagination',
29+
'$_square-shape-pagination'];
30+
31+
let globalStyleExt: string;
32+
const config = getWorkspace(host);
33+
const projects = getProjects(config);
34+
35+
context.logger.info(`Applying migration for Ignite UI for Angular to version ${version}`);
36+
37+
if (config.schematics && config.schematics['@schematics/angular:component']) {
38+
// updated projects have global prefix rather than per-project:
39+
globalStyleExt = config.schematics['@schematics/angular:component'].styleext;
40+
}
41+
42+
for (const proj of projects) {
43+
const dir = host.getDir(proj.sourceRoot);
44+
let ext = globalStyleExt || 'scss';
45+
if (proj.schematics && proj.schematics['@schematics/angular:component']) {
46+
ext = proj.schematics['@schematics/angular:component'].styleext || ext;
47+
}
48+
dir.visit((path, entry) => {
49+
if (path.endsWith('.' + ext)) {
50+
let content = entry.content.toString();
51+
if (content.match(/\bigx-grid-paginator\b/g)) {
52+
content = content.replace(/\bigx-grid-paginator\b/g, 'igx-paginator');
53+
}
54+
themes.forEach((n, i) => {
55+
if (content.indexOf(n) !== -1) {
56+
content = content.split(n).join(newThemes[i]);
57+
}
58+
});
59+
host.overwrite(path, content);
60+
}
61+
});
62+
}
63+
64+
const update = new UpdateChanges(__dirname, host, context);
65+
update.applyChanges();
66+
};
67+
}

projects/igniteui-angular/src/lib/core/styles/components/grid-toolbar/_grid-toolbar-theme.scss

Lines changed: 8 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,6 @@
1010
///
1111
/// @param {Color} $background-color [null] - The toolbar background color.
1212
/// @param {Color} $title-text-color [null] - The toolbar title text color.
13-
/// @param {Color} $button-background [null] - The toolbar button background color.
14-
/// @param {Color} $button-text-color [null] - The toolbar button text color.
15-
/// @param {Color} $button-hover-background [null] - The toolbar button hover background color.
16-
/// @param {Color} $button-hover-text-color [null] - The toolbar button hover text color.
17-
/// @param {Color} $button-focus-background [null] - The toolbar button focus background color.
18-
/// @param {Color} $button-focus-text-color [null] - The toolbar button focus text color.
1913
/// @param {Color} $dropdown-background [null] - The toolbar drop-down background color.
2014
/// @param {Color} $item-text-color [null] - The toolbar drop-down item text color.
2115
/// @param {Color} $item-hover-background [null] - The toolbar drop-down item hover background color.
@@ -41,15 +35,8 @@
4135
$schema: $light-schema,
4236
4337
$background-color: null,
44-
$button-background: null,
4538
$title-text-color: null,
4639
47-
$button-text-color: null,
48-
$button-hover-background: null,
49-
$button-hover-text-color: null,
50-
$button-focus-background: null,
51-
$button-focus-text-color: null,
52-
5340
$dropdown-background: null,
5441
$item-text-color: null,
5542
$item-hover-background: null,
@@ -92,44 +79,13 @@
9279
$item-focus-text-color: text-contrast($item-focus-background);
9380
}
9481

95-
@if not($button-hover-background) and $background-color {
96-
$button-hover-text-color: text-contrast($background-color);
97-
98-
@if type-of($background-color) == 'color' {
99-
$button-hover-background: rgba(text-contrast($background-color), .2);
100-
}
101-
}
102-
103-
@if not($button-focus-background) and $background-color {
104-
$button-focus-text-color: text-contrast($background-color);
105-
106-
@if type-of($background-color) == 'color' {
107-
$button-focus-background: rgba(text-contrast($background-color), .2);
108-
}
109-
}
110-
111-
@if not($button-background) and $background-color {
112-
$button-text-color: text-contrast($background-color);
113-
114-
@if type-of($background-color) == 'color' {
115-
$button-background: rgba(text-contrast($background-color), .1);
116-
}
117-
}
118-
11982
@return extend($theme, (
12083
name: $name,
12184
palette: $palette,
12285

12386
background-color: $background-color,
124-
button-background: $button-background,
12587
title-text-color: $title-text-color,
12688

127-
button-text-color: $button-text-color,
128-
button-hover-background: $button-hover-background,
129-
button-hover-text-color: $button-hover-text-color,
130-
button-focus-background: $button-focus-background,
131-
button-focus-text-color: $button-focus-text-color,
132-
13389
item-text-color: $item-text-color,
13490
dropdown-background: $dropdown-background,
13591
item-hover-background: $item-hover-background,
@@ -191,39 +147,11 @@
191147
padding: map-get($grid-toolbar-padding-rtl, 'comfortable');
192148
}
193149

194-
%igx-button--flat {
195-
background: --var($theme, 'button-background');
196-
color: --var($theme, 'button-text-color');
197-
margin-#{$left}: rem(8);
198-
199-
&:hover {
200-
background: --var($theme, 'button-hover-background');
201-
color: --var($theme, 'button-hover-text-color');
202-
}
203-
204-
&:focus,
205-
&:active {
206-
background: --var($theme, 'button-focus-background');
207-
color: --var($theme, 'button-focus-text-color');
208-
}
209-
}
210-
211-
%igx-button--icon {
212-
background: --var($theme, 'button-background');
213-
color: --var($theme, 'button-text-color');
150+
%igx-button--outlined,
151+
%igx-button--raised,
152+
%igx-button--flat,
153+
%igx-button--icon{
214154
margin-#{$left}: rem(8);
215-
border-radius: 0;
216-
217-
&:hover {
218-
background: --var($theme, 'button-hover-background');
219-
color: --var($theme, 'button-hover-text-color');
220-
}
221-
222-
&:focus,
223-
&:active {
224-
background: --var($theme, 'button-focus-background');
225-
color: --var($theme, 'button-focus-text-color');
226-
}
227155
}
228156

229157
%igx-grid-toolbar__button-space {
@@ -249,8 +177,10 @@
249177
&[dir='rtl'] {
250178
text-align: #{$right};
251179

180+
%igx-button--outlined,
181+
%igx-button--raised,
252182
%igx-button--flat,
253-
%igx-button--icon {
183+
%igx-button--icon{
254184
margin-#{$left}: 0;
255185
margin-#{$right}: rem(8);
256186
}
@@ -321,7 +251,7 @@
321251
}
322252

323253
%igx-grid-toolbar__adv-filter--filtered {
324-
color: igx-color(map-get($theme, 'palette'), 'secondary') !important;
254+
border-color: igx-color(map-get($theme, 'palette'), 'secondary') !important;
325255
}
326256

327257
%igx-grid-toolbar__dropdown {

projects/igniteui-angular/src/lib/core/styles/components/progress/_progress-component.scss

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,6 @@
115115

116116
@include e(text, $m: hidden) {
117117
@extend %circular-text !optional;
118-
@extend %circular-text--hidden !optional;
119118
}
120119

121120
@include m(indeterminate) {
@@ -124,9 +123,5 @@
124123
@include e(outer) {
125124
@extend %circular-outer--indeterminate !optional;
126125
}
127-
128-
@include e(text) {
129-
@extend %circular-text--hidden !optional;
130-
}
131126
}
132127
}

projects/igniteui-angular/src/lib/core/styles/components/progress/_progress-theme.scss

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -311,10 +311,6 @@
311311
fill: --var($theme, 'text-color');
312312
}
313313

314-
%circular-text--hidden {
315-
visibility: hidden;
316-
}
317-
318314
@include keyframes('indeterminate-accordion') {
319315
from {
320316
stroke-dashoffset: 578;

0 commit comments

Comments
 (0)