Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular into nrobakova/refactor-keyboardNav-tests

Author: nrobakova

projects/igniteui-angular/package.json

@@ -78,7 +78,7 @@
         "@angular/forms": "^9.0.0",
         "web-animations-js": "^2.3.2"
     },
-    "devDependencies": {
+    "igxDevDependencies": {
         "@igniteui/angular-schematics": "~9.0.500-rc.3"
     },
     "ng-update": {

projects/igniteui-angular/schematics/ng-add/index.spec.ts

@@ -108,7 +108,8 @@ describe('ng-add schematics', () => {
     runner.runSchematic('ng-add', { normalizeCss: false }, tree);
     const pkgJsonData = JSON.parse(tree.readContent('/package.json'));
 
-    expect(pkgJsonData.devDependencies['@igniteui/angular-schematics']).toBeTruthy();
+    const version = require('../../package.json')['igxDevDependencies']['@igniteui/angular-schematics'];
+    expect(pkgJsonData.devDependencies['@igniteui/angular-schematics']).toBe(version);
     expect(pkgJsonData.dependencies['@igniteui/angular-schematics']).toBeFalsy();
   });
 

projects/igniteui-angular/schematics/utils/dependency-handler.ts

@@ -67,7 +67,7 @@ export function addDependencies(options: Options): Rule {
             }
         });
 
-        addPackageToPkgJson(tree, schematicsPackage, pkgJson.devDependencies[schematicsPackage], devDependencies);
+        addPackageToPkgJson(tree, schematicsPackage, pkgJson.igxDevDependencies[schematicsPackage], devDependencies);
         return tree;
     };
 }

projects/igniteui-angular/src/lib/core/styles/base/utilities/_functions.scss

@@ -297,7 +297,7 @@
 /// @param {Color} $success [#4eb862] - The success color used throughout the application.
 /// @param {Color} $warn [#fbb13c] - The warning color used throughout the application.
 /// @param {Color} $error [#ff134a] - The error color used throughout the application.
-/// @param {Color} $grays [$igx-foreground-color] - The color used for generating the grayscale palette.
+/// @param {Color} $grays [#000 | $igx-foreground-color] - The color used for generating the grayscale palette.
 /// @param {Color} $surface [#fff] - The color used as a background in components, such as cards, sheets, and menus.
 /// @returns {Map} - A map consisting of 74 color variations, including the `primary`, `secondary`, `grays`,
 /// `info`, `success`, `warn`, and `error` colors.
@@ -309,12 +309,16 @@
     $success: #4eb862,
     $warn: #fbb13c,
     $error: #ff134a,
-    $grays: if(global-variable-exists('igx-foreground-color'), $igx-foreground-color, #000),
+    $grays: #000,
     $surface: #fff
 ) {
     $saturations: (50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 'A100', 'A200', 'A400', 'A700');
     $shades: (50: .02, 100: .04, 200: .08, 300: .12, 400: .26, 500: .38, 600: .54, 700: .62, 800: .74, 900: .87);
 
+    @if global-variable-exists('igx-foreground-color') and type-of($igx-foreground-color) == 'color' {
+        $grays: $igx-foreground-color;
+    }
+
     $primary-palette: generate-palette($primary, $saturations);
     $secondary-palette: generate-palette($secondary, $saturations);
     $grayscale-palette: grayscale-palette($grays, $shades);