Merge branch 'master' into simeonoff/css-var-refs

Author: simeonoff

.eslintrc.json

@@ -24,7 +24,7 @@
         "no-shadow": "off",
         "@typescript-eslint/no-shadow": ["error"],
         "no-unused-vars": "off",
-        "@typescript-eslint/no-unused-vars": ["warn"],
+        "@typescript-eslint/no-unused-vars": ["warn", { "varsIgnorePattern": "_" }],
         "@typescript-eslint/consistent-type-definitions": "error",
         "@typescript-eslint/dot-notation": "off",
         "@typescript-eslint/explicit-member-accessibility": [

.vscode/launch.json

@@ -17,6 +17,21 @@
             "env": {
                 "TS_NODE_PROJECT": "projects/igniteui-angular/migrations/tsconfig.json"
             }
+        },
+        {
+            "name": "Run migration",
+            "request": "launch",
+            "type": "node",
+            "cwd": "<directory to apply migrations in>",
+            "args": [
+                "-r",
+                "ts-node/register",
+                "path/to/ng", "g",
+                "path/to/igniteui-angular/projects/igniteui-angular/migrations/migration-collection.json:migration-<number>"
+            ],
+            "env": {
+                "TS_NODE_PROJECT": "path/to/igniteui-angular/projects/igniteui-angular/migrations/tsconfig.json"
+            }
         }
     ]
 }

CHANGELOG.md

@@ -2,17 +2,41 @@
 
 All notable changes for each version of this project will be documented in this file.
 ## 11.1.0
+### General
+- `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
+    - The following new events are introduced: `sorting`, `filtering`, `columnPinned`, `columnVisibilityChanging`.
+    - **Behavioral Change** -
+    - `onColumnPinning` to emit `IPinColumnCancellableEventArgs` instead of `IPinColumnEventArgs`.
 
 ### New Features
 - `IgxDropDown`
     - The `igx-drop-down-item` now allows for `igxPrefix`, `igxSuffix` and `igx-divider` directives to be passed as `ng-content` and they will be renderer accordingly in the item's content.
 - `IgxGrid`
     - Added support for exporting grouped data.
+- `IgxInput` now supports `type="file"` and its styling upon all themes.  
+   _Note: validation of file type input is not yet supported._
+
 ### General
 - `IgxDialog`
     - The dialog content has been moved inside the dialog window container in the template. This means that if you have added something in-between the opening and closing tags of the dialog, you may have to adjust its styling a bit since that content is now rendered inside a container that has padding on it.
 - `IgxCalendar`
     - A new string enumeration `IgxCalendarView` is exported. Either the new one or the current `CalendarView` can be used. `CalendarView` will be deprecated in a future release.
+    - `onSelection` is now `selected` 
+    - `onViewChanging` is now `viewChanging`
+    - `onDateSelection` is now `dateSelection`
+    - `onYearSelection` is now `yearSelection`
+    - `onMonthSelection` is now `monthSelection`
+- `IgxYearsViewComponent`
+    - `onSelection` is now `selected`
+    - `onYearSelection` is now `yearSelection`
+- `IgxDaysViewComponent`
+    - `onDateSelection` is now `dateSelection`
+    - `onViewChanging` is now `viewChanging`
+- `IgxMonthsViewComponent`
+    - `onSelection` is now `selected`
+    - `onMonthSelection` is now `monthSelection`
+- `IgxMonthPickerComponent`
+    - `onSelection` is now `selected`
 - `IgxRadioGroup`
     - Added new property `alignment` that determines the radio group alignment. Available options are `horizontal` (default) and `vertical`.
 - `IgxDialog`
@@ -30,6 +54,9 @@ All notable changes for each version of this project will be documented in this
     - Added new property `theme` that allows you to set the theme explicitly and at runtime.
 - `IgxSnackbar`
     - `show` and `hide` methods have been deprecated. `open` and `close` should be used instead.
+- `IgxGrid`, `IgxHierarchicalGrid`, `IgxTreeGrid`
+    - Added new property `selectRowOnClick` that determines whether clicking over a row will change its selection state or not. Set to `true` by default.
+    - `GridPagingMode` enum members rename - `local` to `Local` and `remote` to `Remote`. Example:  `GridPagingMode.Local`.
 
 ## 11.0.4
 

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

@@ -1,5 +1,6 @@
 import { Tree } from '@angular-devkit/schematics';
 import * as ts from 'typescript/lib/tsserverlibrary';
+import { CUSTOM_TS_PLUGIN_NAME } from './tsUtils';
 
 export class ServerHost implements ts.server.ServerHost {
     readonly args: string[];
@@ -72,9 +73,11 @@ export class ServerHost implements ts.server.ServerHost {
 
     public require(initialPath: string, moduleName: string) {
         try {
-            const modulePath = require.resolve(moduleName, {
-                paths: [initialPath],
-            });
+            const paths = [initialPath];
+            if (moduleName === CUSTOM_TS_PLUGIN_NAME) {
+                paths.push(__dirname);
+            }
+            const modulePath = require.resolve(moduleName, { paths });
             return {
                 module: require(modulePath),
                 error: undefined,

projects/igniteui-angular/migrations/common/tsPlugin/TSLanguageService.ts

@@ -0,0 +1,5 @@
+import * as tss from 'typescript/lib/tsserverlibrary';
+
+export interface TSLanguageService extends tss.LanguageService {
+    getTypeScriptLanguageService(): tss.LanguageService;
+}

projects/igniteui-angular/migrations/common/tsPlugin/index.ts

@@ -0,0 +1,24 @@
+import { TSLanguageService } from './TSLanguageService';
+
+const init = (modules: { typescript: typeof import('typescript/lib/tsserverlibrary') }) => {
+    const ts = modules.typescript;
+    let tsLanguageService = null;
+
+    /**
+     * Returns a cached version of the TSLS.
+     * Useful if other global or local plugins modify it.
+     */
+    const getTypeScriptLanguageService = (): ts.LanguageService => tsLanguageService;
+
+    const create = (info: ts.server.PluginCreateInfo): TSLanguageService => {
+        tsLanguageService = info.languageService;
+        return {
+            ...info.languageService,
+            getTypeScriptLanguageService
+        };
+    };
+
+    return { create };
+};
+
+export = init;

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

@@ -5,11 +5,13 @@ import { Tree } from '@angular-devkit/schematics';
 import { MemberChange } from './schema';
 import { escapeRegExp } from './util';
 import { Logger } from './tsLogger';
+import { TSLanguageService } from './tsPlugin/TSLanguageService';
 
 export const IG_PACKAGE_NAME = 'igniteui-angular';
 export const NG_LANG_SERVICE_PACKAGE_NAME = '@angular/language-service';
+export const CUSTOM_TS_PLUGIN_NAME = './tsPlugin';
 
-/** Returns an source file */
+/** Returns a source file */
 // export function getFileSource(sourceText: string): ts.SourceFile {
 //     return ts.createSourceFile('', sourceText, ts.ScriptTarget.Latest, true);
 // }
@@ -128,9 +130,9 @@ export const findMatches = (content: string, change: MemberChange): number[] =>
 };
 
 export const replaceMatch = (content: string, toReplace: string, replaceWith: string, index: number): string =>
-        content.substring(0, index) +
-        replaceWith +
-        content.substring(index + toReplace.length, content.length);
+    content.substring(0, index) +
+    replaceWith +
+    content.substring(index + toReplace.length, content.length);
 
 //#region Language Service
 
@@ -190,7 +192,7 @@ export const createProjectService = (serverHost: tss.server.ServerHost): tss.ser
         useSingleInferredProject: true,
         useInferredProjectPerProjectRoot: true,
         /* will load only global plug-ins */
-        globalPlugins: [NG_LANG_SERVICE_PACKAGE_NAME],
+        globalPlugins: [CUSTOM_TS_PLUGIN_NAME, NG_LANG_SERVICE_PACKAGE_NAME],
         allowLocalPluginLoads: false,
         typingsInstaller: tss.server.nullTypingsInstaller
     });
@@ -204,6 +206,10 @@ export const createProjectService = (serverHost: tss.server.ServerHost): tss.ser
             }
         ]
     });
+    projectService.configurePlugin({
+        pluginName: CUSTOM_TS_PLUGIN_NAME,
+        configuration: {}
+    });
     projectService.configurePlugin({
         pluginName: NG_LANG_SERVICE_PACKAGE_NAME,
         configuration: {
@@ -214,6 +220,19 @@ export const createProjectService = (serverHost: tss.server.ServerHost): tss.ser
     return projectService;
 };
 
+/**
+ * Attempts to get type definitions using the TypeScript Language Service.
+ * Can fall back to a cached version of the TSLS.
+ */
+const getTypeDefinitions = (langServ: tss.LanguageService, entryPath: string, definition: tss.DefinitionInfo): any =>
+    /*
+        getTypeScriptLanguageService is attached by us to the Typescript Language Service
+        via a custom made plugin, it's sole purpose is to cache the language service and return it
+        before any other plugins modify it
+    */
+    langServ.getTypeDefinitionAtPosition(entryPath, definition.textSpan.start)
+    || (langServ as TSLanguageService).getTypeScriptLanguageService().getTypeDefinitionAtPosition(entryPath, definition.textSpan.start);
+
 /**
  * Get type information about a TypeScript identifier
  *
@@ -222,61 +241,61 @@ export const createProjectService = (serverHost: tss.server.ServerHost): tss.ser
  * @param position Index of identifier
  */
 export const getTypeDefinitionAtPosition =
-(langServ: tss.LanguageService, entryPath: string, position: number): tss.DefinitionInfo | null => {
-    const definition = langServ.getDefinitionAndBoundSpan(entryPath, position)?.definitions[0];
-    if (!definition) {
-        return null;
-    }
-
-    // if the definition's kind is a reference, the identifier is a template variable referred in an internal/external template
-    if (definition.kind.toString() === 'reference') {
-        return langServ.getDefinitionAndBoundSpan(entryPath, definition.textSpan.start).definitions[0];
-    }
-    let typeDefs = langServ.getTypeDefinitionAtPosition(entryPath, definition.textSpan.start);
-    // if there are no type definitions found, the identifier is a ts property, referred in an internal/external template
-    // or is a reference in a decorator
-    if (!typeDefs) {
-        /*
-         normally, the tsserver will consider non .ts files as external to the project
-         however, we load .html files which we can handle with the Angular language service
-         here we're only looking for definitions in a .ts source file
-         we call the getSourceFile function which accesses a map of files, previously loaded by the tsserver
-         at this point the map contains all .html files that we've included
-         we have to ignore them, since the language service will attempt to parse them as .ts files
-        */
-        if (!definition.fileName.endsWith('.ts')) {
+    (langServ: tss.LanguageService, entryPath: string, position: number): tss.DefinitionInfo | null => {
+        const definition = langServ.getDefinitionAndBoundSpan(entryPath, position)?.definitions[0];
+        if (!definition) {
             return null;
         }
 
-        const sourceFile = langServ.getProgram().getSourceFile(definition.fileName);
-        if (!sourceFile) {
-            return null;
+        // if the definition's kind is a reference, the identifier is a template variable referred in an internal/external template
+        if (definition.kind.toString() === 'reference') {
+            return langServ.getDefinitionAndBoundSpan(entryPath, definition.textSpan.start).definitions[0];
         }
+        let typeDefs = getTypeDefinitions(langServ, entryPath, definition);
+        // if there are no type definitions found, the identifier is a ts property, referred in an internal/external template
+        // or is a reference in a decorator
+        if (!typeDefs) {
+            /*
+             normally, the tsserver will consider non .ts files as external to the project
+             however, we load .html files which we can handle with the Angular language service
+             here we're only looking for definitions in a .ts source file
+             we call the getSourceFile function which accesses a map of files, previously loaded by the tsserver
+             at this point the map contains all .html files that we've included
+             we have to ignore them, since the language service will attempt to parse them as .ts files
+            */
+            if (!definition.fileName.endsWith('.ts')) {
+                return null;
+            }
 
-        const classDeclaration = sourceFile
-            .statements
-            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-            .filter(<(a: tss.Statement) => a is tss.ClassDeclaration>(m => m.kind === tss.SyntaxKind.ClassDeclaration))
-            .find(m => m.name.getText() === definition.containerName);
+            const sourceFile = langServ.getProgram().getSourceFile(definition.fileName);
+            if (!sourceFile) {
+                return null;
+            }
 
-        // there must be at least one class declaration in the .ts file and the property must belong to it
-        if (!classDeclaration) {
-            return null;
-        }
+            const classDeclaration = sourceFile
+                .statements
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                .filter(<(a: tss.Statement) => a is tss.ClassDeclaration>(m => m.kind === tss.SyntaxKind.ClassDeclaration))
+                .find(m => m.name.getText() === definition.containerName);
 
-        const member: ts.ClassElement = classDeclaration.members.find(m => m.name.getText() === definition.name);
-        if (!member?.name) {
-            return null;
-        }
+            // there must be at least one class declaration in the .ts file and the property must belong to it
+            if (!classDeclaration) {
+                return null;
+            }
 
-        typeDefs = langServ.getTypeDefinitionAtPosition(definition.fileName, member.name.getStart() + 1);
-    }
-    if (typeDefs?.length) {
-        return typeDefs[0];
-    }
+            const member: ts.ClassElement = classDeclaration.members.find(m => m.name.getText() === definition.name);
+            if (!member?.name) {
+                return null;
+            }
 
-    return null;
-};
+            typeDefs = langServ.getTypeDefinitionAtPosition(definition.fileName, member.name.getStart() + 1);
+        }
+        if (typeDefs?.length) {
+            return typeDefs[0];
+        }
+
+        return null;
+    };
 
 export const isMemberIgniteUI =
     (change: MemberChange, langServ: tss.LanguageService, entryPath: string, matchPosition: number): boolean => {