Merge branch 'master' into dmdimitrov/esf-templates

Author: DiyanDimitrov

CHANGELOG.md

@@ -20,6 +20,7 @@ All notable changes for each version of this project will be documented in this
     - **Breaking Change** - Removed `IgxExcelStyleSortingTemplateDirective`, `IgxExcelStyleHidingTemplateDirective`, `IgxExcelStyleMovingTemplateDirective`, `IgxExcelStylePinningTemplateDirective` and `IgxExcelStyleSelectingTemplateDirective` directives for re-templating the Excel style filter menu. Added two new directives for re-templating the column operations and filter operations areas - `IgxExcelStyleColumnOperationsTemplateDirective` and `IgxExcelStyleFilterOperationsTemplateDirective`. Exposed all internal components of the Excel style filter menu in order to be used inside the templates.
     - **Breaking Change** - `IgxColumnHiding` and `IgxColumnPinning` components have been deprecated in favor of a component combining the their functionality - `IgxColumnActions` which is used with either of the new `IgxColumnPinning` and `IgxColumnHiding` directives that specify the action to be triggered through the UI.
 - `igxGrid`
+    - **Behavioral Change** - For numeric columns, the onCellEdit arguments' newValue will now contain the numeric value that will be committed instead of the string input.
     - Added `onScroll` event, which is emitted when the grid is scrolled vertically or horizontally.
     - Each grid now expose a default handling for boolean column types. The column will display `check` or `close` icon, instead of true/false by default. 
 - `igxTreeGrid`
@@ -55,6 +56,9 @@ The following example shows how you can use the Indigo theme:
 - `igxButton` directive
     - Added styles to support extended fab buttons.
 - `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
+    - Exposed new `cellEditDone` and `rowEditDone` non cancelable events. The arguments contain `rowData` that is the committed `newValue`.
+        - `cellEditDone` - Emitted after a cell has been edited and editing has been committed.
+        - `rowEditDone` - Emitted after exiting edit mode for a row and editing has been committed.
     - Introduced `showSummaryOnCollapse` grid property which allows you to control whether the summary row stays visible when the groupBy / parent row is collapsed.
     - Added support for tooltips on data cells default template and summary cells.
     - Added support for binding columns to properties in nested data objects.

package-lock.json

@@ -95,7 +95,7 @@
     "gulp-util": "^3.0.8",
     "hammer-simulator": "0.0.1",
     "igniteui-sassdoc-theme": "^1.1.2",
-    "igniteui-typedoc-theme": "^1.3.6",
+    "igniteui-typedoc-theme": "^2.0.5",
     "jasmine": "~3.5.0",
     "jasmine-core": "~3.5.0",
     "jasmine-spec-reporter": "~5.0.2",

package.json

@@ -164,6 +164,16 @@
         color: --var($theme, 'message-color');
         max-width: 40ch;
         padding: $dialog-message-padding;
+
+        @media all and (-ms-high-contrast: none)
+        {
+            max-width: map-get((
+                material: 62ch,
+                fluent: 48ch,
+                bootstrap: 60ch,
+                indigo-design: 48ch,
+            ), $variant);
+        }
     }
 
     %igx-dialog-actions {

projects/igniteui-angular/src/lib/core/styles/components/dialog/_dialog-theme.scss

@@ -48,7 +48,11 @@
 
     %grid-excel-icon--filtered {
         &.igx-icon {
-            color: igx-color($palette, 'secondary');
+            color: if(
+                $variant == 'indigo-design',
+                igx-color($palette, 'warn', 500),
+                igx-color($palette, 'secondary')
+            );
         }
     }
 

projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss

@@ -222,11 +222,13 @@ A list of the events emitted by the **igx-grid**:
 |--- |--- |
 |_Event emitters_|_Notify for a change_|
 |`onCellEditEnter`|Emitted when cell enters edit mode.|
-|`onCellEdit`|Emitted when cell editing has been performed in the grid and the value has been submitted.|
-|`onCellEditCancel`|Emitted when cell editing has been performed in the grid and the value has **not** been submitted.|
-|`onRowEditEnter`|Emitted when row enters edit mode.|
-|`onRowEdit`|Emitted when row editing has been performed in the grid and the value has been submitted.|
-|`onRowEditCancel`|Emitted when row editing has been performed in the grid and the value has **not** been submitted.|
+|`onCellEdit`|Emitted just before a cell's value is committed (e.g. by pressing Enter).|
+|`cellEditDone`|Emitted after a cell has been edited and editing has been committed.|
+|`onCellEditCancel`|Emitted when a cell exits edit mode without committing its value (e.g. by pressing Escape).|
+|`onRowEditEnter`|If `[rowEditing]` is enabled, emitted when a row enters edit mode (after onCellEditEnter).|
+|`onRowEdit`|Emitted just before a row in edit mode's value is committed (e.g. by clicking the Done button on the Row Editing Overlay).|
+|`rowEditDone`|Emitted after exiting edit mode for a row and editing has been committed.|
+|`onRowEditCancel`|Emitted when a row exits edit mode without committing its values (e.g. by clicking the Cancel button on the Row Editing Overlay).|
 |`onCellClick`|Emitted when a cell is clicked. Returns the cell object.|
 |`onColumnMoving`|Emitted when a column is moved. Returns the source and target columns objects. This event is cancelable.|
 |`onColumnMovingEnd`|Emitted when a column moving ends. Returns the source and target columns objects. This event is cancelable.|

projects/igniteui-angular/src/lib/grids/README.md

@@ -65,7 +65,7 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
      */
     public getRowData(rowID: any) {
         const data = this.get_all_data(this.grid.transactions.enabled);
-        const index = this.get_row_index_in_data(rowID);
+        const index = this.get_row_index_in_data(rowID, data);
         return data[index];
     }
 
@@ -79,12 +79,12 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
         return this.grid.crudService.cell;
     }
 
-    public get_row_index_in_data(rowID: any): number {
+    public get_row_index_in_data(rowID: any, dataCollection?: any[]): number {
         const grid = this.grid as IgxGridBaseDirective;
         if (!grid) {
             return -1;
         }
-        const data = this.get_all_data(grid.transactions.enabled);
+        const data = dataCollection ?? this.get_all_data(grid.transactions.enabled);
         return grid.primaryKey ? data.findIndex(record => record[grid.primaryKey] === rowID) : data.indexOf(rowID);
     }
 
@@ -127,7 +127,7 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
 
     public submit_value() {
         const cell = this.grid.crudService.cell;
-        if (cell ) {
+        if (cell) {
             const args = this.update_cell(cell, cell.editValue);
             if (args.cancel) {
                 return;
@@ -137,31 +137,24 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
     }
 
     update_cell(cell: IgxCell, value: any) {
-        const data = this.get_all_data(this.grid.transactions.enabled);
-        const index = this.get_row_index_in_data(cell.id.rowID);
-
         cell.editValue = value;
-
         const args = cell.createEditEventArgs();
-
-        // TODO: emit onCellEdit after value is updated - issue #7304
         this.grid.onCellEdit.emit(args);
+        // TODO Implement cellEditExit event end emit if isEqual(args.oldValue, args.newValue)
+        // TODO do not emit onCellEdit & cellEditDone if isEqual(args.oldValue, args.newValue)
         if (args.cancel) {
             return args;
         }
 
-        // Cast to number after emit
-        // TODO: Clean up this
-        args.newValue = cell.castToNumber(args.newValue);
-
         if (isEqual(args.oldValue, args.newValue)) {
             return args;
         }
 
         this.grid.summaryService.clearSummaryCache(args);
-        this.updateData(this.grid, cell.id.rowID, data[index], cell.rowData, reverseMapper(cell.column.field, args.newValue));
+        const data = this.getRowData(cell.id.rowID);
+        this.updateData(this.grid, cell.id.rowID, data, cell.rowData, reverseMapper(cell.column.field, args.newValue));
         if (this.grid.primaryKey === cell.column.field) {
-             if (this.grid.selectionService.isRowSelected(cell.id.rowID)) {
+            if (this.grid.selectionService.isRowSelected(cell.id.rowID)) {
                 this.grid.selectionService.deselectRow(cell.id.rowID);
                 this.grid.selectionService.selectRowById(args.newValue);
             }
@@ -175,6 +168,9 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
             (this.grid as any)._pipeTrigger++;
         }
 
+        const doneArgs = cell.createDoneEditEventArgs(args.newValue);
+        this.grid.cellEditDone.emit(doneArgs);
+
         return args;
     }
 
@@ -203,7 +199,7 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
         const grid = this.grid;
 
         const rowInEditMode = grid.crudService.row;
-        row.newData = value ? value : grid.transactions.getAggregatedValue(row.id, true);
+        row.newData = value ?? rowInEditMode.transactionState;
 
 
         if (rowInEditMode && row.id === rowInEditMode.id) {
@@ -220,9 +216,8 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
         const selected = grid.selectionService.isRowSelected(row.id);
         const rowInEditMode = grid.crudService.row;
         const data = this.get_all_data(grid.transactions.enabled);
-        const index = this.get_row_index_in_data(row.id);
+        const index = this.get_row_index_in_data(row.id, data);
         const hasSummarized = grid.hasSummarizedColumns;
-
         this._update_row(row, value);
 
         const args = row.createEditEventArgs();
@@ -232,13 +227,13 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
             return args;
         }
 
-        // TODO: emit onRowEdit after value is updated - issue #7304
         grid.onRowEdit.emit(args);
 
         if (args.cancel) {
             return args;
         }
 
+        const cachedRowData = { ... args.oldValue };
         if (rowInEditMode) {
             const hasChanges = grid.transactions.getState(args.rowID, true);
             grid.transactions.endPending(false);
@@ -261,16 +256,19 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
             grid.selectionService.deselectRow(row.id);
             grid.selectionService.selectRowById(newId);
         }
+        // make sure selection is handled prior to updating the row.id
+        row.id = newId;
         if (hasSummarized) {
             grid.summaryService.removeSummaries(newId);
         }
         (grid as any)._pipeTrigger++;
 
+        const doneArgs = row.createDoneEditEventArgs(cachedRowData);
+        grid.rowEditDone.emit(doneArgs);
         return args;
     }
 
 
-
     protected update_row_in_array(value: any, rowID: any, index: number) {
         const grid = this.grid;
         grid.data[index] = value;

projects/igniteui-angular/src/lib/grids/api.service.ts

@@ -20,7 +20,7 @@ export interface IGridCellEventArgs extends IBaseEventArgs {
     event: Event;
 }
 
-export interface IGridEditEventArgs extends CancelableEventArgs, IBaseEventArgs {
+export interface IGridEditDoneEventArgs extends IBaseEventArgs {
     rowID: any;
     cellID?: {
         rowID: any,
@@ -35,6 +35,9 @@ export interface IGridEditEventArgs extends CancelableEventArgs, IBaseEventArgs
     owner?: IgxGridBaseDirective & GridType;
 }
 
+export interface IGridEditEventArgs extends CancelableEventArgs, IGridEditDoneEventArgs {
+}
+
 export interface IPinColumnEventArgs extends IBaseEventArgs {
     column: IgxColumnComponent;
     insertAtIndex: number;