Merge branch 'master' into skrastev/fix-9158

Author: ChronosSF

.github/workflows/codeql-analysis.yml

@@ -0,0 +1,67 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL"
+
+on:
+  push:
+    branches: [ master ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ master ]
+  schedule:
+    - cron: '33 4 * * 4'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript' ]
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
+        # Learn more:
+        # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v2
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v1
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v1
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 https://git.io/JvXDl
+
+    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+    #    and modify them (or add more) to build your code if your project
+    #    uses a compiled language
+
+    #- run: |
+    #   make bootstrap
+    #   make release
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v1

projects/igniteui-angular/migrations/update-12_0_0/changes/theme-props.json

@@ -322,7 +322,7 @@
             "owner": "igx-button-theme"
         },
         {
-            "name": "$disabled-text-color",
+            "name": "$disabled-color",
             "replaceWith": "$disabled-foreground",
             "owner": "igx-button-theme"
         }

projects/igniteui-angular/src/lib/core/styles/themes/_index.scss

@@ -69,14 +69,16 @@
 /// @param {Map} $schema [$light-schema] - The schema used as basis for styling the components.
 /// @param {List} $exclude [( )] - A list of igx components to be excluded from the global theme styles.
 /// @param {Boolean} $legacy-support [false] - If set to true, it turns on support for IE11, i.e. css variables are not used in the generated component themes.
-/// @param {Boolean} $elevation [true] - Turns on/off elevations for all components in the theme.
 /// @param {Number} $roundness [null] - Sets the global roundness factor (the value can be any decimal fraction between 0 and 1) for all components.
+/// @param {Boolean} $elevation [true] - Turns on/off elevations for all components in the theme.
+/// @param {Map} $elevations [$igx-elevations] - The elevation map to be used by all component themes.
 /// @requires $components
 /// @requires $default-palette
+/// @requires $igx-elevations
 /// @requires {function} is-component
 @mixin igx-theme(
     $palette,
-    $schema: $light-schema,
+    $schema: $light-material-schema,
     $exclude: (),
     $legacy-support: false,
     $roundness: null,

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -5955,6 +5955,22 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
         }
     }
 
+    /**
+     * Finishes the row transactions on the current row.
+     *
+     * @remarks
+     * If `commit === true`, passes them from the pending state to the data (or transaction service)
+     * @example
+     * ```html
+     * <button igxButton (click)="grid.endEdit(true)">Commit Row</button>
+     * ```
+     * @param commit
+     */
+    // TODO: Facade for crud service refactoring. To be removed
+    public endEdit(commit = true, event?: Event) {
+        this.crudService.endEdit(commit, event);
+    }
+
     protected writeToData(rowIndex: number, value: any) {
         mergeObjects(this.gridAPI.get_all_data()[rowIndex], value);
     }

src/app/grid-finjs/controllers.component.html

@@ -2,7 +2,7 @@
     <div class="controls-holder">
         <div class="switches">
             <div class="control-item">
-                <igx-switch [checked]="false" [(ngModel)]="theme" (change)="onChange('theme', $event)">Dark</igx-switch>
+                <igx-switch [checked]="false" (change)="onChange('theme', $event)">Dark</igx-switch>
             </div>
             <div class="control-item">
                 <igx-switch [checked]="true" (change)="onChange('grouped', $event)" color="blue" cssClass="finjs-sample-switch">

src/app/grid-finjs/controllers.component.ts

@@ -18,8 +18,7 @@ export class ControllerComponent implements OnInit, OnDestroy {
     @Output() public volumeChanged = new EventEmitter<any>();
     @Output() public playAction = new EventEmitter<any>();
 
-    public selectionMode = 'multiple';
-    public theme = false;
+    public darkTheme = true;
     public volume = 1000;
     public frequency = 500;
     public controls = [

src/app/grid-finjs/grid-finjs.component.html

@@ -1,4 +1,16 @@
-<igx-grid #grid1 igxPreventDocumentScroll [data]="data" width="100%" height="800px" [autoGenerate]='false' displayDensity='compact' hiddenColumnsText="Hidden" primaryKey='ID' [rowSelection]="selectionMode" [allowFiltering]="true" [filterMode]="'excelStyleFilter'">
+<igx-grid #grid1
+    igxPreventDocumentScroll
+    width="100%" height="800px"
+    displayDensity='compact'
+    hiddenColumnsText="Hidden"
+    primaryKey='ID'
+    [(groupingExpressions)]="groupingExpressions"
+    [autoGenerate]='false'
+    [data]="data"
+    [hideGroupedColumns]="true"
+    [rowSelection]="selectionMode"
+    [allowFiltering]="true"
+    [filterMode]="'excelStyleFilter'">
 
     <igx-grid-toolbar *ngIf="showToolbar">
         <igx-grid-toolbar-actions>
@@ -35,7 +47,7 @@
         </ng-template>
     </igx-column>
     <igx-column [field]="'LastUpdated'" [width]="'120px'" [editable]='true' header="Last Update" dataType="date"></igx-column>
-    <igx-column [field]="'Open Price'" [width]="'120px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Open Price'" [width]="'120px'" dataType="currency" [pipeArgs]="columnFormat" [movable]="true" [sortable]="true"></igx-column>
     <igx-column [field]="'Price'" [width]="'110px'" dataType="number" [cellClasses]="trends" [movable]="true" [sortable]="true">
         <ng-template igxCell let-cell="cell">
             <div class="finjs-icons">
@@ -53,22 +65,22 @@
         </ng-template>
     </igx-column>
 
-    <igx-column [field]="'Change'" [width]="'120px'" dataType="number" [headerClasses]="'headerAlignSyle'" [sortable]="true" [cellClasses]="trendsChange" [formatter]="formatNumber" [movable]="true">
+    <igx-column [field]="'Change'" [width]="'120px'" dataType="number" [headerClasses]="'headerAlignSyle'" [sortable]="true" [cellClasses]="trendsChange" [movable]="true">
     </igx-column>
 
-    <igx-column [field]="'Change(%)'" [width]="'110px'" dataType="number" [formatter]="percentage" [movable]="true" [sortable]="true" [cellClasses]="trendsChange">
+    <igx-column [field]="'Change(%)'" [width]="'110px'" dataType="percent" [movable]="true" [sortable]="true" [cellClasses]="trendsChange">
     </igx-column>
 
-    <igx-column [field]="'Buy'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'Sell'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'Spread'" [width]="'110px'" dataType="number" [formatter]="formatNumber" [movable]="true">
+    <igx-column [field]="'Buy'" [width]="'110px'" dataType="currency" [pipeArgs]="columnFormat" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Sell'" [width]="'110px'" dataType="currency" [pipeArgs]="columnFormat" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Spread'" [width]="'110px'" dataType="number" [pipeArgs]="columnFormat" [movable]="true">
     </igx-column>
-    <igx-column [field]="'Volume'" [width]="'110px'" dataType="number" [formatter]="formatNumber" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'High(D)'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'Low(D)'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'High(Y)'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'Low(Y)'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
-    <igx-column [field]="'Start(Y)'" [width]="'110px'" dataType="number" [formatter]="formatCurrency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Volume'" [width]="'110px'" dataType="number" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'High(D)'" [width]="'110px'" dataType="currency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Low(D)'" [width]="'110px'" dataType="currency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'High(Y)'" [width]="'110px'" dataType="currency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Low(Y)'" [width]="'110px'" dataType="currency" [movable]="true" [sortable]="true"></igx-column>
+    <igx-column [field]="'Start(Y)'" [width]="'110px'" dataType="currency" [movable]="true" [sortable]="true"></igx-column>
     <igx-column [field]="'IndGrou'" [width]="'100px'" [filterable]='false'></igx-column>
     <igx-column [field]="'IndSect'" [width]="'120px'" [filterable]='false' [resizable]='true'></igx-column>
     <igx-column [field]="'IndSubg'" [width]="'100px'" [filterable]='false'></igx-column>