Skip to content

Commit 08c1890

Browse files
authored
Merge branch 'master' into mpopov/pane-bg-color
2 parents 736a63b + 753718e commit 08c1890

File tree

7 files changed

+101
-52
lines changed

7 files changed

+101
-52
lines changed

projects/igniteui-angular/migrations/common/UpdateChanges.ts

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -42,8 +42,8 @@ export class UpdateChanges {
4242
// and no actual angular metadata will be resolved for the rest of the migration
4343
const wsProject = this.workspace.projects[this.workspace.defaultProject] || this.workspace.projects[0];
4444
const mainRelPath = wsProject.architect?.build?.options['main'] ?
45-
path.join(wsProject.root, wsProject.architect?.build?.options['main']) :
46-
`src/main.ts`;
45+
path.join(wsProject.root, wsProject.architect?.build?.options['main']) :
46+
`src/main.ts`;
4747
// patch TSConfig so it includes angularOptions.strictTemplates
4848
// ivy ls requires this in order to function properly on templates
4949
this.patchTsConfig();
@@ -491,9 +491,8 @@ export class UpdateChanges {
491491
// use the absolute path for ALL LS operations
492492
// do not overwrite the entryPath, as Tree operations require relative paths
493493
const changes = new Set<{ change; position }>();
494-
let langServ;
494+
let langServ: tss.LanguageService;
495495
for (const change of memberChanges.changes) {
496-
497496
if (!content.includes(change.member)) {
498497
continue;
499498
}
@@ -532,7 +531,7 @@ export class UpdateChanges {
532531
originalContent = this.serverHost.readFile(this.tsconfigPath);
533532
} catch {
534533
this.context?.logger
535-
.warn(`Could not read ${this.tsconfigPath}. Some Angular Ivy features might be unavailable during migrations.`);
534+
.warn(`Could not read ${this.tsconfigPath}. Some Angular Ivy features might be unavailable during migrations.`);
536535
return;
537536
}
538537
let content;
@@ -542,17 +541,17 @@ export class UpdateChanges {
542541
content = result.config;
543542
} else {
544543
this.context?.logger
545-
.warn(`Could not parse ${this.tsconfigPath}. Angular Ivy language service might be unavailable during migrations.`);
544+
.warn(`Could not parse ${this.tsconfigPath}. Angular Ivy language service might be unavailable during migrations.`);
546545
this.context?.logger
547-
.warn(`Error:\n${result.error}`);
546+
.warn(`Error:\n${result.error}`);
548547
return;
549548
}
550549
if (!content.angularCompilerOptions) {
551550
content.angularCompilerOptions = {};
552551
}
553552
if (!content.angularCompilerOptions.strictTemplates) {
554553
this.context?.logger
555-
.info(`Adding 'angularCompilerOptions.strictTemplates' to ${this.tsconfigPath} for migration run.`);
554+
.info(`Adding 'angularCompilerOptions.strictTemplates' to ${this.tsconfigPath} for migration run.`);
556555
content.angularCompilerOptions.strictTemplates = true;
557556
this.host.overwrite(this.tsconfigPath, JSON.stringify(content));
558557
// store initial state and restore it once migrations are finished

projects/igniteui-angular/migrations/common/tsUtils.ts

Lines changed: 71 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,17 @@ export const NG_CORE_PACKAGE_NAME = '@angular/core';
1212
export const CUSTOM_TS_PLUGIN_PATH = './tsPlugin';
1313
export const CUSTOM_TS_PLUGIN_NAME = 'igx-ts-plugin';
1414

15-
enum SynaxTokens {
15+
enum SyntaxTokens {
1616
ClosingParenthesis = ')',
1717
MemberAccess = '.',
1818
Question = '?'
1919
}
2020

21+
export class MemberInfo implements Pick<tss.DefinitionInfo, 'name' | 'fileName'> {
22+
public name: string;
23+
public fileName: string;
24+
}
25+
2126
/** Returns a source file */
2227
// export function getFileSource(sourceText: string): ts.SourceFile {
2328
// return ts.createSourceFile('', sourceText, ts.ScriptTarget.Latest, true);
@@ -45,7 +50,9 @@ export const getIdentifierPositions = (source: string | ts.SourceFile, name: str
4550
return false;
4651
}
4752
}
48-
return node.text === name;
53+
// for methods the node.text will not contain characters like ()
54+
const cleanName = name.match(/\w+/g)[0] || name;
55+
return node.text === cleanName;
4956
};
5057

5158
const findIdentifiers = (node: ts.Node) => {
@@ -251,7 +258,7 @@ const getTypeDefinitions = (langServ: tss.LanguageService, entryPath: string, po
251258
* @param position Index of identifier
252259
*/
253260
export const getTypeDefinitionAtPosition =
254-
(langServ: tss.LanguageService, entryPath: string, position: number): Pick<tss.DefinitionInfo, 'name' | 'fileName'> | null => {
261+
(langServ: tss.LanguageService, entryPath: string, position: number): MemberInfo | null => {
255262
const definition = langServ.getDefinitionAndBoundSpan(entryPath, position)?.definitions[0];
256263
if (!definition) {
257264
return null;
@@ -264,6 +271,19 @@ export const getTypeDefinitionAtPosition =
264271
if (definition.kind.toString() === 'method') {
265272
return getMethodTypeDefinition(langServ, definition);
266273
}
274+
if (entryPath.endsWith('.ts')) {
275+
// for ts files we can use the type checker to look up a specific node
276+
// and attempt to resolve its actual type
277+
const sourceFile = langServ.getProgram().getSourceFile(entryPath);
278+
// const node = (tss as any).getTouchingPropertyName(sourceFile, position); -> tss internal that looks up a node
279+
const node = findNodeAtPosition(sourceFile, position);
280+
if (node) {
281+
const memberInfo = resolveMemberInfo(langServ, node);
282+
if (memberInfo) {
283+
return memberInfo;
284+
}
285+
}
286+
}
267287

268288
let typeDefs = getTypeDefinitions(langServ, definition.fileName || entryPath, definition.textSpan.start);
269289
// if there are no type definitions found, the identifier is a ts property, referred in an internal/external template
@@ -311,7 +331,6 @@ export const getTypeDefinitionAtPosition =
311331
return null;
312332
};
313333

314-
315334
/**
316335
* Determines if a member belongs to a type in the `igniteui-angular` toolkit.
317336
*
@@ -325,7 +344,7 @@ export const isMemberIgniteUI =
325344
const content = langServ.getProgram().getSourceFile(entryPath).getText();
326345
matchPosition = shiftMatchPosition(matchPosition, content);
327346
const prevChar = content.substr(matchPosition - 1, 1);
328-
if (prevChar === SynaxTokens.ClosingParenthesis) {
347+
if (prevChar === SyntaxTokens.ClosingParenthesis) {
329348
// methodCall().identifier
330349
matchPosition = langServ.getBraceMatchingAtPosition(entryPath, matchPosition - 1)[0]?.start ?? matchPosition;
331350
}
@@ -339,6 +358,49 @@ export const isMemberIgniteUI =
339358
&& change.definedIn.indexOf(typeDef.name) !== -1;
340359
};
341360

361+
const resolveMemberInfo = (langServ: tss.LanguageService, node: tss.Node): MemberInfo | null => {
362+
const typeChecker = langServ.getProgram().getTypeChecker();
363+
const nodeType = typeChecker.getTypeAtLocation(node);
364+
const typeArguments = typeChecker.getTypeArguments(nodeType as tss.TypeReference);
365+
if (typeArguments && typeArguments.length < 1) {
366+
// it's not a generic type so try to look up its name and fileName
367+
// atm we do not support migrating union/intersection generic types
368+
// a type symbol (type) should have only one declaration
369+
// if the type is 'any' or 'some', there will be no type symbol
370+
const name = nodeType.getSymbol()?.getName();
371+
const declarations = nodeType.getSymbol()?.getDeclarations();
372+
if (declarations && declarations.length > 0) {
373+
const fileName = declarations[0].getSourceFile().fileName;
374+
if (name && fileName) {
375+
return { name, fileName };
376+
}
377+
}
378+
}
379+
380+
return null;
381+
}
382+
383+
/**
384+
* Looks up a node which end property matches the specified position.
385+
* Can go to the next node if the currently found one is invalid (comment for example)
386+
*/
387+
const findNodeAtPosition = (sourceFile: tss.SourceFile, position: number): tss.Node | null => {
388+
if (!sourceFile) {
389+
return null;
390+
}
391+
392+
return findInnerNode(sourceFile, position);
393+
}
394+
const findInnerNode = (node: tss.Node, position: number): tss.Node | null => {
395+
if (position <= node.getEnd()) {
396+
// see tss.forEachChild for documentation
397+
// look for the innermost child that matches the position
398+
return node.forEachChild(cn => findInnerNode(cn, position)) || node;
399+
}
400+
401+
return null;
402+
}
403+
342404
/**
343405
* Shifts the match position of the identifier to the left
344406
* until any character other than an empty string or a '.' is reached. #9347
@@ -347,8 +409,8 @@ const shiftMatchPosition = (matchPosition: number, content: string): number => {
347409
do {
348410
matchPosition--;
349411
} while (matchPosition > 0 && !content[matchPosition - 1].trim()
350-
|| content[matchPosition - 1] === SynaxTokens.MemberAccess
351-
|| content[matchPosition - 1] === SynaxTokens.Question);
412+
|| content[matchPosition - 1] === SyntaxTokens.MemberAccess
413+
|| content[matchPosition - 1] === SyntaxTokens.Question);
352414
return matchPosition;
353415
};
354416

@@ -358,8 +420,7 @@ const shiftMatchPosition = (matchPosition: number, content: string): number => {
358420
* @param langServ The TypeScript LanguageService.
359421
* @param definition The method definition.
360422
*/
361-
const getMethodTypeDefinition = (langServ: tss.LanguageService, definition: tss.DefinitionInfo):
362-
Pick<tss.DefinitionInfo, 'name' | 'fileName'> | null => {
423+
const getMethodTypeDefinition = (langServ: tss.LanguageService, definition: tss.DefinitionInfo): MemberInfo | null => {
363424
// TODO: use typechecker for all the things?
364425
const sourceFile = langServ.getProgram().getSourceFile(definition.fileName);
365426

@@ -390,7 +451,7 @@ const getMethodTypeDefinition = (langServ: tss.LanguageService, definition: tss.
390451
// there should never be a case where a type is declared in more than one file
391452
/**
392453
* For union return types like T | null | undefined
393-
* and interesection return types like T & null & undefined
454+
* and intersection return types like T & null & undefined
394455
* the TypeChecker ignores null and undefined and returns only T which is not
395456
* marked as a union or intersection type.
396457
*

projects/igniteui-angular/src/lib/core/styles/themes/schemas/dark/_grid-summary.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,11 +25,11 @@ $dark-bootstrap-grid-summary: $bootstrap-grid-summary;
2525

2626
/// Generates a dark indigo grid-summary schema.
2727
/// @type {Map}
28-
/// @property {Color} background-color [igx-color: 'surface'] - The summaries background color is inherited form igx-grid footer.
28+
/// @property {Map} background-color [igx-color: 'surface'] - The summaries background color is inherited form igx-grid footer.
2929
/// @property {Map} focus-background-color [igx-color: ('grays', 100)] - The background color when a summary item is on focus.
3030
/// @property {Map} label-color [igx-color: ('primary', 200)] - The summaries label color.
3131
/// @property {map} label-hover-color [igx-color: ('primary', 100)] - The summaries hover label color.
32-
/// @property {Color} result-color [igx-color: 'surface'] - The summaries value/result color.
32+
/// @property {Map} result-color [igx-color: 'surface'] - The summaries value/result color.
3333
/// @property {Map} pinned-border-color [igx-color: ('primary', 200)] - The border color of the summary panel.
3434
/// @requires {function} extend
3535
/// @requires $indigo-grid-summary

projects/igniteui-angular/src/lib/core/styles/themes/schemas/dark/_grid-toolbar.scss

Lines changed: 3 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,46 +7,32 @@
77
/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
88
////
99

10-
/// Generates a base dark grid-toolbar schema.
11-
/// @type {Map}
12-
/// @prop {Map} background-color [#222] - The toolbar background color.
13-
/// @prop {Map} dropdown-background [#222] - The toolbar drop-down background color.
14-
$base-dark-grid-toolbar: (
15-
background-color: #222,
16-
dropdown-background: #222
17-
);
18-
1910
/// Generates a dark grid-toolbar schema based on a mix of $light-grid-toolbar and $base-dark-grid-toolbar.
2011
/// @type {Map}
2112
/// @requires {function} extend
2213
/// @requires $light-grid-toolbar
23-
/// @requires $base-dark-grid-toolbar
2414
/// @see $default-palette
25-
$dark-grid-toolbar: extend($light-grid-toolbar, $base-dark-grid-toolbar);
15+
$dark-grid-toolbar: extend($light-grid-toolbar);
2616

2717
/// Generates a dark fluent grid-toolbar schema based on a mix of $fluent-grid-toolbar and $base-dark-grid-toolbar..
2818
/// @type {Map}
2919
/// @requires {function} extend
3020
/// @requires $fluent-grid-toolbar
31-
/// @requires $base-dark-grid-toolbar
32-
$dark-fluent-grid-toolbar: extend($fluent-grid-toolbar, $base-dark-grid-toolbar);
21+
$dark-fluent-grid-toolbar: extend($fluent-grid-toolbar);
3322

3423
/// Generates a dark bootstrap grid-toolbar schema based on a mix of $bootstrap-grid-toolbar and $base-dark-grid-toolbar..
3524
/// @type {Map}
3625
/// @requires {function} extend
3726
/// @requires $bootstrap-grid-toolbar
38-
/// @requires $base-dark-grid-toolbar
39-
$dark-bootstrap-grid-toolbar: extend($bootstrap-grid-toolbar, $base-dark-grid-toolbar);
27+
$dark-bootstrap-grid-toolbar: extend($bootstrap-grid-toolbar);
4028

4129
/// Generates a dark indigo grid-toolbar schema.
4230
/// @type {Map}
4331
/// @property {Map} background-color [igx-color: 'surface'] - The toolbar background color.
4432
/// @requires {function} extend
4533
/// @requires $indigo-grid-toolbar
46-
/// @requires $base-dark-grid-toolbar
4734
$dark-indigo-grid-toolbar: extend(
4835
$indigo-grid-toolbar,
49-
$base-dark-grid-toolbar,
5036
(
5137
background-color: (
5238
igx-color: 'surface',

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_grid-filtering.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@
88

99
/// Generates a light grid-filtering schema.
1010
/// @type {Map}
11-
/// @prop {Color} menu-background [#fff] - The idle menu background color.
11+
/// @prop {Color} menu-background [igx-color: ('surface')] - The idle menu background color.
1212
/// @prop {Color} toggle-background [transparent] - The idle toggle background color.
1313
/// @prop {Color} toggle-filtered-background [transparent] - The filtered toggle background color.
1414
/// @prop {Color} toggle-icon-color [inherit] - The idle toggle icon color.
15-
/// @prop {Color} toggle-icon-hover-color [#fff] - The hover toggle icon color.
15+
/// @prop {Color} toggle-icon-hover-color [igx-contrast-color: ('grays', 900)] - The hover toggle icon color.
1616
/// @prop {Color} menu-button-disabled-text-color [initial] - The menu disabled button text color.
1717
/// @prop {Map} toggle-icon-active-color [igx-contrast-color: ('secondary', 500)] - The active toggle icon color.
1818
/// @prop {Map} toggle-icon-filtered-color [igx-color: ('secondary', 500)] - The filtered toggle icon color.
@@ -22,11 +22,15 @@
2222
/// @prop {Map} menu-button-text-color [igx-color: ('secondary', 500)] - The menu button text color.
2323
/// @see $default-palette
2424
$light-grid-filtering: (
25-
menu-background: #fff,
25+
menu-background: (
26+
igx-color: ('surface')
27+
),
2628
toggle-background: transparent,
2729
toggle-filtered-background: transparent,
2830
toggle-icon-color: inherit,
29-
toggle-icon-hover-color: #fff,
31+
toggle-icon-hover-color: (
32+
igx-contrast-color: ('grays', 900)
33+
),
3034
menu-button-disabled-text-color: initial,
3135

3236
toggle-icon-active-color: (

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_grid-summary.scss

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -51,9 +51,9 @@ $light-grid-summary: (
5151
/// Generates a fluent grid-summary schema.
5252
/// @type {Map}
5353
///
54-
/// @property {Color} background-color [ igx-color: ('surface')] - The summaries background color is inherited from the grid footer.
55-
/// @property {map} border-color [ igx-color: ('grays', 100)] - The summaries border color.
56-
/// @property {map} pinned-border-color [igx-color: ('grays', 300), to-opaque: #fff] - The border color of the summary panel.
54+
/// @property {Map} background-color [igx-color: ('surface')] - The summaries background color is inherited from the grid footer.
55+
/// @property {map} border-color [igx-color: ('grays', 100)] - The summaries border color.
56+
/// @property {map} pinned-border-color [igx-color: ('grays', 300)] - The border color of the summary panel.
5757
///
5858
/// @requires {function} extend
5959
/// @requires {Map} $light-grid-summary
@@ -69,8 +69,7 @@ $fluent-grid-summary: extend(
6969
),
7070

7171
pinned-border-color: (
72-
igx-color: ('grays', 300),
73-
to-opaque: #fff
72+
igx-color: ('grays', 300)
7473
),
7574
)
7675
);
@@ -82,7 +81,7 @@ $bootstrap-grid-summary: $light-grid-summary;
8281

8382
/// Generates an indigo grid-summary schema.
8483
/// @type {Map}
85-
/// @property {Color} background-color [igx-color: ('grays', 100), to-opaque: ()] - The summaries background color is inherited from the grid footer.
84+
/// @property {Map} background-color [igx-color: ('grays', 100)] - The summaries background color is inherited from the grid footer.
8685
/// @property {map} label-hover-color [igx-color: ('primary', 900)] - The summaries hover label color.
8786
/// @property {map} border-color [igx-color: ('primary', 50)] - The summaries border color.
8887
/// @property {map} pinned-border-color [igx-color: ('primary', 200)] - The border color of the summary panel.
@@ -94,8 +93,7 @@ $indigo-grid-summary: extend(
9493
variant: 'indigo-design',
9594

9695
background-color: (
97-
igx-color: ('grays', 100),
98-
to-opaque: ()
96+
igx-color: ('grays', 100)
9997
),
10098

10199
label-hover-color: (

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_grid-toolbar.scss

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,7 @@
1010
/// @type {Map}
1111
/// @property {Map} background-color [igx-color: ('grays', 50)] - The toolbar background color.
1212
/// @property {Map} title-text-color [igx-color: ('grays', 600)] - The toolbar title text color.
13-
///
14-
/// @property {Color} dropdown-background [#fff] - The toolbar drop-down background color.
13+
/// @property {Map} dropdown-background [igx-color: ('surface')] - The toolbar drop-down background color.
1514
/// @property {Map} item-text-color [igx-color: ('grays', 600)] - The toolbar drop-down item text color.
1615
/// @property {Map} item-hover-background [igx-color: ('grays', 100)] - The toolbar drop-down item hover background color.
1716
/// @property {Map} item-hover-text-color [igx-color: ('grays', 600)] - The toolbar drop-down item hover text color.
@@ -29,7 +28,9 @@ $light-grid-toolbar: (
2928
igx-color: ('grays', 600)
3029
),
3130

32-
dropdown-background: #fff,
31+
dropdown-background: (
32+
igx-color: ('surface')
33+
),
3334

3435
item-text-color: (
3536
igx-color: ('grays', 600)

0 commit comments

Comments
 (0)