From c28d2f4cd00a4c9a962d479946e85733a29ee5cf Mon Sep 17 00:00:00 2001
From: wnvko <milko.venkov@gmail.com>
Date: Thu, 25 Jun 2020 17:33:44 +0300
Subject: [PATCH 01/35] refactor(grid): update grid edit event sample according
 to new args

---
 .../grid-editing-events.component.ts                  | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/src/app/grid/grid-editing-events/grid-editing-events.component.ts b/src/app/grid/grid-editing-events/grid-editing-events.component.ts
index a51c130543..d3fb36bf0b 100644
--- a/src/app/grid/grid-editing-events/grid-editing-events.component.ts
+++ b/src/app/grid/grid-editing-events/grid-editing-events.component.ts
@@ -13,9 +13,6 @@ export class GridEditingEventsComponent implements OnInit {
     public balance: number = 7800;
     public orderBalance: number;
 
-    @ViewChild(IgxGridComponent, { read: IgxGridComponent, static: true })
-    public grid: IgxGridComponent;
-
     @ViewChild(IgxToastComponent, { read: IgxToastComponent, static: true })
     public toast: IgxToastComponent;
 
@@ -34,10 +31,9 @@ export class GridEditingEventsComponent implements OnInit {
     }
 
     public handleCellEdit(event: IGridEditEventArgs) {
-        const column = this.grid.columnList.find(e => e.index === event.cellID.columnID);
-        if (column.header === "Ordered") {
-            const rowData = this.grid.data
-            .find(entry => entry[this.grid.primaryKey] === event.cellID.rowID);
+        const column = event.column;
+        if (column.field === "Ordered") {
+            const rowData = event.rowData;
             if (!rowData) {
                 return;
             }
@@ -47,5 +43,4 @@ export class GridEditingEventsComponent implements OnInit {
             }
         }
     }
-
 }

From 596e7e538dcb215956b125e62167498de40b7a7e Mon Sep 17 00:00:00 2001
From: wnvko <milko.venkov@gmail.com>
Date: Fri, 26 Jun 2020 13:50:08 +0300
Subject: [PATCH 02/35] refactor(grids): update HGrid and TGrid

---
 .../hierarchical-grid-editing-events.component.html      | 2 +-
 .../hierarchical-grid-editing-events.component.ts        | 4 ++--
 .../tree-grid-editing-events.component.ts                | 9 +--------
 3 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.html b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.html
index 09ff6e1047..1e7c42422c 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.html
+++ b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.html
@@ -1,5 +1,5 @@
 <igx-hierarchical-grid igxPreventDocumentScroll  [data]="localData" [autoGenerate]="false"
-    height="600px" width="100%" primaryKey="Artist" (onCellEdit)="handleCellEdit($event, grid)">
+    height="600px" width="100%" primaryKey="Artist" (onCellEdit)="handleCellEdit($event)">
     <igx-column field="Artist" dataType="string"></igx-column>
     <igx-column field="HasGrammyAward" header="Has Grammy Award?" [editable]="true" dataType="boolean">
     </igx-column>
diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
index 5a68e69e34..0aa74675aa 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
@@ -37,9 +37,9 @@ export class HGridEditingEventsComponent implements OnInit, OnDestroy {
 
     public formatter = (a) => a;
 
-    public handleCellEdit(event: IGridEditEventArgs, grid: IgxGridBaseDirective) {
+    public handleCellEdit(event: IGridEditEventArgs) {
         const today = new Date();
-        const column = grid.columnList.find(col => col.index === event.cellID.columnID);
+        const column = event.column;
         if (column.field === "Debut") {
             if (event.newValue > today.getFullYear()) {
                 this.toast.message = "The debut date must be in the past!";
diff --git a/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts b/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts
index d6f6264e6a..2c377cf42c 100644
--- a/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts
+++ b/src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component.ts
@@ -8,9 +8,6 @@ import { generateEmployeeFlatData, IEmployee } from "../data/employees-flat";
     styleUrls: ["tree-grid-editing-events.component.scss"]
 })
 export class TreeGridEditingEventsComponent implements OnInit {
-    @ViewChild(IgxTreeGridComponent, { read: IgxTreeGridComponent, static: true })
-    public grid: IgxTreeGridComponent;
-
     @ViewChild(IgxToastComponent, { read: IgxToastComponent, static: true })
     public toast: IgxToastComponent;
 
@@ -21,11 +18,7 @@ export class TreeGridEditingEventsComponent implements OnInit {
     }
 
     public handleEdit(event: IGridEditEventArgs) {
-        const row = this.data.find(e => e[this.grid.primaryKey] === event.cellID.rowID);
-        if (!row) {
-            return;
-        }
-        const column = this.grid.columnList.find(col => col.index === event.cellID.columnID);
+        const column = event.column;
         if (column.field === "Age") {
             if (event.newValue < 18) {
                 event.cancel = true;

From 7f573ddc3c92613ab3e73000f72cea7500263b88 Mon Sep 17 00:00:00 2001
From: wnvko <milko.venkov@gmail.com>
Date: Wed, 1 Jul 2020 10:32:03 +0300
Subject: [PATCH 03/35] chore(hgrid): remove exesive arguments

---
 .../hierarchical-grid-editing-events.component.ts               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
index 0aa74675aa..9381dfa0a2 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-editing-events/hierarchical-grid-editing-events.component.ts
@@ -56,6 +56,6 @@ export class HGridEditingEventsComponent implements OnInit, OnDestroy {
     }
 
     public handleCreate(event: IGridCreatedEventArgs) {
-        event.grid.onCellEdit.pipe(takeUntil(this.destroy$)).subscribe((e) => this.handleCellEdit(e, event.grid));
+        event.grid.onCellEdit.pipe(takeUntil(this.destroy$)).subscribe((e) => this.handleCellEdit(e));
     }
 }

From b93306ea87701de2e69de3ce61ce39c2fda5cf34 Mon Sep 17 00:00:00 2001
From: ddincheva <desislava9dincheva@gmail.com>
Date: Thu, 2 Jul 2020 16:26:08 +0300
Subject: [PATCH 04/35] feat(IgxSnackbar): update the snackbar sample to
 showcase the updated show method ##2107

---
 .../snackbar-sample-2.component.html          | 23 ++++++++++++++++---
 .../snackbar-sample-2.component.scss          | 19 ++++++++++-----
 2 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
index d6f549ac46..6b1a8f674f 100644
--- a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
+++ b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
@@ -1,4 +1,21 @@
-<button igxButton="raised" (click)="snackbar.show()">Send message</button>
-<div>
-  <igx-snackbar #snackbar [autoHide]="false" actionText="CLOSE" (onAction)="close(snackbar)">Message sent</igx-snackbar>
+<div class="columnWrapper">
+    <span>
+        <h6>Snackbar Component using content projection</h6>
+        <button igxButton="raised" (click)="snackbar.show()">Send message</button>
+        <igx-snackbar #snackbar [autoHide]="false" actionText="CLOSE" (onAction)="close(snackbar)">Message sent</igx-snackbar>
+    </span>
+
+    <span>
+        <h6>Snackbar Component where dynamically change the message text</h6>
+        <button igxButton="outlined" igxButtonColor="blue" (click)="snackbar1.show('Hi! This is info message.')">Info Message</button>
+        <button igxButton="outlined" igxButtonColor="green" (click)="snackbar1.show('Hi! This is success message.')">Success Message</button>
+        <igx-snackbar #snackbar1 [autoHide]="true" actionText="CLOSE" (onAction)="close(snackbar1)"></igx-snackbar>
+    </span>
+    <span>
+        <h6>Snackbar Component using Content Projection and dynamically change the message text</h6>
+        <button igxButton="raised" (click)="snackbar2.show('The message was not delivered successfully. Please contact our support team.')">Send message</button>
+        <igx-snackbar #snackbar2 [autoHide]="false" actionText="CLOSE" (onAction)="close(snackbar2)">
+            <igx-icon>support_agent</igx-icon>
+        </igx-snackbar>
+    </span>
 </div>
diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
index 0b7c8ce52b..3e8738b903 100644
--- a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
+++ b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
@@ -1,6 +1,13 @@
-/* .div
-{
-    position: absolute; 
-    height: 150px; 
-    width: 100%;
-} */
\ No newline at end of file
+.columnWrapper {
+    display: flex;
+    flex-flow: row;
+    padding-top: 30px;
+}
+.columnWrapper span {
+    min-width: 250px;
+    flex: 1 0 0px;
+    justify-content: center;
+    align-items: center;
+    align-content: center;
+    text-align: center;
+}
\ No newline at end of file

From 5f0b8e916969012bdfbe993ae294a0f51ab6956e Mon Sep 17 00:00:00 2001
From: ddincheva <desislava9dincheva@gmail.com>
Date: Thu, 2 Jul 2020 16:26:32 +0300
Subject: [PATCH 05/35] feat(IgxToast): update the toast sample to showcase the
 updated show method ##2107

---
 .../toast-sample-3.component.html             | 29 +++++++++++++++----
 .../toast-sample-3.component.scss             | 14 +++++++++
 2 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
index 4d6353cf68..c7b1c76af8 100644
--- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
+++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
@@ -1,5 +1,24 @@
-<div>
-    <button igxButton="raised" (click)="toast.show()">Show Toast</button>
-    <button igxButton="raised" (click)="toast.hide()">Hide Toast</button>
-    <igx-toast #toast [autoHide]="false">Notification displayed</igx-toast>
-</div>
+<div class='columnWrapper'>
+    <span>
+        <h5>Toast Component using content projection</h5>
+        <button igxButton="raised" (click)="toast.show()">Show Toast</button>
+        <button igxButton="raised" (click)="toast.hide()">Hide Toast</button>
+        <igx-toast #toast [autoHide]="false">Notification displayed</igx-toast>
+    </span>
+    <span>
+        <h5>Toast Component where dynamically changes the message text</h5>
+        <button igxButton="outlined" igxButtonColor="blue" (click)="toast1.show('Hi! This is info message.')">Info Message</button>
+        <button igxButton="outlined" igxButtonColor="green" (click)="toast1.show('Hi! This is success message.')">Success Message</button>
+        <button igxButton="outlined" igxButtonColor="orange" (click)="toast1.show('Hi! This is warning message.')">Warning Message</button>
+        <button igxButton="outlined" igxButtonColor="red" (click)="toast1.show('Hi! This is error message.')">Error Message</button>
+        <igx-toast #toast1 [autoHide]="true"></igx-toast>
+    </span>
+    <span>
+        <h5>Toast Component using Content Projection and dynamically changes the message text</h5>
+        <button igxButton="raised" (click)="toast2.show('You have one new message.')">Show Toast</button>
+        <button igxButton="raised" (click)="toast2.show('Your massage has been successfully sent.')">Show Toast with another message</button>
+        <igx-toast #toast2 [autoHide]="true">
+            <igx-icon>mail</igx-icon>
+        </igx-toast>
+    </span>
+</div>
\ No newline at end of file
diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
index 1e62d3d905..7229dbfca2 100644
--- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
+++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
@@ -1,3 +1,17 @@
+.columnWrapper {
+    display: flex;
+    flex-flow: row;
+    padding-top: 30px;
+}
+.columnWrapper span {
+    min-width: 250px;
+    flex: 1 0 0px;
+    justify-content: center;
+    align-items: center;
+    align-content: center;
+    text-align: center;
+}
+
 button {
     margin: 10px 10px 10px 0;
 }

From 0cc064b193cf40e9c05c63b96ea8498d06dd2555 Mon Sep 17 00:00:00 2001
From: ddincheva <desislava9dincheva@gmail.com>
Date: Fri, 3 Jul 2020 09:54:27 +0300
Subject: [PATCH 06/35] chore(*): additional styling to the toast and snackbar
 samples

---
 .../snackbar-sample-2/snackbar-sample-2.component.scss      | 3 +++
 .../toast/toast-sample-3/toast-sample-3.component.html      | 6 +++---
 .../toast/toast-sample-3/toast-sample-3.component.scss      | 2 +-
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
index 3e8738b903..0dbd5d6758 100644
--- a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
+++ b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.scss
@@ -10,4 +10,7 @@
     align-items: center;
     align-content: center;
     text-align: center;
+}
+button {
+    margin-top: 20px;
 }
\ No newline at end of file
diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
index c7b1c76af8..69e4f0bc9e 100644
--- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
+++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
@@ -1,12 +1,12 @@
 <div class='columnWrapper'>
     <span>
-        <h5>Toast Component using content projection</h5>
+        <h6>Toast using content projection</h6>
         <button igxButton="raised" (click)="toast.show()">Show Toast</button>
         <button igxButton="raised" (click)="toast.hide()">Hide Toast</button>
         <igx-toast #toast [autoHide]="false">Notification displayed</igx-toast>
     </span>
     <span>
-        <h5>Toast Component where dynamically changes the message text</h5>
+        <h6>Toast which dynamically changes the message text</h6>
         <button igxButton="outlined" igxButtonColor="blue" (click)="toast1.show('Hi! This is info message.')">Info Message</button>
         <button igxButton="outlined" igxButtonColor="green" (click)="toast1.show('Hi! This is success message.')">Success Message</button>
         <button igxButton="outlined" igxButtonColor="orange" (click)="toast1.show('Hi! This is warning message.')">Warning Message</button>
@@ -14,7 +14,7 @@ <h5>Toast Component where dynamically changes the message text</h5>
         <igx-toast #toast1 [autoHide]="true"></igx-toast>
     </span>
     <span>
-        <h5>Toast Component using Content Projection and dynamically changes the message text</h5>
+        <h6>Toast using content projection and dynamically changes the message text</h6>
         <button igxButton="raised" (click)="toast2.show('You have one new message.')">Show Toast</button>
         <button igxButton="raised" (click)="toast2.show('Your massage has been successfully sent.')">Show Toast with another message</button>
         <igx-toast #toast2 [autoHide]="true">
diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
index 7229dbfca2..c3878d6d1c 100644
--- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
+++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.scss
@@ -13,5 +13,5 @@
 }
 
 button {
-    margin: 10px 10px 10px 0;
+    margin: 15px 10px 10px 0;
 }

From c1f385a491d43b47a724d139a04d771ae6a230f7 Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <ZKolev@infragistics.com>
Date: Tue, 7 Jul 2020 17:23:19 +0300
Subject: [PATCH 07/35] chore(*): Some minor changes

---
 live-editing/configs/SnackbarConfigGenerator.ts   |  4 ++--
 live-editing/configs/ToastConfigGenerator.ts      | 15 ++++++++++++++-
 .../snackbar-sample-2.component.html              |  6 +++---
 .../toast-sample-3/toast-sample-3.component.html  |  4 ++--
 4 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/live-editing/configs/SnackbarConfigGenerator.ts b/live-editing/configs/SnackbarConfigGenerator.ts
index 1411ad903d..d609d0ab47 100644
--- a/live-editing/configs/SnackbarConfigGenerator.ts
+++ b/live-editing/configs/SnackbarConfigGenerator.ts
@@ -33,10 +33,10 @@ export class SnackbarConfigGenerator implements IConfigGenerator {
         configs.push(new Config({
             component: SnackbarSample2Component,
             appModuleConfig: new AppModuleConfig({
-                imports: [IgxButtonModule, IgxRippleModule,
+                imports: [IgxButtonModule, IgxRippleModule, IgxIconModule,
                 IgxSnackbarModule, SnackbarSample2Component],
                 ngDeclarations: [SnackbarSample2Component],
-                ngImports: [IgxButtonModule, IgxRippleModule, IgxSnackbarModule]
+                ngImports: [IgxButtonModule, IgxRippleModule, IgxSnackbarModule, IgxIconModule]
             }),
             shortenComponentPathBy: "/notifications/snackbar/"
         }));
diff --git a/live-editing/configs/ToastConfigGenerator.ts b/live-editing/configs/ToastConfigGenerator.ts
index 776d01c8d8..23f6c57f44 100644
--- a/live-editing/configs/ToastConfigGenerator.ts
+++ b/live-editing/configs/ToastConfigGenerator.ts
@@ -1,5 +1,5 @@
 /* tslint:disable:object-literal-sort-keys */
-import { IgxButtonModule, IgxRippleModule, IgxToastModule } from "igniteui-angular";
+import { IgxButtonModule, IgxRippleModule, IgxToastModule, IgxIconModule } from "igniteui-angular";
 import { ToastSample1Component
 } from "../../src/app/notifications/toast/toast-sample-1/toast-sample-1.component";
 import { ToastSample2Component
@@ -8,6 +8,7 @@ import { ToastSample5Component
 } from "../../src/app/notifications/toast/toast-sample-5/toast-sample-5.component";
 import { ToastStyleComponent
 } from "../../src/app/notifications/toast/toast-style/toast-style.component";
+import { ToastSample3Component } from "../../src/app/notifications/toast/toast-sample-3/toast-sample-3.component"
 import { AppModuleConfig } from "./core/AppModuleConfig";
 import { Config } from "./core/Config";
 import { IConfigGenerator } from "./core/IConfigGenerator";
@@ -40,6 +41,18 @@ export class ToastConfigGenerator implements IConfigGenerator {
             shortenComponentPathBy: "/notifications/toast/"
         }));
 
+        // toast sample 3
+        configs.push(new Config({
+            component: ToastSample3Component,
+            appModuleConfig: new AppModuleConfig({
+                imports: [IgxButtonModule, IgxRippleModule, IgxIconModule,
+                    IgxToastModule, ToastSample3Component],
+                ngDeclarations: [ToastSample3Component],
+                ngImports: [IgxButtonModule, IgxRippleModule, IgxToastModule, IgxIconModule]
+            }),
+            shortenComponentPathBy: "/notifications/toast/"
+        }));
+
         // toast sample 5
         configs.push(new Config({
             component: ToastSample5Component,
diff --git a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
index 6b1a8f674f..7c59d94216 100644
--- a/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
+++ b/src/app/notifications/snackbar/snackbar-sample-2/snackbar-sample-2.component.html
@@ -1,18 +1,18 @@
 <div class="columnWrapper">
     <span>
-        <h6>Snackbar Component using content projection</h6>
+        <h6>Snackbar Component that uses Content projection</h6>
         <button igxButton="raised" (click)="snackbar.show()">Send message</button>
         <igx-snackbar #snackbar [autoHide]="false" actionText="CLOSE" (onAction)="close(snackbar)">Message sent</igx-snackbar>
     </span>
 
     <span>
-        <h6>Snackbar Component where dynamically change the message text</h6>
+        <h6>Snackbar Component which dynamically changes the message text</h6>
         <button igxButton="outlined" igxButtonColor="blue" (click)="snackbar1.show('Hi! This is info message.')">Info Message</button>
         <button igxButton="outlined" igxButtonColor="green" (click)="snackbar1.show('Hi! This is success message.')">Success Message</button>
         <igx-snackbar #snackbar1 [autoHide]="true" actionText="CLOSE" (onAction)="close(snackbar1)"></igx-snackbar>
     </span>
     <span>
-        <h6>Snackbar Component using Content Projection and dynamically change the message text</h6>
+        <h6>Snackbar Component that uses Content Projection and dynamically changes the message text</h6>
         <button igxButton="raised" (click)="snackbar2.show('The message was not delivered successfully. Please contact our support team.')">Send message</button>
         <igx-snackbar #snackbar2 [autoHide]="false" actionText="CLOSE" (onAction)="close(snackbar2)">
             <igx-icon>support_agent</igx-icon>
diff --git a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
index 69e4f0bc9e..64ffdde80f 100644
--- a/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
+++ b/src/app/notifications/toast/toast-sample-3/toast-sample-3.component.html
@@ -1,6 +1,6 @@
 <div class='columnWrapper'>
     <span>
-        <h6>Toast using content projection</h6>
+        <h6>Toast that uses content projection</h6>
         <button igxButton="raised" (click)="toast.show()">Show Toast</button>
         <button igxButton="raised" (click)="toast.hide()">Hide Toast</button>
         <igx-toast #toast [autoHide]="false">Notification displayed</igx-toast>
@@ -14,7 +14,7 @@ <h6>Toast which dynamically changes the message text</h6>
         <igx-toast #toast1 [autoHide]="true"></igx-toast>
     </span>
     <span>
-        <h6>Toast using content projection and dynamically changes the message text</h6>
+        <h6>Toast that uses content projection and dynamically changes the message text</h6>
         <button igxButton="raised" (click)="toast2.show('You have one new message.')">Show Toast</button>
         <button igxButton="raised" (click)="toast2.show('Your massage has been successfully sent.')">Show Toast with another message</button>
         <igx-toast #toast2 [autoHide]="true">

From 14e188d2d0d78836b80d22b0ed66bd4320b3c104 Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <ZKolev@infragistics.com>
Date: Tue, 7 Jul 2020 17:47:09 +0300
Subject: [PATCH 08/35] update to 10.0.3

---
 package-lock.json | 26 +++++++++++++++++++++++---
 package.json      |  2 +-
 2 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 17a0a7c5c8..8b956c0754 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3194,6 +3194,16 @@
       "integrity": "sha512-Phlt0plgpIIBOGTT/ehfFnbNlfsDEiqmzE2KRXoX1bLIlir4X/MR+zSyBEkL05ffWgnRSf/DXv+WrUAVr93/ow==",
       "dev": true
     },
+    "bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "blob": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz",
@@ -5913,6 +5923,13 @@
       "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.2.tgz",
       "integrity": "sha512-Wz3c3XQ5xroCxd1G8b7yL0Ehkf0TC9oYC6buPFkNnU9EnaPlifeAFCyCh+iewXTyFRcg0a6j3J7FmJsIhlhBdw=="
     },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "dev": true,
+      "optional": true
+    },
     "fileset": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
@@ -6623,6 +6640,7 @@
           "dev": true,
           "optional": true,
           "requires": {
+            "bindings": "^1.5.0",
             "nan": "^2.12.1"
           }
         },
@@ -7480,9 +7498,9 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.0.tgz",
-      "integrity": "sha512-rqP1H0hipFzJQ4AqVA0NDfHpsD3l6ku8qPP9eOvgziTSZkZo0XtRj9cYdLVsPmp90FGKbNPjihU1koeLTaS5mA==",
+      "version": "10.0.3",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.3.tgz",
+      "integrity": "sha512-BixuDn9Pl7PFRlNz/CnXF4//KekXAI/5GqGBZ18cJHyGfJNM/WZdJdJu+fDpfdMDQAyFjpt1cGEkHyXmJawsDQ==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
         "@types/jszip": "^3.1.7",
@@ -15288,6 +15306,7 @@
           "dev": true,
           "optional": true,
           "requires": {
+            "bindings": "^1.5.0",
             "nan": "^2.12.1"
           }
         },
@@ -15874,6 +15893,7 @@
           "dev": true,
           "optional": true,
           "requires": {
+            "bindings": "^1.5.0",
             "nan": "^2.12.1"
           }
         },
diff --git a/package.json b/package.json
index cda4985136..5ffe7cf6a1 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "^10.0.0",
+    "igniteui-angular": "10.0.3",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",

From 8c39e7611cb3b94cef499e0bbd0775c55c077fcb Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 11:35:41 +0300
Subject: [PATCH 09/35] adding 1st version of "repositoryfy" in gulpfile

---
 gulpfile.js       |  63 +++++++++
 package-lock.json | 337 ++++++++++++++++++++++++++++++++++++----------
 package.json      |   2 +
 3 files changed, 329 insertions(+), 73 deletions(-)

diff --git a/gulpfile.js b/gulpfile.js
index 0a2ea7d0ef..f2633a8662 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -1,6 +1,9 @@
 const gulp = require("gulp");
 const fs = require("fs");
+const path = require("path");
 const domino = require('domino');
+const es = require('event-stream');
+const del = require('del');
 const tsNode = require('ts-node').register({
     transpileOnly: true,
     compilerOptions: {
@@ -56,3 +59,63 @@ gulp.task("sass-js-compile-check", async() => {
     var checker = requireFile("./live-editing/services/SassJsCompileChecker.ts");
     await checker.sassJsCompileChecker.run();
 });
+const excludedDirectories = ["data", "index", "assets", "environment"];
+const repositoryfy = (projectPath) => {
+    const directories = [];
+    const appDir = fs.readdirSync(projectPath + "/app", "utf-8");
+    appDir.filter(dir => excludedDirectories.indexOf(dir) === -1 )
+          .forEach(child => {
+            if(fs.lstatSync(`${projectPath + "/app"}/${child}`).isDirectory()) {
+                directories.push(child);
+            }
+    });
+    const jsonSamplesPath = path.join(__dirname, `${projectPath}/assets/samples`);
+    const sharedJson = JSON.parse(fs.readFileSync(jsonSamplesPath + "/shared.json"));
+    const devDependencies = JSON.parse(fs.readFileSync("package.json")).devDependencies;
+    return gulp.src([`${jsonSamplesPath}/*.json`,`!${jsonSamplesPath}/shared.json`, `!${jsonSamplesPath}/meta.json`])
+               .pipe(es.map((file, cb) => {
+                   console.log(file.path);
+                    fs.readFile(file.path, 'utf-8', (err, content) => {
+                        const jsonObj = JSON.parse(content);
+                        const packageJson = {
+                            "path": "package.json",
+                            "hasRelativeAssetsUrls": false,
+                            "content": JSON.stringify({"dependencies": JSON.parse(jsonObj.sampleDependencies), "devDependencies": devDependencies})
+                        }
+                        jsonObj.sampleFiles = jsonObj.sampleFiles.concat(sharedJson.files).concat(packageJson);
+                        const fileName = file.path.substring(file.base.length + 1);
+                        const sampleBase = directories.find(d => {
+                            return fileName.indexOf(d + "-") !== -1 && fileName.indexOf(d + "-") === 0;
+                        })
+                        if(!fs.existsSync("test-angular-samples/samples/" + sampleBase)) {
+                            fs.mkdirSync("test-angular-samples/samples/" + sampleBase);
+                        }
+                        const sampleName = fileName.replace(sampleBase + "-", "").replace(".json", "");
+                        const sampleAppPath = "test-angular-samples/samples/" + sampleBase + "/" + sampleName;
+                        if(!fs.existsSync(sampleAppPath)) {
+                            fs.mkdirSync(sampleAppPath);
+                        }
+
+                        jsonObj.sampleFiles.forEach(sampleFile => {
+                            const paths = sampleFile.path.replace("./", "").split("/");
+                            let tempPath = "";
+                            paths.forEach(p => {
+                                tempPath += p + "/";
+                                if(p.indexOf(".") !== -1) {
+                                    fs.writeFileSync(sampleAppPath + "/" + tempPath, sampleFile.content);
+                                } else
+                                if(!fs.existsSync(sampleAppPath + "/" + tempPath)) {
+                                    fs.mkdirSync(sampleAppPath + "/" + tempPath)
+                                }
+                            })
+                        });
+
+                        cb(null, file);
+                    })
+               }))
+               .on("error", () => console.log(err));
+}
+
+gulp.task("repositoryfy", () => {
+    return repositoryfy("src")
+})
diff --git a/package-lock.json b/package-lock.json
index 8b956c0754..19d9f44e08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2072,6 +2072,32 @@
         }
       }
     },
+    "@nodelib/fs.scandir": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz",
+      "integrity": "sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==",
+      "dev": true,
+      "requires": {
+        "@nodelib/fs.stat": "2.0.3",
+        "run-parallel": "^1.1.9"
+      }
+    },
+    "@nodelib/fs.stat": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz",
+      "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==",
+      "dev": true
+    },
+    "@nodelib/fs.walk": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz",
+      "integrity": "sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==",
+      "dev": true,
+      "requires": {
+        "@nodelib/fs.scandir": "2.1.3",
+        "fastq": "^1.6.0"
+      }
+    },
     "@schematics/angular": {
       "version": "10.0.0",
       "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.0.0.tgz",
@@ -4880,64 +4906,69 @@
       }
     },
     "del": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
-      "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz",
+      "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==",
       "dev": true,
       "requires": {
-        "@types/glob": "^7.1.1",
-        "globby": "^6.1.0",
-        "is-path-cwd": "^2.0.0",
-        "is-path-in-cwd": "^2.0.0",
-        "p-map": "^2.0.0",
-        "pify": "^4.0.1",
-        "rimraf": "^2.6.3"
+        "globby": "^10.0.1",
+        "graceful-fs": "^4.2.2",
+        "is-glob": "^4.0.1",
+        "is-path-cwd": "^2.2.0",
+        "is-path-inside": "^3.0.1",
+        "p-map": "^3.0.0",
+        "rimraf": "^3.0.0",
+        "slash": "^3.0.0"
       },
       "dependencies": {
         "array-union": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-          "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+          "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+          "dev": true
+        },
+        "dir-glob": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
+          "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==",
           "dev": true,
           "requires": {
-            "array-uniq": "^1.0.1"
+            "path-type": "^4.0.0"
           }
         },
         "globby": {
-          "version": "6.1.0",
-          "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-          "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+          "version": "10.0.2",
+          "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.2.tgz",
+          "integrity": "sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==",
           "dev": true,
           "requires": {
-            "array-union": "^1.0.1",
-            "glob": "^7.0.3",
-            "object-assign": "^4.0.1",
-            "pify": "^2.0.0",
-            "pinkie-promise": "^2.0.0"
-          },
-          "dependencies": {
-            "pify": {
-              "version": "2.3.0",
-              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-              "dev": true
-            }
+            "@types/glob": "^7.1.1",
+            "array-union": "^2.1.0",
+            "dir-glob": "^3.0.1",
+            "fast-glob": "^3.0.3",
+            "glob": "^7.1.3",
+            "ignore": "^5.1.1",
+            "merge2": "^1.2.3",
+            "slash": "^3.0.0"
           }
         },
-        "p-map": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
-          "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
+        "ignore": {
+          "version": "5.1.8",
+          "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz",
+          "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==",
           "dev": true
         },
-        "rimraf": {
-          "version": "2.7.1",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
-          "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
-          "dev": true,
-          "requires": {
-            "glob": "^7.1.3"
-          }
+        "path-type": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
+          "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
+          "dev": true
+        },
+        "slash": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
+          "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+          "dev": true
         }
       }
     },
@@ -5134,6 +5165,12 @@
         "is-obj": "^2.0.0"
       }
     },
+    "duplexer": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E=",
+      "dev": true
+    },
     "duplexify": {
       "version": "3.7.1",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
@@ -5516,6 +5553,21 @@
       "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=",
       "dev": true
     },
+    "event-stream": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-4.0.1.tgz",
+      "integrity": "sha512-qACXdu/9VHPBzcyhdOWR5/IahhGMf0roTeZJfzz077GwylcDd90yOHLouhmv7GJ5XzPi6ekaQWd8AvPP2nOvpA==",
+      "dev": true,
+      "requires": {
+        "duplexer": "^0.1.1",
+        "from": "^0.1.7",
+        "map-stream": "0.0.7",
+        "pause-stream": "^0.0.11",
+        "split": "^1.0.1",
+        "stream-combiner": "^0.2.2",
+        "through": "^2.3.8"
+      }
+    },
     "eventemitter3": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
@@ -5861,6 +5913,27 @@
         "merge2": "^1.3.0",
         "micromatch": "^4.0.2",
         "picomatch": "^2.2.1"
+      },
+      "dependencies": {
+        "glob-parent": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
+          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "dev": true,
+          "requires": {
+            "is-glob": "^4.0.1"
+          }
+        },
+        "micromatch": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz",
+          "integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==",
+          "dev": true,
+          "requires": {
+            "braces": "^3.0.1",
+            "picomatch": "^2.0.5"
+          }
+        }
       }
     },
     "fast-json-stable-stringify": {
@@ -6272,6 +6345,12 @@
       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac=",
       "dev": true
     },
+    "from": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
+      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4=",
+      "dev": true
+    },
     "from2": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/from2/-/from2-2.3.0.tgz",
@@ -8060,16 +8139,24 @@
       "dev": true,
       "requires": {
         "is-path-inside": "^2.1.0"
+      },
+      "dependencies": {
+        "is-path-inside": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
+          "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
+          "dev": true,
+          "requires": {
+            "path-is-inside": "^1.0.2"
+          }
+        }
       }
     },
     "is-path-inside": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
-      "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
-      "dev": true,
-      "requires": {
-        "path-is-inside": "^1.0.2"
-      }
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.2.tgz",
+      "integrity": "sha512-/2UGPSgmtqwo1ktx8NDHjuPwZWmHhO+gj0f93EkhLB5RgW9RZevWYYlIkS6zePc6U2WpOdQYIwHe9YC4DWEBVg==",
+      "dev": true
     },
     "is-plain-obj": {
       "version": "1.1.0",
@@ -9237,6 +9324,12 @@
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
       "dev": true
     },
+    "map-stream": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz",
+      "integrity": "sha1-ih8HiW2CsQkmvTdEokIACfiJdKg=",
+      "dev": true
+    },
     "map-visit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
@@ -11002,6 +11095,15 @@
       "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
       "dev": true
     },
+    "pause-stream": {
+      "version": "0.0.11",
+      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz",
+      "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU=",
+      "dev": true,
+      "requires": {
+        "through": "~2.3"
+      }
+    },
     "pbkdf2": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.1.tgz",
@@ -12872,30 +12974,6 @@
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
       "dev": true
     },
-    "rework": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/rework/-/rework-1.0.1.tgz",
-      "integrity": "sha1-MIBqhBNCtUUQqkEQhQzUhTQUSqc=",
-      "dev": true,
-      "requires": {
-        "convert-source-map": "^0.3.3",
-        "css": "^2.0.0"
-      },
-      "dependencies": {
-        "convert-source-map": {
-          "version": "0.3.5",
-          "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-0.3.5.tgz",
-          "integrity": "sha1-8dgClQr33SYxof6+BZZVDIarMZA=",
-          "dev": true
-        }
-      }
-    },
-    "rework-visit": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/rework-visit/-/rework-visit-1.0.0.tgz",
-      "integrity": "sha1-mUWygD8hni96ygCtuLyfZA+ELJo=",
-      "dev": true
-    },
     "rfdc": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.1.4.tgz",
@@ -13937,6 +14015,15 @@
         "chalk": "^2.0.1"
       }
     },
+    "split": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/split/-/split-1.0.1.tgz",
+      "integrity": "sha512-mTyOoPbrivtXnwnIxZRFYRrPNtEFKlpB2fvjSnCQUiAA6qAZzqwna5envK4uk6OIeP17CsdF3rSBGYVBsU0Tkg==",
+      "dev": true,
+      "requires": {
+        "through": "2"
+      }
+    },
     "split-string": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
@@ -14036,6 +14123,16 @@
         "readable-stream": "^2.0.2"
       }
     },
+    "stream-combiner": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.2.2.tgz",
+      "integrity": "sha1-rsjLrBd7Vrb0+kec7YwZEs7lKFg=",
+      "dev": true,
+      "requires": {
+        "duplexer": "~0.1.1",
+        "through": "~2.3.4"
+      }
+    },
     "stream-each": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/stream-each/-/stream-each-1.2.3.tgz",
@@ -15863,6 +15960,52 @@
             "upath": "^1.1.1"
           }
         },
+        "cliui": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
+          "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
+          "dev": true,
+          "requires": {
+            "string-width": "^3.1.0",
+            "strip-ansi": "^5.2.0",
+            "wrap-ansi": "^5.1.0"
+          },
+          "dependencies": {
+            "strip-ansi": {
+              "version": "5.2.0",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+              "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+              "dev": true,
+              "requires": {
+                "ansi-regex": "^4.1.0"
+              }
+            }
+          }
+        },
+        "del": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
+          "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
+          "dev": true,
+          "requires": {
+            "@types/glob": "^7.1.1",
+            "globby": "^6.1.0",
+            "is-path-cwd": "^2.0.0",
+            "is-path-in-cwd": "^2.0.0",
+            "p-map": "^2.0.0",
+            "pify": "^4.0.1",
+            "rimraf": "^2.6.3"
+          }
+        },
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "dev": true,
+          "requires": {
+            "is-extendable": "^0.1.0"
+          }
+        },
         "fill-range": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
@@ -15918,6 +16061,27 @@
             }
           }
         },
+        "globby": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+          "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+          "dev": true,
+          "requires": {
+            "array-union": "^1.0.1",
+            "glob": "^7.0.3",
+            "object-assign": "^4.0.1",
+            "pify": "^2.0.0",
+            "pinkie-promise": "^2.0.0"
+          },
+          "dependencies": {
+            "pify": {
+              "version": "2.3.0",
+              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+              "dev": true
+            }
+          }
+        },
         "is-absolute-url": {
           "version": "3.0.3",
           "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-3.0.3.tgz",
@@ -15974,6 +16138,18 @@
             "to-regex": "^3.0.2"
           }
         },
+        "p-map": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
+          "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
+          "dev": true
+        },
+        "p-try": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+          "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+          "dev": true
+        },
         "readdirp": {
           "version": "2.2.1",
           "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
@@ -15985,6 +16161,21 @@
             "readable-stream": "^2.0.2"
           }
         },
+        "require-main-filename": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+          "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
+          "dev": true
+        },
+        "rimraf": {
+          "version": "2.7.1",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+          "integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+          "dev": true,
+          "requires": {
+            "glob": "^7.1.3"
+          }
+        },
         "schema-utils": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
diff --git a/package.json b/package.json
index 5ffe7cf6a1..ea92e18445 100644
--- a/package.json
+++ b/package.json
@@ -81,6 +81,8 @@
     "@types/jasminewd2": "^2.0.8",
     "@types/node": "^13.9.3",
     "codelyzer": "^5.2.1",
+    "del": "^5.1.0",
+    "event-stream": "^4.0.1",
     "fs-extra": "^8.1.0",
     "gulp": "^4.0.2",
     "jasmine-core": "~3.5.0",

From 832bbb88526259be3f7a6166d7d88779e6c88b3c Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 11:36:55 +0300
Subject: [PATCH 10/35] adding final changes

---
 .gitmodules                                   |   4 +
 .vscode/launch.json                           |  12 ++-
 gulpfile.js                                   | 100 +++++++++++++-----
 .../generators/SampleAssetsGenerator.ts       |   2 +-
 .../generators/SharedAssetsGenerator.ts       |   4 +-
 .../generators/misc/SharedAssetsFile.ts       |   5 +-
 live-editing/services/DependencyResolver.ts   |  39 +++++++
 package.json                                  |   4 +-
 8 files changed, 139 insertions(+), 31 deletions(-)
 create mode 100644 .gitmodules

diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000000..71b7559a72
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,4 @@
+[submodule "igniteui-live-editing-samples"]
+	path = igniteui-live-editing-samples
+	url = https://github.com/IgniteUI/igniteui-live-editing-samples
+    branch = vNext
\ No newline at end of file
diff --git a/.vscode/launch.json b/.vscode/launch.json
index aaefaad06c..2ede9d5a87 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -26,6 +26,16 @@
                 "--nolazy"
             ],
             "console": "internalConsole",
-        }
+        },
+        {
+            "name": "Launch Repositoryfy",
+            "type": "node",
+            "request": "launch",
+            "program": "${workspaceRoot}/node_modules/gulp/bin/gulp.js",
+            "args": ["repositoryfy"],
+            "stopOnEntry": false,
+            "cwd": "${workspaceRoot}",
+            "console": "internalConsole"
+        },
     ]
 }
diff --git a/gulpfile.js b/gulpfile.js
index f2633a8662..c3e9d229f2 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -3,7 +3,7 @@ const fs = require("fs");
 const path = require("path");
 const domino = require('domino');
 const es = require('event-stream');
-const del = require('del');
+const fsExtra = require("fs-extra");
 const tsNode = require('ts-node').register({
     transpileOnly: true,
     compilerOptions: {
@@ -13,6 +13,7 @@ const tsNode = require('ts-node').register({
 });
 const argv = require("yargs").argv;
 
+const submodule = "igniteui-live-editing-samples";
 
 const window = domino.createWindow('<!doctype html><html><body></body></html>');
 global.HTMLElement = window.HTMLElement;
@@ -59,63 +60,114 @@ gulp.task("sass-js-compile-check", async() => {
     var checker = requireFile("./live-editing/services/SassJsCompileChecker.ts");
     await checker.sassJsCompileChecker.run();
 });
-const excludedDirectories = ["data", "index", "assets", "environment"];
-const repositoryfy = (projectPath) => {
+
+const excludedDirectories = ["index", "assets", "environment"];
+
+const getSampleNameFromFileName = (fileName, sampleBaseDir) => fileName.replace(sampleBaseDir + "--", "");
+var assetsRegex = new RegExp("\/?assets\/", "g");
+
+const processApp = (projectPath, dest, directoriesToExclude, compileSass) => {
+    if(!fs.existsSync(submodule)) {
+        return console.error("No submodule found");
+    }
     const directories = [];
+    const appExcludedDirectories = excludedDirectories.concat(directoriesToExclude);
     const appDir = fs.readdirSync(projectPath + "/app", "utf-8");
-    appDir.filter(dir => excludedDirectories.indexOf(dir) === -1 )
+    appDir.filter(dir => appExcludedDirectories.indexOf(dir) === -1 )
           .forEach(child => {
             if(fs.lstatSync(`${projectPath + "/app"}/${child}`).isDirectory()) {
                 directories.push(child);
             }
     });
-    const jsonSamplesPath = path.join(__dirname, `${projectPath}/assets/samples`);
-    const sharedJson = JSON.parse(fs.readFileSync(jsonSamplesPath + "/shared.json"));
-    const devDependencies = JSON.parse(fs.readFileSync("package.json")).devDependencies;
+    const jsonSamplesPath = path.join(__dirname, `${projectPath}/assets/samples${compileSass ? "/css-support" : ""}`);
+    const sharedJson = JSON.parse(fs.readFileSync(path.join(jsonSamplesPath, "/shared.json")));
+    const submoduleAppDest = submodule + `/${dest}/${compileSass ? "css-support/":""}`;
+    if(!fs.existsSync(submoduleAppDest)) {
+        fs.mkdirSync(submoduleAppDest);
+    }
+
+    let i = 0;
     return gulp.src([`${jsonSamplesPath}/*.json`,`!${jsonSamplesPath}/shared.json`, `!${jsonSamplesPath}/meta.json`])
                .pipe(es.map((file, cb) => {
-                   console.log(file.path);
                     fs.readFile(file.path, 'utf-8', (err, content) => {
+                        // Adjust sample application bundle files
                         const jsonObj = JSON.parse(content);
-                        const packageJson = {
+                        const packageJson = 
+                        {
                             "path": "package.json",
                             "hasRelativeAssetsUrls": false,
-                            "content": JSON.stringify({"dependencies": JSON.parse(jsonObj.sampleDependencies), "devDependencies": devDependencies})
+                            "content": JSON.stringify({
+                                    "dependencies": JSON.parse(jsonObj.sampleDependencies),
+                                    "devDependencies": sharedJson.devDependencies }, null, 2)
                         }
                         jsonObj.sampleFiles = jsonObj.sampleFiles.concat(sharedJson.files).concat(packageJson);
-                        const fileName = file.path.substring(file.base.length + 1);
-                        const sampleBase = directories.find(d => {
-                            return fileName.indexOf(d + "-") !== -1 && fileName.indexOf(d + "-") === 0;
-                        })
-                        if(!fs.existsSync("test-angular-samples/samples/" + sampleBase)) {
-                            fs.mkdirSync("test-angular-samples/samples/" + sampleBase);
+
+                        // Configure sample application file structure
+                        const fileName = file.path.substring(file.base.length + 1).replace(".json", "");
+                        let sampleBaseDir = fileName.indexOf("--") !== -1 ? fileName.substring(0, fileName.indexOf("--")) : "";
+                        if(sampleBaseDir && !fs.existsSync(submoduleAppDest + sampleBaseDir)) {
+                            fs.mkdirSync(submoduleAppDest + sampleBaseDir);
                         }
-                        const sampleName = fileName.replace(sampleBase + "-", "").replace(".json", "");
-                        const sampleAppPath = "test-angular-samples/samples/" + sampleBase + "/" + sampleName;
+                        const sampleName = sampleBaseDir ? getSampleNameFromFileName(fileName, sampleBaseDir) : fileName;
+                        const sampleAppPath = submoduleAppDest + sampleBaseDir + "/" + sampleName;
                         if(!fs.existsSync(sampleAppPath)) {
                             fs.mkdirSync(sampleAppPath);
                         }
 
+                        // Distribute Sample Files
                         jsonObj.sampleFiles.forEach(sampleFile => {
+                            let sampleContent;
+                            const isProduction = argv.prod !== undefined && argv.prod.toLowerCase().trim() === "true";
+                            const assetsUrl = `https://${isProduction ? "www." : "staging."}infragistics.com/${dest}/assets/`;
+                            if(sampleFile.hasRelativeAssetsUrls) {
+                                sampleContent = sampleFile.content.replace(assetsRegex, assetsUrl);
+                            } else {
+                                sampleContent = sampleFile.content;
+                            }
                             const paths = sampleFile.path.replace("./", "").split("/");
                             let tempPath = "";
                             paths.forEach(p => {
                                 tempPath += p + "/";
                                 if(p.indexOf(".") !== -1) {
-                                    fs.writeFileSync(sampleAppPath + "/" + tempPath, sampleFile.content);
+                                    fs.writeFileSync(sampleAppPath + "/" + tempPath, sampleContent);
                                 } else
                                 if(!fs.existsSync(sampleAppPath + "/" + tempPath)) {
                                     fs.mkdirSync(sampleAppPath + "/" + tempPath)
                                 }
                             })
                         });
-
+                        i++;
+                        process.stdout.write(`Processing ${fileName}.json with ${compileSass ? "CSS" : "SCSS" } styling`);
+                        process.stdout.clearLine();
+                        process.stdout.cursorTo(0);
                         cb(null, file);
                     })
                }))
-               .on("error", () => console.log(err));
+               .on("error", () => console.log(err))
+               .on("end", () => console.log(`Geneared ${i} with applications ${compileSass ? "CSS" : "SCSS" } in ${dest.toUpperCase()} project.`));
 }
 
-gulp.task("repositoryfy", () => {
-    return repositoryfy("src")
-})
+const processDemosWithScss = () =>  processApp("src", "angular-demos", "data", false);
+const processAppLobWithScss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", false);
+
+const processDemosWithCss = () =>  processApp("src", "angular-demos", "data", true);
+const processAppLobWithCss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", true);
+
+let repositoryfyWithScss;
+let repositoryfyWithCss;
+
+const cleanupSubModule = (cb) => {
+    fsExtra.removeSync(submodule + "/angular-demos");
+    fsExtra.removeSync(submodule + "/angular-demos-lob");
+
+    fsExtra.mkdirSync(submodule + "/angular-demos");
+    fsExtra.mkdirSync(submodule + "/angular-demos-lob");
+    cb();
+
+}
+exports.repositoryfyWithScss = repositoryfyWithScss = gulp.parallel(processDemosWithScss, processAppLobWithScss);
+exports.repositoryfyWithCss = repositoryfyWithCss = gulp.parallel(processDemosWithCss, processAppLobWithCss);
+exports.repositoryfy = gulp.series(cleanupSubModule, gulp.parallel(repositoryfyWithScss, repositoryfyWithCss));
+
+
+
diff --git a/live-editing/generators/SampleAssetsGenerator.ts b/live-editing/generators/SampleAssetsGenerator.ts
index beeba1b2ae..89b4891a76 100644
--- a/live-editing/generators/SampleAssetsGenerator.ts
+++ b/live-editing/generators/SampleAssetsGenerator.ts
@@ -165,7 +165,7 @@ export class SampleAssetsGenerator extends Generator {
         if (sampleRoute === undefined) {
             console.log("Live-Editing - ERROR missing route for " + sampleName);
         } else {
-            sampleRoute = sampleRoute.replace("/", "-") + ".json";
+            sampleRoute = sampleRoute.replace("/", "--") + ".json";
             fs.writeFileSync(this.getAssetsSamplesDir() + sampleRoute, JSON.stringify(sampleDef));
             this._logsSampleFiles += sampleFilesCount;
             this._logsUtilitiesFiles += additionalFiles.length;
diff --git a/live-editing/generators/SharedAssetsGenerator.ts b/live-editing/generators/SharedAssetsGenerator.ts
index 204653c502..1ae58213d5 100644
--- a/live-editing/generators/SharedAssetsGenerator.ts
+++ b/live-editing/generators/SharedAssetsGenerator.ts
@@ -7,7 +7,7 @@ import { LiveEditingFile } from "./misc/LiveEditingFile";
 import { SharedAssetsFile } from "./misc/SharedAssetsFile";
 import { SharedAssetsGeneratorArgs } from "./misc/SharedAssetsGeneratorArgs";
 import { StyleSyntax } from "./misc/StyleSyntax";
-
+import { DevDependencyResolver } from "../services/DependencyResolver";
 const INDEX_FILE_PATH = path.join(__dirname, "../../src/index.html");
 const POLYPFILLS_FILE_PATH = path.join(__dirname, "../../src/polyfills.ts");
 const STYLES_FILE_PATH = path.join(__dirname, "../../src/styles.scss");
@@ -94,7 +94,7 @@ export class SharedAssetsGenerator extends Generator {
              args.appComponentStylesFileContent));
         files.push(new LiveEditingFile(SAMPLE_APP_FOLDER + "app.component.ts", args.appComponentTsFileContent));
 
-        let sharedFile = new SharedAssetsFile(files);
+        let sharedFile = new SharedAssetsFile(files, new DevDependencyResolver().devDependencies);
         fs.writeFileSync(this.getAssetsSamplesDir() + "shared.json", JSON.stringify(sharedFile));
     }
 }
diff --git a/live-editing/generators/misc/SharedAssetsFile.ts b/live-editing/generators/misc/SharedAssetsFile.ts
index 66d5d1a5a6..f1fe45829a 100644
--- a/live-editing/generators/misc/SharedAssetsFile.ts
+++ b/live-editing/generators/misc/SharedAssetsFile.ts
@@ -2,8 +2,9 @@ import { LiveEditingFile } from "./LiveEditingFile";
 
 export class SharedAssetsFile {
     public files: LiveEditingFile[];
-
-    constructor(files: LiveEditingFile[]) {
+    public devDependencies: Object;
+    constructor(files: LiveEditingFile[], devDependencies: Object) {
         this.files = files;
+        this.devDependencies = devDependencies;
     }
 }
diff --git a/live-editing/services/DependencyResolver.ts b/live-editing/services/DependencyResolver.ts
index dd7a3d35fc..cc28005e4f 100644
--- a/live-editing/services/DependencyResolver.ts
+++ b/live-editing/services/DependencyResolver.ts
@@ -7,6 +7,22 @@ import { DependenciesType } from "./DependenciesType";
 
 const PACKAGES_CONFIG_PATH = path.join(__dirname, "../../package.json");
 
+const SHARED_DEV_DEPENDENCIES = {
+    "@angular-devkit/build-angular": "",
+    "@angular/cli": "",
+    "@angular/compiler-cli": "",
+    "@angular/language-service": "",
+    "@types/node": "",
+    "codelyzer": "",
+    "jasmine-core": "",
+    "jasmine-spec-reporter": "",
+    "node-sass": "",
+    "sass.js": "",
+    "ts-node": "",
+    "tslint": "",
+    "typescript": ""
+};
+
 const SHARED_DEPENDENCIES = [
     "@angular/common",
     "@angular/compiler",
@@ -91,6 +107,29 @@ const EXACT_VERSION_PACKAGES = [
     "igniteui-angular-spreadsheet-chart-adapter"
 ];
 
+export class DevDependencyResolver {
+    private _devDependencies;
+
+    constructor() {
+        let packageFile = JSON.parse(fs.readFileSync(PACKAGES_CONFIG_PATH, "utf8"));
+        this._devDependencies = packageFile.devDependencies;
+    }
+
+    public get devDependencies() {
+        const result = {};
+        
+        for (let key in this._devDependencies) {
+            if (key in SHARED_DEV_DEPENDENCIES) {
+                    let version = this._devDependencies[key];
+                    result[key] = version.replace("~", "").replace("^", "");
+            }
+        }
+
+        return result;
+    }
+
+}
+
 export class DependencyResolver {
     private _defaultDependencies: Set<string>;
     private _chartsDependencies: Set<string>;
diff --git a/package.json b/package.json
index ea92e18445..559f996212 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,9 @@
     "start:app-lob:live-editing": "gulp generate-live-editing --css=true --appDv=true && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng serve app-lob --configuration es5 -o --progress=true",
     "start:app-lob:live-editing:noCss": "gulp generate-live-editing --appDv=true && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng serve app-lob --configuration es5 -o --progress=true",
     "build-ci": "gulp overwrite-package-json && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build --prod --progress=true",
-    "build-ci:app-lob": "gulp overwrite-package-json && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build app-lob --prod --progress=true"
+    "build-ci:app-lob": "gulp overwrite-package-json && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build app-lob --prod --progress=true",
+    "repositoryfy": "gulp repositoryfy",
+    "repositoryfy:prod": "gulp repositoryfy --prod=true"
   },
   "repository": {
     "type": "git",

From 1e88eb089251c6bd1e029e76dcba6ce97c508e49 Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 11:37:48 +0300
Subject: [PATCH 11/35] install deps

---
 package-lock.json | 90 +++++++++++++++++------------------------------
 1 file changed, 32 insertions(+), 58 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 19d9f44e08..ad044c3891 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2849,8 +2849,7 @@
     "array-uniq": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-      "dev": true
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
     },
     "array-unique": {
       "version": "0.3.2",
@@ -4922,18 +4921,11 @@
       },
       "dependencies": {
         "array-union": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-          "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-          "dev": true
-        },
-        "dir-glob": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
-          "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==",
-          "dev": true,
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+          "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
           "requires": {
-            "path-type": "^4.0.0"
+            "array-uniq": "^1.0.1"
           }
         },
         "globby": {
@@ -4950,6 +4942,14 @@
             "ignore": "^5.1.1",
             "merge2": "^1.2.3",
             "slash": "^3.0.0"
+          },
+          "dependencies": {
+            "array-union": {
+              "version": "2.1.0",
+              "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+              "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+              "dev": true
+            }
           }
         },
         "ignore": {
@@ -4958,11 +4958,19 @@
           "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==",
           "dev": true
         },
+        "p-map": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz",
+          "integrity": "sha512-d3qXVTF/s+W+CdJ5A29wywV2n8CQQYahlgz2bFiA+4eVNJbHJodPZ+/gXwPGh0bOqA+j8S+6+ckmvLGPk1QpxQ==",
+          "dev": true,
+          "requires": {
+            "aggregate-error": "^3.0.0"
+          }
+        },
         "path-type": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
-          "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-          "dev": true
+          "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw=="
         },
         "slash": {
           "version": "3.0.0",
@@ -15905,6 +15913,15 @@
             }
           }
         },
+        "array-union": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+          "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
+          "dev": true,
+          "requires": {
+            "array-uniq": "^1.0.1"
+          }
+        },
         "binary-extensions": {
           "version": "1.13.1",
           "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.13.1.tgz",
@@ -15960,28 +15977,6 @@
             "upath": "^1.1.1"
           }
         },
-        "cliui": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
-          "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
-          "dev": true,
-          "requires": {
-            "string-width": "^3.1.0",
-            "strip-ansi": "^5.2.0",
-            "wrap-ansi": "^5.1.0"
-          },
-          "dependencies": {
-            "strip-ansi": {
-              "version": "5.2.0",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
-              "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
-              "dev": true,
-              "requires": {
-                "ansi-regex": "^4.1.0"
-              }
-            }
-          }
-        },
         "del": {
           "version": "4.1.1",
           "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
@@ -15997,15 +15992,6 @@
             "rimraf": "^2.6.3"
           }
         },
-        "extend-shallow": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
-          "dev": true,
-          "requires": {
-            "is-extendable": "^0.1.0"
-          }
-        },
         "fill-range": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
@@ -16144,12 +16130,6 @@
           "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
           "dev": true
         },
-        "p-try": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
-          "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
-          "dev": true
-        },
         "readdirp": {
           "version": "2.2.1",
           "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
@@ -16161,12 +16141,6 @@
             "readable-stream": "^2.0.2"
           }
         },
-        "require-main-filename": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
-          "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
-          "dev": true
-        },
         "rimraf": {
           "version": "2.7.1",
           "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",

From 49d97ea30167d772295b5a06b347fc8b6a875994 Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 11:38:11 +0300
Subject: [PATCH 12/35] change gulp log

---
 gulpfile.js       |  2 +-
 package-lock.json | 85 ++---------------------------------------------
 package.json      |  1 -
 3 files changed, 3 insertions(+), 85 deletions(-)

diff --git a/gulpfile.js b/gulpfile.js
index c3e9d229f2..6c0c0304c1 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -144,7 +144,7 @@ const processApp = (projectPath, dest, directoriesToExclude, compileSass) => {
                     })
                }))
                .on("error", () => console.log(err))
-               .on("end", () => console.log(`Geneared ${i} with applications ${compileSass ? "CSS" : "SCSS" } in ${dest.toUpperCase()} project.`));
+               .on("end", () => console.log(`Geneared ${i} applications with ${compileSass ? "CSS" : "SCSS" } in ${dest.toUpperCase()} project.`));
 }
 
 const processDemosWithScss = () =>  processApp("src", "angular-demos", "data", false);
diff --git a/package-lock.json b/package-lock.json
index ad044c3891..befd6e642b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2849,7 +2849,8 @@
     "array-uniq": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
+      "dev": true
     },
     "array-unique": {
       "version": "0.3.2",
@@ -4904,82 +4905,6 @@
         }
       }
     },
-    "del": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz",
-      "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==",
-      "dev": true,
-      "requires": {
-        "globby": "^10.0.1",
-        "graceful-fs": "^4.2.2",
-        "is-glob": "^4.0.1",
-        "is-path-cwd": "^2.2.0",
-        "is-path-inside": "^3.0.1",
-        "p-map": "^3.0.0",
-        "rimraf": "^3.0.0",
-        "slash": "^3.0.0"
-      },
-      "dependencies": {
-        "array-union": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-          "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
-          "requires": {
-            "array-uniq": "^1.0.1"
-          }
-        },
-        "globby": {
-          "version": "10.0.2",
-          "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.2.tgz",
-          "integrity": "sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==",
-          "dev": true,
-          "requires": {
-            "@types/glob": "^7.1.1",
-            "array-union": "^2.1.0",
-            "dir-glob": "^3.0.1",
-            "fast-glob": "^3.0.3",
-            "glob": "^7.1.3",
-            "ignore": "^5.1.1",
-            "merge2": "^1.2.3",
-            "slash": "^3.0.0"
-          },
-          "dependencies": {
-            "array-union": {
-              "version": "2.1.0",
-              "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-              "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-              "dev": true
-            }
-          }
-        },
-        "ignore": {
-          "version": "5.1.8",
-          "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz",
-          "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==",
-          "dev": true
-        },
-        "p-map": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz",
-          "integrity": "sha512-d3qXVTF/s+W+CdJ5A29wywV2n8CQQYahlgz2bFiA+4eVNJbHJodPZ+/gXwPGh0bOqA+j8S+6+ckmvLGPk1QpxQ==",
-          "dev": true,
-          "requires": {
-            "aggregate-error": "^3.0.0"
-          }
-        },
-        "path-type": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
-          "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw=="
-        },
-        "slash": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-          "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
-          "dev": true
-        }
-      }
-    },
     "delayed-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -8160,12 +8085,6 @@
         }
       }
     },
-    "is-path-inside": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.2.tgz",
-      "integrity": "sha512-/2UGPSgmtqwo1ktx8NDHjuPwZWmHhO+gj0f93EkhLB5RgW9RZevWYYlIkS6zePc6U2WpOdQYIwHe9YC4DWEBVg==",
-      "dev": true
-    },
     "is-plain-obj": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
diff --git a/package.json b/package.json
index 559f996212..ff61a334e7 100644
--- a/package.json
+++ b/package.json
@@ -83,7 +83,6 @@
     "@types/jasminewd2": "^2.0.8",
     "@types/node": "^13.9.3",
     "codelyzer": "^5.2.1",
-    "del": "^5.1.0",
     "event-stream": "^4.0.1",
     "fs-extra": "^8.1.0",
     "gulp": "^4.0.2",

From db02225968bd7305d287be2dda5c98c04cc2fdf2 Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 11:39:49 +0300
Subject: [PATCH 13/35] adjust lock deps

---
 package-lock.json | 60 +++++++++++++++++++----------------------------
 1 file changed, 24 insertions(+), 36 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index befd6e642b..23be50bf05 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2072,32 +2072,6 @@
         }
       }
     },
-    "@nodelib/fs.scandir": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz",
-      "integrity": "sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==",
-      "dev": true,
-      "requires": {
-        "@nodelib/fs.stat": "2.0.3",
-        "run-parallel": "^1.1.9"
-      }
-    },
-    "@nodelib/fs.stat": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz",
-      "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==",
-      "dev": true
-    },
-    "@nodelib/fs.walk": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz",
-      "integrity": "sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==",
-      "dev": true,
-      "requires": {
-        "@nodelib/fs.scandir": "2.1.3",
-        "fastq": "^1.6.0"
-      }
-    },
     "@schematics/angular": {
       "version": "10.0.0",
       "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-10.0.0.tgz",
@@ -9496,16 +9470,6 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=",
       "dev": true
     },
-    "micromatch": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz",
-      "integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==",
-      "dev": true,
-      "requires": {
-        "braces": "^3.0.1",
-        "picomatch": "^2.0.5"
-      }
-    },
     "miller-rabin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
@@ -12901,6 +12865,30 @@
       "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==",
       "dev": true
     },
+    "rework": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/rework/-/rework-1.0.1.tgz",
+      "integrity": "sha1-MIBqhBNCtUUQqkEQhQzUhTQUSqc=",
+      "dev": true,
+      "requires": {
+        "convert-source-map": "^0.3.3",
+        "css": "^2.0.0"
+      },
+      "dependencies": {
+        "convert-source-map": {
+          "version": "0.3.5",
+          "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-0.3.5.tgz",
+          "integrity": "sha1-8dgClQr33SYxof6+BZZVDIarMZA=",
+          "dev": true
+        }
+      }
+    },
+    "rework-visit": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/rework-visit/-/rework-visit-1.0.0.tgz",
+      "integrity": "sha1-mUWygD8hni96ygCtuLyfZA+ELJo=",
+      "dev": true
+    },
     "rfdc": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.1.4.tgz",

From c96cf45f3307361f5954eb1cda9d5edb6c0e2561 Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Fri, 26 Jun 2020 13:02:04 +0300
Subject: [PATCH 14/35] distribute repo tasks

---
 gulpfile.js  | 24 ++++++++++++------------
 package.json |  6 ++++--
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/gulpfile.js b/gulpfile.js
index 6c0c0304c1..964fdb2ef0 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -148,26 +148,26 @@ const processApp = (projectPath, dest, directoriesToExclude, compileSass) => {
 }
 
 const processDemosWithScss = () =>  processApp("src", "angular-demos", "data", false);
-const processAppLobWithScss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", false);
+const processDemosLobWithScss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", false);
 
 const processDemosWithCss = () =>  processApp("src", "angular-demos", "data", true);
-const processAppLobWithCss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", true);
+const processDemosLobWithCss = () => processApp("projects/app-lob/src", "angular-demos-lob", "services", true);
 
-let repositoryfyWithScss;
-let repositoryfyWithCss;
+let repositoryfyAngularDemos;
+let repositoryfyAngularDemosLob;
 
-const cleanupSubModule = (cb) => {
+const cleanupAngularDemos = (cb) => {
     fsExtra.removeSync(submodule + "/angular-demos");
-    fsExtra.removeSync(submodule + "/angular-demos-lob");
-
     fsExtra.mkdirSync(submodule + "/angular-demos");
-    fsExtra.mkdirSync(submodule + "/angular-demos-lob");
     cb();
-
 }
-exports.repositoryfyWithScss = repositoryfyWithScss = gulp.parallel(processDemosWithScss, processAppLobWithScss);
-exports.repositoryfyWithCss = repositoryfyWithCss = gulp.parallel(processDemosWithCss, processAppLobWithCss);
-exports.repositoryfy = gulp.series(cleanupSubModule, gulp.parallel(repositoryfyWithScss, repositoryfyWithCss));
 
+const cleanupAngularDemosLob = (cb) => {
+    fsExtra.removeSync(submodule + "/angular-demos-lob");
+    fsExtra.mkdirSync(submodule + "/angular-demos-lob");
+    cb();
+}
+exports.repositoryfyAngularDemos = repositoryfyAngularDemos = gulp.series(cleanupAngularDemos, gulp.parallel(processDemosWithScss, processDemosWithCss));
+exports.repositoryfyAngularDemosLob = repositoryfyAngularDemosLob =  gulp.series(cleanupAngularDemosLob, gulp.parallel(processDemosLobWithScss, processDemosLobWithCss));
 
 
diff --git a/package.json b/package.json
index ff61a334e7..2ef93c9cf8 100644
--- a/package.json
+++ b/package.json
@@ -29,8 +29,10 @@
     "start:app-lob:live-editing:noCss": "gulp generate-live-editing --appDv=true && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng serve app-lob --configuration es5 -o --progress=true",
     "build-ci": "gulp overwrite-package-json && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build --prod --progress=true",
     "build-ci:app-lob": "gulp overwrite-package-json && node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build app-lob --prod --progress=true",
-    "repositoryfy": "gulp repositoryfy",
-    "repositoryfy:prod": "gulp repositoryfy --prod=true"
+    "repositoryfyAngularDemos": "gulp repositoryfyAngularDemos",
+    "repositoryfyAngularDemos:prod": "gulp repositoryfyAngularDemos --prod=true",
+    "repositoryfyAngularDemosLob": "gulp repositoryfyAngularDemosLob",
+    "repositoryfyAngularDemosLob:prod": "gulp repositoryfyAngularDemosLob --prod=true"
   },
   "repository": {
     "type": "git",

From 7f55f4dc20d8b526bf0372f5f11f36d4607e443b Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 12:37:31 +0300
Subject: [PATCH 15/35] update log

---
 gulpfile.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/gulpfile.js b/gulpfile.js
index 964fdb2ef0..ade39322fd 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -137,9 +137,7 @@ const processApp = (projectPath, dest, directoriesToExclude, compileSass) => {
                             })
                         });
                         i++;
-                        process.stdout.write(`Processing ${fileName}.json with ${compileSass ? "CSS" : "SCSS" } styling`);
-                        process.stdout.clearLine();
-                        process.stdout.cursorTo(0);
+                        console.log(`Processing ${fileName}.json with ${compileSass ? "CSS" : "SCSS" } styling`);
                         cb(null, file);
                     })
                }))

From bd44296f7eb245e9b9b417d6226c359830306cdf Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Wed, 8 Jul 2020 13:01:18 +0300
Subject: [PATCH 16/35] change submodule branch

---
 .gitmodules | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitmodules b/.gitmodules
index 71b7559a72..b1d54c9c79 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,4 +1,4 @@
 [submodule "igniteui-live-editing-samples"]
 	path = igniteui-live-editing-samples
 	url = https://github.com/IgniteUI/igniteui-live-editing-samples
-    branch = vNext
\ No newline at end of file
+    branch = master
\ No newline at end of file

From 309b9310aff5eb3778be9880e5826c4517fcf602 Mon Sep 17 00:00:00 2001
From: HristoP96 <HPopov@infragistics.com>
Date: Fri, 10 Jul 2020 15:19:33 +0300
Subject: [PATCH 17/35] Fix grid samples with custom summaries for codesandbox
 (master)

---
 .../grid/grid-boston-marathon/grid.component.ts | 17 +++--------------
 .../grid-allData-summary.component.ts           |  5 +----
 ...grid-custom-summaries-selection.component.ts |  7 ++-----
 .../grid-displaydensity-sample.component.ts     |  8 ++------
 .../grid-groupby-summary-sample.component.ts    | 12 ++----------
 ...-groupby-summary-styling-sample.component.ts |  5 +----
 .../grid-sample-3/grid-sample-3.component.ts    |  8 ++------
 .../grid-save-state/grid-state.component.ts     |  8 ++------
 ...erarchical-grid-allData-summary.component.ts | 14 +++-----------
 .../hierarchical-grid-editing.component.ts      |  6 +-----
 ...erarchical-grid-summary-styling.component.ts | 12 ++----------
 .../hierarchical-grid-summary.component.ts      | 12 ++----------
 ...tree-grid-displaydensity-sample.component.ts |  7 ++-----
 .../tree-grid-editing-sample.component.ts       |  7 ++-----
 .../tree-grid-summary2-sample.component.ts      |  6 +-----
 .../treegrid-allData-summary.component.ts       |  6 +-----
 16 files changed, 29 insertions(+), 111 deletions(-)

diff --git a/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts b/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts
index e0f9b5b08f..b055d94ede 100644
--- a/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts
+++ b/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts
@@ -206,11 +206,8 @@ export class GridComponent implements OnInit, OnDestroy {
     }
 }
 
-class CustomTopSpeedSummary extends IgxNumberSummaryOperand {
+class CustomTopSpeedSummary {
 
-    constructor() {
-        super();
-    }
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
@@ -224,11 +221,7 @@ class CustomTopSpeedSummary extends IgxNumberSummaryOperand {
     }
 }
 
-export class CustomBPMSummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-        super();
-    }
+export class CustomBPMSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
@@ -243,11 +236,7 @@ export class CustomBPMSummary extends IgxNumberSummaryOperand {
     }
 }
 
-export class CustomSpeedSummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-        super();
-    }
+export class CustomSpeedSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         data = data.reduce((acc, val) => acc.concat(val), []).map(rec => rec.Speed);
diff --git a/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts
index f1a95a0ca4..0371dd7ed9 100644
--- a/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts
+++ b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts
@@ -5,11 +5,8 @@ import {
     IgxSummaryResult } from "igniteui-angular";
 import { DATA } from "../../data/nwindData";
 
-class DiscontinuedSummary extends IgxNumberSummaryOperand {
+class DiscontinuedSummary {
 
-  constructor() {
-    super();
-  }
 
   public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] {
     const result = [];
diff --git a/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts b/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts
index d53dffdba9..3b0b2084a0 100644
--- a/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts
+++ b/src/app/grid/grid-custom-summaries-selection/grid-custom-summaries-selection.component.ts
@@ -4,13 +4,10 @@ import { IgxDateSummaryOperand, IgxGridComponent, IgxNumberSummaryOperand,
     IgxSummaryOperand, IgxSummaryResult } from "igniteui-angular";
 import { DATA } from "../../data/nwindData";
 
-class MySummary extends IgxSummaryOperand {
+class MySummary {
 
-    constructor() {
-        super();
-    }
     public operate(data: any[] = []): IgxSummaryResult[] {
-        const result = super.operate(data);
+        const result = new IgxSummaryOperand().operate(data);
         if (data.length < 1) { return result; }
         const numberData = data.filter(rec => typeof rec === "number");
         const boolData = data.filter(rec => typeof rec === "boolean");
diff --git a/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts b/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts
index eecd2592cb..68976867b8 100644
--- a/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts
+++ b/src/app/grid/grid-displaydensity-sample/grid-displaydensity-sample.component.ts
@@ -3,13 +3,9 @@ import { IgxButtonGroupComponent, IgxGridComponent, IgxNumberSummaryOperand,
     IgxSummaryOperand, IgxSummaryResult } from "igniteui-angular";
 import { INVOICE_DATA } from "../../data/invoiceData";
 
-class CustomNumberSummary extends IgxSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class CustomNumberSummary {
     public operate(data?: any[]): IgxSummaryResult[] {
-      const result = super.operate(data);
+      const result = new IgxSummaryOperand().operate(data);
       result.push({
         key: "Min",
         label: "Min",
diff --git a/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts b/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts
index 8c1307b9ee..45bc1f4163 100644
--- a/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts
+++ b/src/app/grid/grid-groupby-summary-sample/grid-groupby-summary-sample.component.ts
@@ -12,11 +12,7 @@ import {
 } from "igniteui-angular";
 import { INVOICE_DATA } from "../../data/invoiceData";
 
-class AvgSummary extends IgxSummaryOperand {
-
-    constructor() {
-        super();
-    }
+class AvgSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
@@ -30,11 +26,7 @@ class AvgSummary extends IgxSummaryOperand {
     }
 }
 
-class SumSummary extends IgxSummaryOperand {
-
-    constructor() {
-        super();
-    }
+class SumSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts b/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts
index 7cd52cda4a..e6db0bb62c 100644
--- a/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts
+++ b/src/app/grid/grid-groupby-summary-styling-sample/grid-groupby-summary-styling-sample.component.ts
@@ -12,11 +12,8 @@ import {
 } from "igniteui-angular";
 import { INVOICE_DATA } from "../../data/invoiceData";
 
-class CustomSummary extends IgxSummaryOperand {
+class CustomSummary {
 
-    constructor() {
-        super();
-    }
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/grid/grid-sample-3/grid-sample-3.component.ts b/src/app/grid/grid-sample-3/grid-sample-3.component.ts
index aa7ebbed33..5649f3985d 100644
--- a/src/app/grid/grid-sample-3/grid-sample-3.component.ts
+++ b/src/app/grid/grid-sample-3/grid-sample-3.component.ts
@@ -6,14 +6,10 @@ import {
     IgxSummaryResult } from "igniteui-angular";
 import { DATA } from "../../data/nwindData";
 
-class MySummary extends IgxNumberSummaryOperand {
-
-  constructor() {
-    super();
-  }
+class MySummary  {
 
   public operate(data?: any[]): IgxSummaryResult[] {
-    const result = super.operate(data);
+    const result = new IgxNumberSummaryOperand().operate(data);
     result.push({
       key: "test",
       label: "Test",
diff --git a/src/app/grid/grid-save-state/grid-state.component.ts b/src/app/grid/grid-save-state/grid-state.component.ts
index 4a6eafa5db..505a5dcc13 100644
--- a/src/app/grid/grid-save-state/grid-state.component.ts
+++ b/src/app/grid/grid-save-state/grid-state.component.ts
@@ -7,14 +7,10 @@ import { FilteringExpressionsTree, FilteringLogic, IGridState, IGroupingState,
 import { take } from "rxjs/operators";
 import { employeesData } from "./localData";
 
-class MySummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-        super();
-    }
+class MySummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
-        const result = super.operate(data);
+        const result = new IgxNumberSummaryOperand().operate(data);
         result.push({
             key: "test",
             label: "Test",
diff --git a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts
index 519cd51702..54566d8da3 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts
@@ -5,25 +5,17 @@ import { IgxHierarchicalGridComponent,
     IgxSummaryResult } from "igniteui-angular";
 import { SINGERS } from "../data";
 
-class CustomNumberSummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class CustomNumberSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
-        const result = super.operate(data);
+        const result = new IgxNumberSummaryOperand().operate(data);
         result.pop();
         result.pop();
         return result;
     }
 }
 
-class GrammySummary extends IgxSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class GrammySummary {
 
     public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts b/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts
index 55b53ba350..2b8060fa6e 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-editing/hierarchical-grid-editing.component.ts
@@ -6,11 +6,7 @@ import {
 import { SINGERS } from "../data";
 import { Singer } from "../models";
 
-class MySummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-        super();
-    }
+class MySummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts b/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts
index 3901b59ba5..b0c5dd32d8 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-summary-styling/hierarchical-grid-summary-styling.component.ts
@@ -3,11 +3,7 @@ import { IgxNumberSummaryOperand,
     IgxSummaryResult } from "igniteui-angular";
 import { SINGERS } from "../data";
 
-class MySummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class MySummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
@@ -30,11 +26,7 @@ class MySummary extends IgxNumberSummaryOperand {
         return result;
     }
 }
-class MyChildSummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class MyChildSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts b/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts
index c103cd1eff..f1b96485f7 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-summary/hierarchical-grid-summary.component.ts
@@ -3,11 +3,7 @@ import { IgxHierarchicalGridComponent, IgxNumberSummaryOperand,
     IgxSummaryResult } from "igniteui-angular";
 import { SINGERS } from "../data";
 
-class MySummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class MySummary  {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
@@ -30,11 +26,7 @@ class MySummary extends IgxNumberSummaryOperand {
         return result;
     }
 }
-class MyChildSummary extends IgxNumberSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class MyChildSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts b/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts
index e912528801..f7fde313ca 100644
--- a/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts
+++ b/src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component.ts
@@ -4,13 +4,10 @@ import {
 } from "igniteui-angular";
 import { generateEmployeeDetailedFlatData } from "../data/employees-flat-detailed";
 
-class CustomNumberSummary extends IgxSummaryOperand {
+class CustomNumberSummary {
 
-    constructor() {
-        super();
-    }
     public operate(data?: any[]): IgxSummaryResult[] {
-        const result = super.operate(data);
+        const result = new IgxSummaryOperand().operate(data);
         result.push({
             key: "Min",
             label: "Min",
diff --git a/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts b/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts
index c042484aee..f3a224778b 100644
--- a/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts
+++ b/src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component.ts
@@ -5,13 +5,10 @@ import {
 import { generateEmployeeFlatData } from "../data/employees-flat";
 import { Employee } from "./employee";
 
-class CustomNumberSummary extends IgxSummaryOperand {
+class CustomNumberSummary {
 
-    constructor() {
-        super();
-    }
     public operate(data?: any[]): IgxSummaryResult[] {
-        const result = super.operate(data);
+        const result = new IgxSummaryOperand().operate(data);
         result.push({
             key: "Min",
             label: "Min",
diff --git a/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts b/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts
index ad66a8908e..b9a41f6271 100644
--- a/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts
+++ b/src/app/tree-grid/tree-grid-summary2-sample/tree-grid-summary2-sample.component.ts
@@ -12,11 +12,7 @@ import {
 } from "igniteui-angular";
 import { FOODS_DATA } from "../data/foods";
 
-class AvgSummary extends IgxSummaryOperand {
-
-    constructor() {
-        super();
-    }
+class AvgSummary {
 
     public operate(data?: any[]): IgxSummaryResult[] {
         const result = [];
diff --git a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts
index b5ae419e72..e2d41e87f3 100644
--- a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts
+++ b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts
@@ -2,11 +2,7 @@ import { Component, OnInit, ViewChild } from "@angular/core";
 import { IgxSummaryOperand, IgxSummaryResult, IgxTreeGridComponent  } from "igniteui-angular";
 import { generateEmployeeFlatData } from "../data/employees-flat";
 
-class PTOSummary extends IgxSummaryOperand {
-
-    constructor() {
-      super();
-    }
+class PTOSummary {
 
     public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] {
       const result = [];

From 716a21b918da5c12ea7e5a7426372972591a58e7 Mon Sep 17 00:00:00 2001
From: Hristo Anastasov <HAnastasov@infragistics.com>
Date: Fri, 10 Jul 2020 15:54:04 +0300
Subject: [PATCH 18/35] Add calendar events sample

---
 .../calendar-sample-3.component.html          | 18 +++++---
 .../calendar-sample-3.component.scss          | 46 +++++++++++++++----
 .../calendar-sample-3.component.ts            | 27 ++++++++---
 3 files changed, 69 insertions(+), 22 deletions(-)

diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
index 8e24ce2e8d..461853d9d4 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
@@ -1,6 +1,12 @@
-<article class="sample-column calendar-wrapper">
-    <igx-calendar #calendar selection="range" (onSelection)="verifyRange($event)"></igx-calendar>
-    <igx-dialog #alert title="Notification" message="Please select a range of up to 5 days!" leftButtonLabel="OK"
-        (onLeftButtonSelect)="alert.close()">
-    </igx-dialog>
-</article>
+<div class="calendar-section">
+    <article class="calendar-wrapper">
+        <igx-calendar #calendar selection="multi" (onSelection)="onSelection($event)" (onViewDateChanged)="viewDateChanged($event)" (onActiveViewChanged)="activeViewChanged($event)"></igx-calendar>
+    </article>
+</div>
+<div class="calendar-section" style="width: calc(100% - 324px)">
+    <div class="selected-data-area">
+        <div class="logger">
+            <span>Interact with the calendar to see the events logged here in sequence:</span><br>
+        </div>
+    </div>
+</div>
diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
index f195a05e7c..2f1f56ff7a 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
@@ -1,11 +1,37 @@
-.calendar-wrapper {
-    max-width: 700px;
-    min-width: 200px;
-    margin: 8px;
-}
-
 .igx-calendar{
-   box-shadow: 0 1px 3px 0 rgba(0,0,0,.26),
-   0 1px 1px 0 rgba(0,0,0,.12),
-   0 2px 1px -1px rgba(0,0,0,.08);
-}
+    box-shadow: 0 1px 3px 0 rgba(0,0,0,.26),
+    0 1px 1px 0 rgba(0,0,0,.12),
+    0 2px 1px -1px rgba(0,0,0,.08);
+ }
+ 
+ :host {
+     display: flex;
+     width: 100%;
+     flex-flow: row wrap;
+ }
+ 
+ button {
+     margin: 8px 0px;
+ }
+ 
+ .calendar-wrapper {
+     width: 300px;
+     margin: 8px;
+ }
+ 
+ .calendar-section {
+     height: 383px;
+ }
+ 
+ .selected-data-area{
+     overflow-y: auto;
+     max-height: 500px;
+     width: 100%;
+     height: 100%;
+     box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
+     margin-top: 8px;
+ }
+ 
+ .logger {
+     padding: 0.2rem 0.4rem;
+ }
diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
index 3d2547d6c4..66ec891f5e 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
@@ -1,5 +1,6 @@
 import { Component, ViewChild } from "@angular/core";
-import { IgxCalendarComponent, IgxDialogComponent } from "igniteui-angular";
+import { IgxCalendarComponent, IgxDialogComponent, CalendarView } from "igniteui-angular";
+import { IViewDateChangeEventArgs } from "igniteui-angular/lib/calendar/calendar-base";
 
 @Component({
   selector: "app-calendar",
@@ -11,10 +12,24 @@ export class CalendarSample3Component {
     @ViewChild("calendar", { static: true }) public calendar: IgxCalendarComponent;
     @ViewChild("alert", { static: true }) public dialog: IgxDialogComponent;
 
-    public verifyRange(dates: Date[]) {
-      if (dates.length > 5) {
-        this.calendar.selectDate(dates[0]);
-        this.dialog.open();
-      }
+    public onSelection(dates: Date[]) {
+      const logger: HTMLElement = document.querySelector(".logger");
+      logger.innerHTML += `<span>'onSelectionChanged': ${dates.length} dates selected.<br>`;
+    }
+
+    public viewDateChanged(event: IViewDateChangeEventArgs) {
+        const logger: HTMLElement = document.querySelector(".logger");
+        const eventArgs = `event.prevousValue: ${this.parseDate(event.previousValue)} | event.currentValue: ${this.parseDate(event.currentValue)}`;
+        logger.innerHTML += `<span>'onViewDateChanged': ${eventArgs}</span><br>`;
+    }
+
+    public activeViewChanged(event: CalendarView) {
+        const logger: HTMLElement = document.querySelector(".logger");
+        logger.innerHTML += `<span>'onActiveViewChanged':. Active view is: ${CalendarView[event]}</span><br>`;
+    }
+
+    private parseDate(date: Date) {
+        const monthFormatter = new Intl.DateTimeFormat("en", { month: "long" });
+        return `${monthFormatter.format(date)} ${date.getFullYear()}`;
     }
 }

From b47775fb889b881bc0171e05bcc73922a7c2629e Mon Sep 17 00:00:00 2001
From: Hristo Anastasov <HAnastasov@infragistics.com>
Date: Wed, 15 Jul 2020 11:59:34 +0300
Subject: [PATCH 19/35] use event names without on prefix

---
 .../calendar-sample-3/calendar-sample-3.component.html        | 2 +-
 .../calendar/calendar-sample-3/calendar-sample-3.component.ts | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
index 461853d9d4..0dd94a97d1 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
@@ -1,6 +1,6 @@
 <div class="calendar-section">
     <article class="calendar-wrapper">
-        <igx-calendar #calendar selection="multi" (onSelection)="onSelection($event)" (onViewDateChanged)="viewDateChanged($event)" (onActiveViewChanged)="activeViewChanged($event)"></igx-calendar>
+        <igx-calendar #calendar selection="multi" (onSelection)="onSelection($event)" (viewDateChanged)="viewDateChanged($event)" (activeViewChanged)="activeViewChanged($event)"></igx-calendar>
     </article>
 </div>
 <div class="calendar-section" style="width: calc(100% - 324px)">
diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
index 66ec891f5e..fb504868b7 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
@@ -20,12 +20,12 @@ export class CalendarSample3Component {
     public viewDateChanged(event: IViewDateChangeEventArgs) {
         const logger: HTMLElement = document.querySelector(".logger");
         const eventArgs = `event.prevousValue: ${this.parseDate(event.previousValue)} | event.currentValue: ${this.parseDate(event.currentValue)}`;
-        logger.innerHTML += `<span>'onViewDateChanged': ${eventArgs}</span><br>`;
+        logger.innerHTML += `<span>'viewDateChanged': ${eventArgs}</span><br>`;
     }
 
     public activeViewChanged(event: CalendarView) {
         const logger: HTMLElement = document.querySelector(".logger");
-        logger.innerHTML += `<span>'onActiveViewChanged':. Active view is: ${CalendarView[event]}</span><br>`;
+        logger.innerHTML += `<span>'activeViewChanged':. Active view is: ${CalendarView[event]}</span><br>`;
     }
 
     private parseDate(date: Date) {

From 1d0454f1c6e2ca272a9bd476c1a39e6ad8352a1d Mon Sep 17 00:00:00 2001
From: Aleksandar Kamenov <aleksandyr.kamenov@gmail.com>
Date: Mon, 20 Jul 2020 14:38:31 +0300
Subject: [PATCH 20/35] fix(kbnav-sample): remove expandable cell ref Closes
 #2133

---
 .../grid-keyboardnav-sample.component.ts                     | 5 ++---
 .../hgrid-keyboard-guide.component.ts                        | 5 ++---
 .../tgrid-keyboardnav-guide.component.ts                     | 5 ++---
 3 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts
index aad86c6dc0..40ff8376dd 100644
--- a/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts
+++ b/src/app/grid/grid-keyboardnav-guide-sample/grid-keyboardnav-sample.component.ts
@@ -9,7 +9,6 @@ import {
     IgxListComponent,
     SortingDirection
 } from "igniteui-angular";
-import { IgxGridExpandableCellComponent } from "igniteui-angular/lib/grids/grid/expandable-cell.component";
 import { Subject } from "rxjs";
 import { takeUntil } from "rxjs/operators";
 import { DATA } from "../../data/customers";
@@ -378,7 +377,7 @@ export class GridKeyboardnavGuide implements OnInit, OnDestroy {
 
     }
 
-    public toggleCellCombinations(cell?: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public toggleCellCombinations(cell?: IgxGridCellComponent) {
         if (this._keyboardHandler.gridSection !== GridSection.TBODY) {
             return;
         }
@@ -440,7 +439,7 @@ export class GridKeyboardnavGuide implements OnInit, OnDestroy {
         return res;
     }
 
-    public extractCellActions(cell: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public extractCellActions(cell: IgxGridCellComponent) {
         const res = [];
         if (cell.editable) {
             res.push(ItemAction.Editable);
diff --git a/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts b/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts
index 61a440fced..925e30795e 100644
--- a/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts
+++ b/src/app/hierarchical-grid/hgrid-keybarod-nav-guide-sample/hgrid-keyboard-guide.component.ts
@@ -8,7 +8,6 @@ import {
     IgxHierarchicalGridComponent,
     IgxListComponent
 } from "igniteui-angular";
-import { IgxGridExpandableCellComponent } from "igniteui-angular/lib/grids/grid/expandable-cell.component";
 import { fromEvent, Subject } from "rxjs";
 import { takeUntil } from "rxjs/operators";
 import { CUSTOMERS } from "../data";
@@ -424,7 +423,7 @@ export class GridUnderManagement {
 
     }
 
-    public toggleCellCombinations(cell?: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public toggleCellCombinations(cell?: IgxGridCellComponent) {
         if (this.keyboardHandler.gridSection !== GridSection.TBODY) {
             return;
         }
@@ -458,7 +457,7 @@ export class GridUnderManagement {
         return res;
     }
 
-    public extractCellActions(cell: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public extractCellActions(cell: IgxGridCellComponent) {
         const res = [];
         if (cell.editable) {
             res.push(ItemAction.Editable);
diff --git a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts
index 9c30604e50..d357e7d07d 100644
--- a/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts
+++ b/src/app/tree-grid/tgrid-keyboard-guide/tgrid-keyboardnav-guide.component.ts
@@ -9,7 +9,6 @@ import {
     IgxOverlayService,
     IgxTreeGridComponent
 } from "igniteui-angular";
-import { IgxGridExpandableCellComponent } from "igniteui-angular/lib/grids/grid/expandable-cell.component";
 import { Subject } from "rxjs";
 import { takeUntil } from "rxjs/operators";
 import { generateEmployeeDetailedFlatData } from "../data/employees-flat-detailed";
@@ -380,7 +379,7 @@ export class TGridKeyboardnavGuide implements OnInit, OnDestroy {
         this.toggleCellCombinations(cell);
     }
 
-    public toggleCellCombinations(cell?: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public toggleCellCombinations(cell?: IgxGridCellComponent) {
         if (this._keyboardHandler.gridSection !== GridSection.TBODY) {
             return;
         }
@@ -414,7 +413,7 @@ export class TGridKeyboardnavGuide implements OnInit, OnDestroy {
         return res;
     }
 
-    public extractCellActions(cell: IgxGridCellComponent | IgxGridExpandableCellComponent) {
+    public extractCellActions(cell: IgxGridCellComponent) {
         const res = [];
         if (cell.editable) {
             res.push(ItemAction.Editable);

From 9cfebf83aec12b0bc35b1c311bf190d6c7068105 Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <ZKolev@infragistics.com>
Date: Mon, 20 Jul 2020 17:22:53 +0300
Subject: [PATCH 21/35] chore(*): Update to 10.0.5

---
 package-lock.json | 12 +++++++++---
 package.json      |  2 +-
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 23be50bf05..1acdd1b910 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4284,6 +4284,11 @@
         }
       }
     },
+    "core-js-pure": {
+      "version": "3.6.5",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.6.5.tgz",
+      "integrity": "sha512-lacdXOimsiD0QyNf9BC/mxivNJ/ybBGJXQFKzRekp1WTHoVUWsUHEn+2T8GJAzzIhyOuXA+gOxCVN3l+5PLPUA=="
+    },
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
@@ -7484,12 +7489,13 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.0.3",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.3.tgz",
-      "integrity": "sha512-BixuDn9Pl7PFRlNz/CnXF4//KekXAI/5GqGBZ18cJHyGfJNM/WZdJdJu+fDpfdMDQAyFjpt1cGEkHyXmJawsDQ==",
+      "version": "10.0.5",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.5.tgz",
+      "integrity": "sha512-L2SpjQSAERGJyTbOszuVodzMkMYfubimXfkezYZQC37f/4+Hm3IveOihJ7adHS2m4zCxIqYFMvuoDNHC+YvfZw==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
         "@types/jszip": "^3.1.7",
+        "core-js-pure": "^3.6.5",
         "hammerjs": "^2.0.8",
         "igniteui-trial-watermark": "^1.0.3",
         "jszip": "^3.3.0",
diff --git a/package.json b/package.json
index 2ef93c9cf8..6a567966f2 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "10.0.3",
+    "igniteui-angular": "10.0.5",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",

From ec8b5722b7676c43429fb822e1f33d0b5e2aaa21 Mon Sep 17 00:00:00 2001
From: Diyan Dimitrov <ddimitrov@infragistics.com>
Date: Wed, 22 Jul 2020 12:59:29 +0300
Subject: [PATCH 22/35] sampes(dockmanager): update dockmanager to 1.0.2

---
 package-lock.json | 6 +++---
 package.json      | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 1acdd1b910..36203662ea 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7543,9 +7543,9 @@
       "integrity": "sha512-PhdsyKC9htE825Wsp9ZuNFk6718vQQeKX6EHfb9r0EuILjGoGvz8uqq/OYJ1KevkAeWZ3eEkGNK/hloJXiIJRw=="
     },
     "igniteui-dockmanager": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/igniteui-dockmanager/-/igniteui-dockmanager-1.0.0.tgz",
-      "integrity": "sha512-wgypjqWih1HUoHKP8IzZBlBmjJZjLUt1Vn8Ee6TvEVThGXeOOCW2zvvLamqhO0aICdj6MLZSKsddPQFe1Km81Q==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/igniteui-dockmanager/-/igniteui-dockmanager-1.0.2.tgz",
+      "integrity": "sha512-rTBEPK/gheXKrKvRSgt0YuhETTV08fUEwx/UaOXzkkoC+qfPF57zTD5rW7XGcM5eSeSBnnx4NBBXgZScNggTWQ==",
       "requires": {
         "igniteui-trial-watermark": "^1.0.2"
       }
diff --git a/package.json b/package.json
index 6a567966f2..ea40ba6811 100644
--- a/package.json
+++ b/package.json
@@ -63,7 +63,7 @@
     "igniteui-angular-maps": "^9.1.2",
     "igniteui-angular-spreadsheet": "^9.1.2",
     "igniteui-angular-spreadsheet-chart-adapter": "^9.1.2",
-    "igniteui-dockmanager": "^1.0.0",
+    "igniteui-dockmanager": "^1.0.2",
     "immediate": "^3.2.3",
     "intl": "^1.2.5",
     "jszip": "^3.1.5",

From 04c6b239f4bc179c9be501cad3bc0f092c873bc8 Mon Sep 17 00:00:00 2001
From: IBarakov <ibarakov@icloud.com>
Date: Mon, 27 Jul 2020 11:54:56 +0300
Subject: [PATCH 23/35] samples(grid): add a sample for grid external outlte

---
 live-editing/configs/GridConfigGenerator.ts   | 13 ++++-
 ...grid-external-outlet-sample.component.html | 49 +++++++++++++++++++
 ...grid-external-outlet-sample.component.scss |  4 ++
 .../grid-external-outlet-sample.component.ts  | 31 ++++++++++++
 src/app/grid/grid-routes-data.ts              |  1 +
 src/app/grid/grids-routing.module.ts          |  6 +++
 src/app/grid/grids.module.ts                  |  2 +
 7 files changed, 105 insertions(+), 1 deletion(-)
 create mode 100644 src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
 create mode 100644 src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.scss
 create mode 100644 src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts

diff --git a/live-editing/configs/GridConfigGenerator.ts b/live-editing/configs/GridConfigGenerator.ts
index 26e3cec5a2..37c4300300 100644
--- a/live-editing/configs/GridConfigGenerator.ts
+++ b/live-editing/configs/GridConfigGenerator.ts
@@ -2,7 +2,7 @@ import { CommonModule } from "@angular/common";
 import { HttpClientModule } from "@angular/common/http";
 import { Router, RouterModule } from "@angular/router";
 // tslint:disable:max-line-length
-import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxComboModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDividerModule, IgxDragDropModule, IgxExcelExporterService, IgxExpansionPanelModule, IgxFocusModule, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxProgressBarModule, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxTabsModule, IgxToastModule, IgxTooltipModule } from "igniteui-angular";
+import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxComboModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDividerModule, IgxDragDropModule, IgxExcelExporterService, IgxExpansionPanelModule, IgxFocusModule, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayOutletDirective, IgxOverlayService, IgxProgressBarModule, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxTabsModule, IgxToastModule, IgxTooltipModule } from "igniteui-angular";
 import { IgxPreventDocumentScrollModule } from "../../src/app/directives/prevent-scroll.directive";
 import { GridColumnGroupSelectionComponent } from "../../src/app/grid/column-group-selection-sample/column-group-selection-sample.component";
 import { GridColumnSelectionComponent } from "../../src/app/grid/column-selection-sample/column-selection-sample.component";
@@ -45,6 +45,7 @@ import { ExcelStyleFilteringSample3Component } from "../../src/app/grid/grid-exc
 import { ExcelStyleFilteringStyleComponent } from "../../src/app/grid/grid-excel-style-filtering-style/grid-excel-style-filtering-style.component";
 import { GridExternalAdvancedFilteringComponent } from "../../src/app/grid/grid-external-advanced-filtering/grid-external-advanced-filtering.component";
 import { GridExternalExcelStyleFilteringComponent } from "../../src/app/grid/grid-external-excel-style-filtering/grid-external-excel-style-filtering.component";
+import { GridExternalOutletComponent } from "../../src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component";
 import { FilteringSampleComponent } from "../../src/app/grid/grid-filtering-sample/grid-filtering-sample.component";
 import { GridFilteringStyleComponent } from "../../src/app/grid/grid-filtering-style/grid-filtering-style.component";
 import { FilteringTemplateSampleComponent } from "../../src/app/grid/grid-filtering-template-sample/grid-filtering-template-sample.component";
@@ -1219,6 +1220,16 @@ export class GridConfigGenerator implements IConfigGenerator {
             })
         }));
 
+        configs.push(new Config({
+            component: GridExternalOutletComponent,
+            additionalFiles: ["/src/app/directives/prevent-scroll.directive.ts", "/src/app/data/nwindData.ts"],
+            appModuleConfig: new AppModuleConfig({
+                imports: [GridExternalOutletComponent, IgxGridModule, IgxOverlayOutletDirective, IgxPreventDocumentScrollModule],
+                ngDeclarations: [GridExternalOutletComponent],
+                ngImports: [IgxPreventDocumentScrollModule, IgxGridModule, IgxOverlayOutletDirective]
+            })
+        }));
+
         return configs;
     }
 }
diff --git a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
new file mode 100644
index 0000000000..af17b58ec4
--- /dev/null
+++ b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
@@ -0,0 +1,49 @@
+<div class="grid__wrapper">
+    <igx-grid igxPreventDocumentScroll #grid1 [data]="data" [autoGenerate]="false" height="480px" width="100%"
+              [allowFiltering]="true" [filterMode]="'excelStyleFilter'"
+              [columnHiding]="true" [columnPinning]="true">
+        <igx-column field="ProductName" header="Product Name" [dataType]="'string'">
+        </igx-column>
+        <igx-column field="QuantityPerUnit" header="Quantity Per Unit" [dataType]="'string'">
+        </igx-column>
+        <igx-column field="UnitPrice" header="Unit Price" dataType="number">
+            <ng-template igxCell let-cell="cell" let-val let-row>
+                {{+val | currency}}
+            </ng-template>
+        </igx-column>
+        <igx-column field="OrderDate" header="Order Date" [dataType]="'date'">
+        </igx-column>
+        <igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'">
+            <ng-template igxCell let-cell="cell" let-val>
+                <img *ngIf="val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
+                <img *ngIf="!val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
+            </ng-template>
+        </igx-column>
+    </igx-grid>
+
+    <br>
+
+    <igx-grid igxPreventDocumentScroll #grid2 [data]="data" [autoGenerate]="false" height="480px" width="100%"
+              [allowFiltering]="true" [filterMode]="'excelStyleFilter'"
+              [columnHiding]="true" [columnPinning]="true">
+        <igx-column field="ProductName" header="Product Name" [dataType]="'string'">
+        </igx-column>
+        <igx-column field="QuantityPerUnit" header="Quantity Per Unit" [dataType]="'string'">
+        </igx-column>
+        <igx-column field="UnitPrice" header="Unit Price" dataType="number">
+            <ng-template igxCell let-cell="cell" let-val let-row>
+                {{+val | currency}}
+            </ng-template>
+        </igx-column>
+        <igx-column field="OrderDate" header="Order Date" [dataType]="'date'">
+        </igx-column>
+        <igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'">
+            <ng-template igxCell let-cell="cell" let-val>
+                <img *ngIf="val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
+                <img *ngIf="!val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
+            </ng-template>
+        </igx-column>
+    </igx-grid>
+</div>
+
+<div class="igx-grid__outlet" #igxFilteringOverlayOutlet igxOverlayOutlet></div>
diff --git a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.scss b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.scss
new file mode 100644
index 0000000000..bc4dbd4a94
--- /dev/null
+++ b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.scss
@@ -0,0 +1,4 @@
+.grid__wrapper {
+    margin: 0 16px;
+    padding-top: 10px;
+}
diff --git a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts
new file mode 100644
index 0000000000..629c90bb53
--- /dev/null
+++ b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.ts
@@ -0,0 +1,31 @@
+import { Component, OnInit, ViewChild } from "@angular/core";
+import { IgxGridComponent, IgxOverlayOutletDirective } from "igniteui-angular";
+import { DATA } from "../../data/nwindData";
+
+@Component({
+    selector: "grid-external-outlet",
+    styleUrls: ["./grid-external-outlet-sample.component.scss"],
+    templateUrl: "grid-external-outlet-sample.component.html"
+})
+
+export class GridExternalOutletComponent implements OnInit {
+    @ViewChild("grid1", { read: IgxGridComponent, static: true })
+    public grid1: IgxGridComponent;
+
+    @ViewChild("grid2", { read: IgxGridComponent, static: true })
+    public grid2: IgxGridComponent;
+
+    @ViewChild('igxFilteringOverlayOutlet', { read: IgxOverlayOutletDirective, static: true })
+    public _outletDirective: IgxOverlayOutletDirective;
+
+    public data: any[];
+
+    constructor() {
+    }
+    public ngOnInit(): void {
+        this.grid1.outlet = this._outletDirective;
+        this.grid2.outlet = this._outletDirective;
+
+        this.data = DATA;
+    }
+}
diff --git a/src/app/grid/grid-routes-data.ts b/src/app/grid/grid-routes-data.ts
index 7683fa2d2c..5eeaf4e539 100644
--- a/src/app/grid/grid-routes-data.ts
+++ b/src/app/grid/grid-routes-data.ts
@@ -29,6 +29,7 @@ export const gridsRoutesData = {
     "grid-filter-conditions": { displayName: "Custom Filtering Conditions", parentName: "Grid" },
     "grid-external-excel-style-filtering": { displayName: "Grid External Excel Style Filtering", parentName: "Grid" },
     "grid-external-advanced-filtering": { displayName: "Grid External Advanced Filtering", parentName: "Grid" },
+    "grid-external-outlet": { displayName: "Grid External Outlet", parentName: "Grid" },
     "grid-pager-sample": { displayName: "Grid Pager", parentName: "Grid" },
     "grid-paging-sample": { displayName: "Grid Paging", parentName: "Grid" },
     "grid-pinning-styling": { displayName: "Grid Pinning Styling", parentName: "Grid" },
diff --git a/src/app/grid/grids-routing.module.ts b/src/app/grid/grids-routing.module.ts
index 115d3a2d74..9eee6932f2 100644
--- a/src/app/grid/grids-routing.module.ts
+++ b/src/app/grid/grids-routing.module.ts
@@ -23,6 +23,7 @@ import { ExcelStyleFilteringSample3Component } from "./grid-excel-style-filterin
 import { ExcelStyleFilteringStyleComponent } from "./grid-excel-style-filtering-style/grid-excel-style-filtering-style.component";
 import { GridExternalAdvancedFilteringComponent } from "./grid-external-advanced-filtering/grid-external-advanced-filtering.component";
 import { GridExternalExcelStyleFilteringComponent } from "./grid-external-excel-style-filtering/grid-external-excel-style-filtering.component";
+import { GridExternalOutletComponent } from "./grid-external-outlet-sample/grid-external-outlet-sample.component";
 import { FilteringSampleComponent } from "./grid-filtering-sample/grid-filtering-sample.component";
 import { GridFilteringStyleComponent } from "./grid-filtering-style/grid-filtering-style.component";
 import { FilteringTemplateSampleComponent } from "./grid-filtering-template-sample/grid-filtering-template-sample.component";
@@ -277,6 +278,11 @@ export const gridsRoutes: Routes = [
         data: gridsRoutesData["grid-filter-conditions"],
         path: "grid-filter-conditions"
     },
+    {
+        component: GridExternalOutletComponent,
+        data: gridsRoutesData["grid-external-outlet"],
+        path: "grid-external-outlet"
+    },
     {
         component: GridPagerSampleComponent,
         data: gridsRoutesData["grid-pager-sample"],
diff --git a/src/app/grid/grids.module.ts b/src/app/grid/grids.module.ts
index 056920d30c..9647a8fffd 100644
--- a/src/app/grid/grids.module.ts
+++ b/src/app/grid/grids.module.ts
@@ -49,6 +49,7 @@ import { ExcelStyleFilteringSample3Component } from "./grid-excel-style-filterin
 import { ExcelStyleFilteringStyleComponent } from "./grid-excel-style-filtering-style/grid-excel-style-filtering-style.component";
 import { GridExternalAdvancedFilteringComponent } from "./grid-external-advanced-filtering/grid-external-advanced-filtering.component";
 import { GridExternalExcelStyleFilteringComponent } from "./grid-external-excel-style-filtering/grid-external-excel-style-filtering.component";
+import { GridExternalOutletComponent } from "./grid-external-outlet-sample/grid-external-outlet-sample.component";
 import { FilteringSampleComponent } from "./grid-filtering-sample/grid-filtering-sample.component";
 import { GridFilteringStyleComponent } from "./grid-filtering-style/grid-filtering-style.component";
 import { FilteringTemplateSampleComponent } from "./grid-filtering-template-sample/grid-filtering-template-sample.component";
@@ -198,6 +199,7 @@ import { GridMultiColumnHeadersComponent } from "./multi-column-headers/multi-co
         GridFilteringStyleComponent,
         GridExcelStyleFilteringLoadOnDemandComponent,
         GridExternalExcelStyleFilteringComponent,
+        GridExternalOutletComponent,
         GridCustomSummariesSelection,
         GridMultiRowLayoutStylingComponent,
         PinningStylingComponent,

From b5614515c6f0d5d0521e3c6c04d67b104dada11a Mon Sep 17 00:00:00 2001
From: Hristo Anastasov <HAnastasov@infragistics.com>
Date: Mon, 27 Jul 2020 13:34:56 +0300
Subject: [PATCH 24/35] Log latest event on top

---
 .../calendar-sample-3/calendar-sample-3.component.html    | 7 +++++--
 .../calendar-sample-3/calendar-sample-3.component.scss    | 8 +++++++-
 .../calendar-sample-3/calendar-sample-3.component.ts      | 5 +++--
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
index 0dd94a97d1..8e77b98e50 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.html
@@ -5,8 +5,11 @@
 </div>
 <div class="calendar-section" style="width: calc(100% - 324px)">
     <div class="selected-data-area">
-        <div class="logger">
-            <span>Interact with the calendar to see the events logged here in sequence:</span><br>
+        <div class="logContainer">
+            <div class="highlight">
+                <span>{{loggerHeader}}</span>
+            </div>
+            <div class="logger"></div>
         </div>
     </div>
 </div>
diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
index 2f1f56ff7a..4163b6d1f1 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.scss
@@ -32,6 +32,12 @@
      margin-top: 8px;
  }
  
- .logger {
+ .logContainer {
      padding: 0.2rem 0.4rem;
  }
+
+ .highlight {
+    background-color: rgba(0,153,255, 0.1);
+    margin-bottom: 0.4rem;
+ }
+ 
diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
index fb504868b7..3039496370 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
@@ -11,6 +11,7 @@ import { IViewDateChangeEventArgs } from "igniteui-angular/lib/calendar/calendar
 export class CalendarSample3Component {
     @ViewChild("calendar", { static: true }) public calendar: IgxCalendarComponent;
     @ViewChild("alert", { static: true }) public dialog: IgxDialogComponent;
+    public loggerHeader = `Interact with the calendar to see the events logged here in sequence:`
 
     public onSelection(dates: Date[]) {
       const logger: HTMLElement = document.querySelector(".logger");
@@ -20,12 +21,12 @@ export class CalendarSample3Component {
     public viewDateChanged(event: IViewDateChangeEventArgs) {
         const logger: HTMLElement = document.querySelector(".logger");
         const eventArgs = `event.prevousValue: ${this.parseDate(event.previousValue)} | event.currentValue: ${this.parseDate(event.currentValue)}`;
-        logger.innerHTML += `<span>'viewDateChanged': ${eventArgs}</span><br>`;
+        logger.innerHTML = `<span> => 'viewDateChanged': ${eventArgs}</span><br>${logger.innerHTML}`;
     }
 
     public activeViewChanged(event: CalendarView) {
         const logger: HTMLElement = document.querySelector(".logger");
-        logger.innerHTML += `<span>'activeViewChanged':. Active view is: ${CalendarView[event]}</span><br>`;
+        logger.innerHTML = `<span> => 'activeViewChanged':. Active view is: ${CalendarView[event]}</span><br>${logger.innerHTML}`;
     }
 
     private parseDate(date: Date) {

From 39a30fa8f2f8f316a704206ddb69e4108b2e013b Mon Sep 17 00:00:00 2001
From: Hristo Anastasov <HAnastasov@infragistics.com>
Date: Mon, 27 Jul 2020 16:45:06 +0300
Subject: [PATCH 25/35] Log selection events on top of container

---
 .../calendar/calendar-sample-3/calendar-sample-3.component.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
index 3039496370..2cfde7f9ee 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
@@ -15,12 +15,12 @@ export class CalendarSample3Component {
 
     public onSelection(dates: Date[]) {
       const logger: HTMLElement = document.querySelector(".logger");
-      logger.innerHTML += `<span>'onSelectionChanged': ${dates.length} dates selected.<br>`;
+      logger.innerHTML = `<span>' => onSelectionChanged': ${dates.length} dates selected.<br>${logger.innerHTML}`;
     }
 
     public viewDateChanged(event: IViewDateChangeEventArgs) {
         const logger: HTMLElement = document.querySelector(".logger");
-        const eventArgs = `event.prevousValue: ${this.parseDate(event.previousValue)} | event.currentValue: ${this.parseDate(event.currentValue)}`;
+        const eventArgs = `event.previousValue: ${this.parseDate(event.previousValue)} | event.currentValue: ${this.parseDate(event.currentValue)}`;
         logger.innerHTML = `<span> => 'viewDateChanged': ${eventArgs}</span><br>${logger.innerHTML}`;
     }
 

From 6a128ff2d68c8b367dc2c0f7cb6ad2bf33f6e79b Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <ZKolev@infragistics.com>
Date: Tue, 28 Jul 2020 10:14:39 +0300
Subject: [PATCH 26/35] Chore(*): Add quote

---
 .../calendar/calendar-sample-3/calendar-sample-3.component.ts   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
index fb504868b7..34244ce265 100644
--- a/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
+++ b/src/app/scheduling/calendar/calendar-sample-3/calendar-sample-3.component.ts
@@ -14,7 +14,7 @@ export class CalendarSample3Component {
 
     public onSelection(dates: Date[]) {
       const logger: HTMLElement = document.querySelector(".logger");
-      logger.innerHTML += `<span>'onSelectionChanged': ${dates.length} dates selected.<br>`;
+      logger.innerHTML = `<span> => 'onSelectionChanged': ${dates.length} dates selected.<br>${logger.innerHTML}`;
     }
 
     public viewDateChanged(event: IViewDateChangeEventArgs) {

From df67d07746532b6c7decc5a0bb0e5acdf271b8a5 Mon Sep 17 00:00:00 2001
From: Silvia Ivanova <SIvanova@infragistics.com>
Date: Tue, 28 Jul 2020 15:38:57 +0300
Subject: [PATCH 27/35] style(button): add fab btn in buttons display density
 sample

---
 .../buttons-display-density.component.html                     | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.html b/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.html
index 4dc0e476fa..169c38d2e5 100644
--- a/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.html
+++ b/src/app/data-entries/buttons/buttons-display-density/buttons-display-density.component.html
@@ -12,5 +12,8 @@
         <div class="button-sample">
             <button igxButton="outlined" igxRipple [displayDensity]="density">Outlined</button>
         </div>
+        <div class="button-sample">
+            <button igxButton="fab" igxRipple [displayDensity]="density"><igx-icon fontSet="material">edit</igx-icon></button>
+        </div>
     </div>
 </article>

From ced15ecef6265bb2b75bf345075a114b73aa20e5 Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <ZKolev@infragistics.com>
Date: Fri, 24 Jul 2020 16:55:56 +0300
Subject: [PATCH 28/35] Update localization strings

---
 .../grid-pager-sample.component.html              |  2 +-
 .../grid-pager-sample.component.ts                | 15 ++++++++++++++-
 .../remote-paging-sample.component.html           |  1 -
 ...hierarchical-grid-remote-paging.component.html |  1 -
 .../tree-grid-remote-paging-sample.component.html |  1 -
 5 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/app/grid/grid-pager-sample/grid-pager-sample.component.html b/src/app/grid/grid-pager-sample/grid-pager-sample.component.html
index 56155014ca..d6a4bced8e 100644
--- a/src/app/grid/grid-pager-sample/grid-pager-sample.component.html
+++ b/src/app/grid/grid-pager-sample/grid-pager-sample.component.html
@@ -21,7 +21,7 @@
 
     <ng-template #pager>
         <igx-paginator #paginator [(page)]="grid.page" [totalRecords]="grid.totalRecords" [(perPage)]="grid.perPage"
-            [dropdownHidden]="isDropdownHidden" [pagerHidden]="isPagerHidden" [selectLabel]="'Records per page:'"
+            [dropdownHidden]="isDropdownHidden" [pagerHidden]="isPagerHidden"
             [dropdownEnabled]="!isDropdownDisabled" [pagerEnabled]="!isPagerDisabled"
             [selectOptions]="selectOptions" [displayDensity]="grid.displayDensity">
         </igx-paginator>
diff --git a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
index 50dfba4940..fea07de3a8 100644
--- a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
+++ b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
@@ -1,5 +1,6 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnInit, ViewChild } from "@angular/core";
 import { athletesData } from "../services/data";
+import { IPaginatorResourceStrings, IgxPaginatorComponent } from "igniteui-angular";
 
 @Component({
     selector: "app-grid-pager-sample",
@@ -14,9 +15,21 @@ export class GridPagerSampleComponent implements OnInit {
     public isDropdownDisabled = false;
     public isPagerDisabled = false;
     public selectOptions = [5, 15, 20, 50];
+    @ViewChild("paginator", { read: IgxPaginatorComponent, static: false })
+    paginator: IgxPaginatorComponent;
+
+    private paginatorResourceStrings: IPaginatorResourceStrings = {
+        igx_paginator_label: "Records per page"
+    };
 
     public ngOnInit(): void {
         this.data = athletesData;
         this.densityOptions = ["compact", "cosy", "comfortable"];
     }
+
+    public ngAfterViewInit(): void {
+        requestAnimationFrame(() => {
+            this.paginator.resourceStrings = this.paginatorResourceStrings;
+        })
+    };
 }
diff --git a/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.html b/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.html
index 91df9100c8..066785077f 100644
--- a/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.html
+++ b/src/app/grid/grid-remote-paging-sample/remote-paging-sample.component.html
@@ -12,7 +12,6 @@
             [totalRecords]="totalCount"
             [(page)]="page"
             [(perPage)]="perPage"
-            [selectLabel]="'Records per page:'"
             [selectOptions]="selectOptions"
             [displayDensity]="grid1.displayDensity"
             (pageChange)="paginate($event)"
diff --git a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.html b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.html
index 484ccecd77..ffeb377809 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.html
+++ b/src/app/hierarchical-grid/hierarchical-grid-paging/hierarchical-grid-remote-paging.component.html
@@ -29,7 +29,6 @@
     <igx-paginator #paginator
         [totalRecords]="totalCount"
         [(perPage)]="perPage"
-        [selectLabel]="'Records per page:'"
         [selectOptions]="selectOptions"
         [displayDensity]="hierarchicalGrid.displayDensity"
         (pageChange)="paginate($event)">
diff --git a/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.html b/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.html
index b2bd2eefc4..7b9de3dda9 100644
--- a/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.html
+++ b/src/app/tree-grid/tree-grid-remote-paging-sample/tree-grid-remote-paging-sample.component.html
@@ -17,7 +17,6 @@
         <igx-paginator #paginator
             [totalRecords]="totalCount"
             [(perPage)]="perPage"
-            [selectLabel]="'Records per page:'"
             [selectOptions]="selectOptions"
             [displayDensity]="treeGrid.displayDensity"
             (pageChange)="paginate($event)">

From c8ee9f7beee2a8a4cc4d0b21ec661305d1835787 Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <zkolev@infragistics.com>
Date: Wed, 29 Jul 2020 11:44:57 +0300
Subject: [PATCH 29/35] Update
 src/app/grid/grid-pager-sample/grid-pager-sample.component.ts

Co-authored-by: Milko Venkov <milko.venkov@gmail.com>
---
 src/app/grid/grid-pager-sample/grid-pager-sample.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
index fea07de3a8..4461bc22ac 100644
--- a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
+++ b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
@@ -30,6 +30,6 @@ export class GridPagerSampleComponent implements OnInit {
     public ngAfterViewInit(): void {
         requestAnimationFrame(() => {
             this.paginator.resourceStrings = this.paginatorResourceStrings;
-        })
+        });
     };
 }

From 034c8d3ab92e5d655178a0727fc42ea3144d170b Mon Sep 17 00:00:00 2001
From: Zdravko Kolev <zkolev@infragistics.com>
Date: Wed, 29 Jul 2020 11:45:03 +0300
Subject: [PATCH 30/35] Update
 src/app/grid/grid-pager-sample/grid-pager-sample.component.ts

Co-authored-by: Milko Venkov <milko.venkov@gmail.com>
---
 src/app/grid/grid-pager-sample/grid-pager-sample.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
index 4461bc22ac..cb61284017 100644
--- a/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
+++ b/src/app/grid/grid-pager-sample/grid-pager-sample.component.ts
@@ -31,5 +31,5 @@ export class GridPagerSampleComponent implements OnInit {
         requestAnimationFrame(() => {
             this.paginator.resourceStrings = this.paginatorResourceStrings;
         });
-    };
+    }
 }

From d5fc052bbcd51fbc02aed66d23fa3ec91c95db90 Mon Sep 17 00:00:00 2001
From: IBarakov <ibarakov@icloud.com>
Date: Thu, 30 Jul 2020 15:44:23 +0300
Subject: [PATCH 31/35] samples(grid): fix sample and update igniteui version

---
 package-lock.json                               | 17 ++++-------------
 package.json                                    |  2 +-
 .../grid-editing-sample.component.ts            |  2 +-
 3 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 36203662ea..95273660b6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2146,14 +2146,6 @@
       "integrity": "sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ==",
       "dev": true
     },
-    "@types/jszip": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/@types/jszip/-/jszip-3.4.1.tgz",
-      "integrity": "sha512-TezXjmf3lj+zQ651r6hPqvSScqBLvyPI9FxdXBqpEwBijNGQ2NXpaFW/7joGzveYkKQUil7iiDHLo6LV71Pc0A==",
-      "requires": {
-        "jszip": "*"
-      }
-    },
     "@types/minimatch": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
@@ -7489,16 +7481,15 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.0.5",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.5.tgz",
-      "integrity": "sha512-L2SpjQSAERGJyTbOszuVodzMkMYfubimXfkezYZQC37f/4+Hm3IveOihJ7adHS2m4zCxIqYFMvuoDNHC+YvfZw==",
+      "version": "10.0.6",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.6.tgz",
+      "integrity": "sha512-l7+KInPFlwtWZUMlNJt/9/F1myvUMM8lUaAlobxfedEmHwKTcghNG8kvZBwXPbuu9V1i79LnXOYkbDvuayyoDA==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
-        "@types/jszip": "^3.1.7",
         "core-js-pure": "^3.6.5",
         "hammerjs": "^2.0.8",
         "igniteui-trial-watermark": "^1.0.3",
-        "jszip": "^3.3.0",
+        "jszip": "^3.5.0",
         "resize-observer-polyfill": "^1.5.1",
         "tslib": "^2.0.0"
       }
diff --git a/package.json b/package.json
index ea40ba6811..83bdda9334 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "10.0.5",
+    "igniteui-angular": "^10.0.6",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",
diff --git a/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts b/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts
index 821ff8d723..012297a93f 100644
--- a/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts
+++ b/src/app/grid/grid-editing-sample/grid-editing-sample.component.ts
@@ -32,7 +32,7 @@ export class GridEditingSampleComponent implements OnInit, AfterViewInit {
 
     public ngAfterViewInit() {
         this.customOverlaySettings = {
-            outlet: this.grid1.outletDirective
+            outlet: this.grid1.outlet
         };
     }
 

From 8b3a479403aed34bb92af8468c4a544920a5f04a Mon Sep 17 00:00:00 2001
From: MPopov <desig9stein@gmail.com>
Date: Fri, 31 Jul 2020 14:14:07 +0300
Subject: [PATCH 32/35] feat(overlay-styling-sample): Update the sample to show
 how to style the overlay component

---
 .../overlay-styling/overlay-styling.component.html  |  2 +-
 .../overlay-styling/overlay-styling.component.scss  | 13 +++++++++----
 .../overlay-styling/overlay-styling.component.ts    |  2 +-
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.html b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.html
index 01777cfb4f..4e76d763fd 100644
--- a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.html
+++ b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.html
@@ -1,2 +1,2 @@
-<igx-combo [data]="items" valueKey="name" displayKey="name" [ngModel]="[items[2]]" width="410px" [overlaySettings]="{ outlet: element }">
+<igx-combo [data]="items" valueKey="name" displayKey="name" [ngModel]="[items[2]]" width="410px" [overlaySettings]="{ outlet: element, modal: true }">
 </igx-combo>
\ No newline at end of file
diff --git a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.scss b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.scss
index 47faa5292f..5e44c34229 100644
--- a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.scss
+++ b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.scss
@@ -1,20 +1,25 @@
 @import '~igniteui-angular/lib/core/styles/themes/index';
 
-$red: #ac4365;
-$purple: #5434b8;
+$orange: #eaa417;
+$blue: #09f;
 
-$my-palette: igx-palette($primary: $red, $secondary: $purple);
+$my-palette: igx-palette($primary: $orange, $secondary: $blue);
 
 $my-drop-down-theme: igx-drop-down-theme(
     $palette: $my-palette,
     $header-text-color: igx-color($my-palette, "secondary", 500)
 );
 
+$my-overlay-theme: igx-overlay-theme(
+        $background-color: rgba(0, 153, 255, 0.3)
+);
+
 :host {
     display: block;
     padding: 16px;
 
     // @include igx-css-vars($my-drop-down-theme);
+    // @include igx-css-vars($my-overlay-theme);
 
     /* Using Theme Overrides to provide IE 11 support.
      * NOTE: Theming using this approach will greatly increase the size
@@ -23,6 +28,6 @@ $my-drop-down-theme: igx-drop-down-theme(
     **/
     ::ng-deep {
         @include igx-drop-down($my-drop-down-theme);
+        @include igx-overlay($my-overlay-theme);
     }
 }
-
diff --git a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts
index dff0f3d6b7..aa1ff0b5b3 100644
--- a/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts
+++ b/src/app/interactions/overlay/overlay-styling/overlay-styling.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, ViewEncapsulation } from "@angular/core";
+import { Component, ElementRef } from "@angular/core";
 import { IgxOverlayService } from "igniteui-angular";
 
 @Component({

From 3fec9d67c87624811891fdd071256c67b1b4816f Mon Sep 17 00:00:00 2001
From: IBarakov <ibarakov@icloud.com>
Date: Mon, 3 Aug 2020 18:22:27 +0300
Subject: [PATCH 33/35] feat(external-outlet): fix grid config generators

---
 live-editing/configs/GridConfigGenerator.ts   |  6 +-
 .../HierarchicalGridConfigGenerator.ts        | 14 +++-
 .../configs/TreeGridConfigGenerator.ts        | 15 +++-
 package-lock.json                             | 12 ++-
 package.json                                  |  2 +-
 ...grid-external-outlet-sample.component.html |  4 +-
 ...grid-external-outlet-sample.component.html | 76 +++++++++++++++++++
 ...grid-external-outlet-sample.component.scss |  4 +
 ...l-grid-external-outlet-sample.component.ts | 31 ++++++++
 .../hierarchical-grid-routes-data.ts          |  1 +
 .../hierarchical-grid-routing.module.ts       |  7 ++
 .../hierarchical-grid.module.ts               |  2 +
 .../navbar-sample-2.component.html            |  4 +-
 ...grid-external-outlet-sample.component.html | 52 +++++++++++++
 ...grid-external-outlet-sample.component.scss |  4 +
 ...e-grid-external-outlet-sample.component.ts | 31 ++++++++
 src/app/tree-grid/tree-grid-routes-data.ts    |  1 +
 src/app/tree-grid/tree-grid-routing.module.ts |  6 ++
 src/app/tree-grid/tree-grid.module.ts         |  4 +-
 19 files changed, 262 insertions(+), 14 deletions(-)
 create mode 100644 src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.html
 create mode 100644 src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.scss
 create mode 100644 src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts
 create mode 100644 src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.html
 create mode 100644 src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.scss
 create mode 100644 src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts

diff --git a/live-editing/configs/GridConfigGenerator.ts b/live-editing/configs/GridConfigGenerator.ts
index 37c4300300..9f773ac5ce 100644
--- a/live-editing/configs/GridConfigGenerator.ts
+++ b/live-editing/configs/GridConfigGenerator.ts
@@ -2,7 +2,7 @@ import { CommonModule } from "@angular/common";
 import { HttpClientModule } from "@angular/common/http";
 import { Router, RouterModule } from "@angular/router";
 // tslint:disable:max-line-length
-import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxComboModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDividerModule, IgxDragDropModule, IgxExcelExporterService, IgxExpansionPanelModule, IgxFocusModule, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayOutletDirective, IgxOverlayService, IgxProgressBarModule, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxTabsModule, IgxToastModule, IgxTooltipModule } from "igniteui-angular";
+import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxComboModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDividerModule, IgxDragDropModule, IgxExcelExporterService, IgxExpansionPanelModule, IgxFocusModule, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxProgressBarModule, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxTabsModule, IgxToastModule, IgxTooltipModule, IgxToggleModule } from "igniteui-angular";
 import { IgxPreventDocumentScrollModule } from "../../src/app/directives/prevent-scroll.directive";
 import { GridColumnGroupSelectionComponent } from "../../src/app/grid/column-group-selection-sample/column-group-selection-sample.component";
 import { GridColumnSelectionComponent } from "../../src/app/grid/column-selection-sample/column-selection-sample.component";
@@ -1224,9 +1224,9 @@ export class GridConfigGenerator implements IConfigGenerator {
             component: GridExternalOutletComponent,
             additionalFiles: ["/src/app/directives/prevent-scroll.directive.ts", "/src/app/data/nwindData.ts"],
             appModuleConfig: new AppModuleConfig({
-                imports: [GridExternalOutletComponent, IgxGridModule, IgxOverlayOutletDirective, IgxPreventDocumentScrollModule],
+                imports: [GridExternalOutletComponent, IgxGridModule, IgxToggleModule, IgxPreventDocumentScrollModule],
                 ngDeclarations: [GridExternalOutletComponent],
-                ngImports: [IgxPreventDocumentScrollModule, IgxGridModule, IgxOverlayOutletDirective]
+                ngImports: [IgxPreventDocumentScrollModule, IgxGridModule, IgxToggleModule]
             })
         }));
 
diff --git a/live-editing/configs/HierarchicalGridConfigGenerator.ts b/live-editing/configs/HierarchicalGridConfigGenerator.ts
index 88502d4783..c1d8415aee 100644
--- a/live-editing/configs/HierarchicalGridConfigGenerator.ts
+++ b/live-editing/configs/HierarchicalGridConfigGenerator.ts
@@ -1,6 +1,6 @@
 // tslint:disable:max-line-length
 import { HttpClientModule } from "@angular/common/http";
-import { IgxActionStripModule, IgxAvatarModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxDatePickerModule, IgxDialogModule, IgxDragDropModule, IgxGridModule, IgxHierarchicalGridAPIService, IgxHierarchicalGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxToastModule, IgxTooltipModule } from "igniteui-angular";
+import { IgxActionStripModule, IgxAvatarModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxDatePickerModule, IgxDialogModule, IgxDragDropModule, IgxGridModule, IgxHierarchicalGridAPIService, IgxHierarchicalGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxToastModule, IgxTooltipModule, IgxToggleModule } from "igniteui-angular";
 import { IgxPreventDocumentScrollModule } from "../../src/app/directives/prevent-scroll.directive";
 import { HierarchicalGridColumnGroupSelectionComponent } from "../../src/app/hierarchical-grid/column-group-selection/hierarchical-grid-column-group-selection.component";
 import { HGridColumnSelectionStylesComponent } from "../../src/app/hierarchical-grid/column-selection-styles/hierarchical-grid-column-selection-styles.component";
@@ -73,6 +73,7 @@ import { RemoteLoDService } from "../../src/app/hierarchical-grid/services/remot
 import { AppModuleConfig } from "./core/AppModuleConfig";
 import { Config } from "./core/Config";
 import { IConfigGenerator } from "./core/IConfigGenerator";
+import { HierarchicalGridExternalOutletComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component";
 
 export class HierarchicalGridConfigGenerator implements IConfigGenerator {
     public generateConfigs(): Config[] {
@@ -761,6 +762,17 @@ export class HierarchicalGridConfigGenerator implements IConfigGenerator {
             }),
             component: HGridRemotePagingDefaultTemplateComponent
         }));
+
+        configs.push(new Config({
+            additionalFiles: ["/src/app/directives/prevent-scroll.directive.ts", "/src/app/hierarchical-grid/data.ts"],
+            appModuleConfig: new AppModuleConfig({
+                imports: [HierarchicalGridExternalOutletComponent, IgxHierarchicalGridModule, IgxToggleModule, IgxPreventDocumentScrollModule],
+                ngDeclarations: [HierarchicalGridExternalOutletComponent],
+                ngImports: [IgxPreventDocumentScrollModule, IgxHierarchicalGridModule, IgxToggleModule]
+            }),
+            component: HierarchicalGridExternalOutletComponent
+        }));
+
         return configs;
     }
 }
diff --git a/live-editing/configs/TreeGridConfigGenerator.ts b/live-editing/configs/TreeGridConfigGenerator.ts
index de947bf072..fa62afe251 100644
--- a/live-editing/configs/TreeGridConfigGenerator.ts
+++ b/live-editing/configs/TreeGridConfigGenerator.ts
@@ -1,5 +1,5 @@
 // tslint:disable:max-line-length
-import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDragDropModule, IgxExcelExporterService, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxToastModule, IgxTooltipModule, IgxTreeGridModule } from "igniteui-angular";
+import { IgxActionStripModule, IgxAvatarModule, IgxBadgeModule, IgxButtonGroupModule, IgxButtonModule, IgxCheckboxModule, IgxChipsModule, IgxColumnHidingModule, IgxCsvExporterService, IgxDatePickerModule, IgxDialogModule, IgxDragDropModule, IgxExcelExporterService, IgxGridModule, IgxIconModule, IgxInputGroupModule, IgxListModule, IgxOverlayService, IgxRadioModule, IgxRippleModule, IgxSelectModule, IgxSnackbarModule, IgxSwitchModule, IgxToastModule, IgxTooltipModule, IgxTreeGridModule, IgxToggleModule } from "igniteui-angular";
 import { IgxSparklineCoreModule, IgxSparklineModule } from "igniteui-angular-charts";
 import { IgxPreventDocumentScrollModule } from "../../src/app/directives/prevent-scroll.directive";
 import { TreeGridColumnGroupSelectionComponent } from "../../src/app/tree-grid/column-group-selection/column-group-selection.component";
@@ -81,6 +81,7 @@ import { TreeGridToolbarSample4Component } from "../../src/app/tree-grid/tree-gr
 import { TreeGridToolbarStyleComponent } from "../../src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component";
 import { TreeGridVirtualizationSampleComponent } from "../../src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component";
 import { TreeGridAllDataSummaryComponent } from "../../src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component";
+import { TreeGridExternalOutletComponent } from "../../src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component";
 import { AppModuleConfig } from "./core/AppModuleConfig";
 import { Config } from "./core/Config";
 import { IConfigGenerator } from "./core/IConfigGenerator";
@@ -996,6 +997,18 @@ export class TreeGridConfigGenerator implements IConfigGenerator {
             shortenComponentPathBy: "/tree-grid/"
         }));
 
+        configs.push(new Config({
+            additionalFiles: ["/src/app/directives/prevent-scroll.directive.ts", "/src/app/tree-grid/data/foods.ts"],
+            appModuleConfig: new AppModuleConfig({
+                imports: [IgxPreventDocumentScrollModule, IgxTreeGridModule, TreeGridExternalOutletComponent, IgxToggleModule],
+                ngDeclarations: [TreeGridExternalOutletComponent],
+                ngImports: [IgxPreventDocumentScrollModule, IgxTreeGridModule, IgxToggleModule]
+            }),
+            component: TreeGridExternalOutletComponent,
+
+            shortenComponentPathBy: "/tree-grid/"
+        }));
+
         return configs;
     }
 }
diff --git a/package-lock.json b/package-lock.json
index 95273660b6..bc17d4f18e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7481,15 +7481,16 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.0.6",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.6.tgz",
-      "integrity": "sha512-l7+KInPFlwtWZUMlNJt/9/F1myvUMM8lUaAlobxfedEmHwKTcghNG8kvZBwXPbuu9V1i79LnXOYkbDvuayyoDA==",
+      "version": "10.1.0-alpha.4",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.1.0-alpha.4.tgz",
+      "integrity": "sha512-jrK1mmFnev4yvHn85hLRyDy6yVhrdOYtCZPcxYWFhx26BM6WTvK/0HW3X9+jXOUq5XIeagM0WmYSkgG2jyIfSg==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
         "core-js-pure": "^3.6.5",
         "hammerjs": "^2.0.8",
         "igniteui-trial-watermark": "^1.0.3",
         "jszip": "^3.5.0",
+        "lodash.merge": "^4.6.2",
         "resize-observer-polyfill": "^1.5.1",
         "tslib": "^2.0.0"
       }
@@ -9024,6 +9025,11 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
+    "lodash.merge": {
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
+    },
     "lodash.sortby": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
diff --git a/package.json b/package.json
index 83bdda9334..4867ff43d2 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "^10.0.6",
+    "igniteui-angular": "^10.1.0-alpha.4",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",
diff --git a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
index af17b58ec4..adb159621e 100644
--- a/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
+++ b/src/app/grid/grid-external-outlet-sample/grid-external-outlet-sample.component.html
@@ -1,5 +1,5 @@
 <div class="grid__wrapper">
-    <igx-grid igxPreventDocumentScroll #grid1 [data]="data" [autoGenerate]="false" height="480px" width="100%"
+    <igx-grid igxPreventDocumentScroll #grid1 [data]="data" [autoGenerate]="false" height="300px" width="100%"
               [allowFiltering]="true" [filterMode]="'excelStyleFilter'"
               [columnHiding]="true" [columnPinning]="true">
         <igx-column field="ProductName" header="Product Name" [dataType]="'string'">
@@ -23,7 +23,7 @@
 
     <br>
 
-    <igx-grid igxPreventDocumentScroll #grid2 [data]="data" [autoGenerate]="false" height="480px" width="100%"
+    <igx-grid igxPreventDocumentScroll #grid2 [data]="data" [autoGenerate]="false" height="300px" width="100%"
               [allowFiltering]="true" [filterMode]="'excelStyleFilter'"
               [columnHiding]="true" [columnPinning]="true">
         <igx-column field="ProductName" header="Product Name" [dataType]="'string'">
diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.html b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.html
new file mode 100644
index 0000000000..4569f531c4
--- /dev/null
+++ b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.html
@@ -0,0 +1,76 @@
+<div class="grid__wrapper">
+    <igx-hierarchical-grid igxPreventDocumentScroll #hGrid1 class="hgrid" [data]="data" [showToolbar]="true" [columnHiding]="true" [autoGenerate]="false" [allowFiltering]='true' filterMode="excelStyleFilter"
+    height="300px" [width]="'100%'" [rowHeight]="'65px'">
+        <igx-column field="Artist" [sortable]="true" [movable]="true"></igx-column>
+        <igx-column field="Photo" [filterable]='false'>
+            <ng-template igxCell let-cell="cell">
+                <div class="cell__inner_2">
+                    <img [src]="cell.value" class="photo" />
+                </div>
+            </ng-template>
+        </igx-column>
+        <igx-column field="Debut" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+        <igx-column field="GrammyNominations" header="Grammy Nominations" dataType="number" [sortable]="true" [movable]="true"></igx-column>
+        <igx-column field="GrammyAwards" header="Grammy Awards" dataType="number" [sortable]="true" [movable]="true"></igx-column>
+
+        <igx-row-island [key]="'Albums'" [autoGenerate]="false" [allowFiltering]='true' filterMode="excelStyleFilter">
+            <igx-column field="Album" [sortable]="true" [movable]="true"></igx-column>
+            <igx-column field="LaunchDate" header="Launch Date" [sortable]="true" [movable]="true" [dataType]="'date'"></igx-column>
+            <igx-column field="BillboardReview" header="Billboard Review" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+            <igx-column field="USBillboard200" header="US Billboard 200" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+        <igx-row-island [key]="'Songs'" [autoGenerate]="false" >
+                <igx-column field="Number" header="No."></igx-column>
+                <igx-column field="Title"></igx-column>
+                <igx-column field="Released" dataType="date"></igx-column>
+                <igx-column field="Genre"></igx-column>
+        </igx-row-island>
+        </igx-row-island>
+
+        <igx-row-island [key]="'Tours'" [autoGenerate]="false">
+            <igx-column field="Tour"></igx-column>
+            <igx-column field="StartedOn" header="Started on"></igx-column>
+            <igx-column field="Location"></igx-column>
+            <igx-column field="Headliner"></igx-column>
+        </igx-row-island>
+    </igx-hierarchical-grid>
+
+    <br>
+
+    <igx-hierarchical-grid igxPreventDocumentScroll #hGrid2 class="hgrid" [data]="data" [showToolbar]="true" [columnHiding]="true" [autoGenerate]="false" [allowFiltering]='true' filterMode="excelStyleFilter"
+    height="300px" [width]="'100%'" [rowHeight]="'65px'">
+        <igx-column field="Artist" [sortable]="true" [movable]="true"></igx-column>
+        <igx-column field="Photo" [filterable]='false'>
+            <ng-template igxCell let-cell="cell">
+                <div class="cell__inner_2">
+                    <img [src]="cell.value" class="photo" />
+                </div>
+            </ng-template>
+        </igx-column>
+        <igx-column field="Debut" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+        <igx-column field="GrammyNominations" header="Grammy Nominations" dataType="number" [sortable]="true" [movable]="true"></igx-column>
+        <igx-column field="GrammyAwards" header="Grammy Awards" dataType="number" [sortable]="true" [movable]="true"></igx-column>
+
+        <igx-row-island [key]="'Albums'" [autoGenerate]="false" [allowFiltering]='true' filterMode="excelStyleFilter">
+            <igx-column field="Album" [sortable]="true" [movable]="true"></igx-column>
+            <igx-column field="LaunchDate" header="Launch Date" [sortable]="true" [movable]="true" [dataType]="'date'"></igx-column>
+            <igx-column field="BillboardReview" header="Billboard Review" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+            <igx-column field="USBillboard200" header="US Billboard 200" [sortable]="true" [movable]="true" dataType="number"></igx-column>
+        <igx-row-island [key]="'Songs'" [autoGenerate]="false" >
+                <igx-column field="Number" header="No."></igx-column>
+                <igx-column field="Title"></igx-column>
+                <igx-column field="Released" dataType="date"></igx-column>
+                <igx-column field="Genre"></igx-column>
+        </igx-row-island>
+        </igx-row-island>
+
+        <igx-row-island [key]="'Tours'" [autoGenerate]="false">
+            <igx-column field="Tour"></igx-column>
+            <igx-column field="StartedOn" header="Started on"></igx-column>
+            <igx-column field="Location"></igx-column>
+            <igx-column field="Headliner"></igx-column>
+        </igx-row-island>
+    </igx-hierarchical-grid>
+
+</div>
+
+<div class="igx-grid__outlet" #igxFilteringOverlayOutlet igxOverlayOutlet></div>
diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.scss b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.scss
new file mode 100644
index 0000000000..bc4dbd4a94
--- /dev/null
+++ b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.scss
@@ -0,0 +1,4 @@
+.grid__wrapper {
+    margin: 0 16px;
+    padding-top: 10px;
+}
diff --git a/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts
new file mode 100644
index 0000000000..4a108ce9f0
--- /dev/null
+++ b/src/app/hierarchical-grid/hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component.ts
@@ -0,0 +1,31 @@
+import { Component, OnInit, ViewChild } from "@angular/core";
+import { IgxHierarchicalGridComponent, IgxOverlayOutletDirective } from "igniteui-angular";
+import { SINGERS } from "../data";
+
+@Component({
+    selector: "hierarchical-grid-external-outlet",
+    styleUrls: ["./hierarchical-grid-external-outlet-sample.component.scss"],
+    templateUrl: "hierarchical-grid-external-outlet-sample.component.html"
+})
+
+export class HierarchicalGridExternalOutletComponent implements OnInit {
+    @ViewChild("hGrid1", { read: IgxHierarchicalGridComponent, static: true })
+    public hGrid1: IgxHierarchicalGridComponent;
+
+    @ViewChild("hGrid2", { read: IgxHierarchicalGridComponent, static: true })
+    public hGrid2: IgxHierarchicalGridComponent;
+
+    @ViewChild('igxFilteringOverlayOutlet', { read: IgxOverlayOutletDirective, static: true })
+    public _outletDirective: IgxOverlayOutletDirective;
+
+    public data: any[];
+
+    constructor() {
+    }
+    public ngOnInit(): void {
+        this.hGrid1.outlet = this._outletDirective;
+        this.hGrid2.outlet = this._outletDirective;
+
+        this.data = SINGERS;
+    }
+}
diff --git a/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts b/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts
index f22aa530f9..218952b5f4 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts
@@ -19,6 +19,7 @@ export const hierarchicalGridRoutesData = {
     "hierarchical-grid-excel-style-filtering-style": { displayName: "Hierarchical Grid Excel Style Filtering Styling", parentName: "Hierarchical Grid" },
     "hierarchical-grid-external-excel-style-filtering": { displayName: "Hierarchical Grid External Excel Style Filtering", parentName: "Hierarchical Grid" },
     "hierarchical-grid-external-advanced-filtering": { displayName: "Hierarchical Grid External Advanced Filtering", parentName: "Hierarchical Grid" },
+    "hierarchical-grid-external-outlet": { displayName: "Hierarchical Grid External Outlet", parentName: "Hierarchical Grid" },
     "hierarchical-grid-custom-filtering": { displayName: "Hierarchical Grid Custom Filtering", parentName: "Hierarchical Grid" },
     "hierarchical-grid-sorting": { displayName: "Hierarchical Grid Sorting", parentName: "Hierarchical Grid" },
     "hierarchical-grid-sorting-styling": { displayName: "Hierarchical Grid Sorting Styling", parentName: "Hierarchical Grid" },
diff --git a/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts b/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts
index de6eb65b08..dbd425e6eb 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts
@@ -81,6 +81,7 @@ import { HierarchicalGridToolbarStyleComponent } from "./hierarchical-grid-toolb
 import { HGridToolbarCustomSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component";
 import { HGridToolbarOptionsSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component";
 import { HGridToolbarTitleSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component";
+import { HierarchicalGridExternalOutletComponent } from "./hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component"
 
 export const hierarchicalGridRoutes: Routes = [
     {
@@ -137,6 +138,12 @@ export const hierarchicalGridRoutes: Routes = [
         data: hierarchicalGridRoutesData["hierarchical-grid-external-advanced-filtering"],
         path: "hierarchical-grid-external-advanced-filtering"
     },
+    {
+        component: HierarchicalGridExternalOutletComponent,
+        // tslint:disable-next-line:no-string-literal
+        data: hierarchicalGridRoutesData["hierarchical-grid-external-outlet"],
+        path: "hierarchical-grid-external-outlet"
+    },
     {
         component: HGridCustomFilteringSampleComponent,
         // tslint:disable-next-line:no-string-literal
diff --git a/src/app/hierarchical-grid/hierarchical-grid.module.ts b/src/app/hierarchical-grid/hierarchical-grid.module.ts
index 652bfc9720..8d9f0199fa 100644
--- a/src/app/hierarchical-grid/hierarchical-grid.module.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid.module.ts
@@ -76,6 +76,7 @@ import { HierarchicalGridToolbarStyleComponent } from "./hierarchical-grid-toolb
 import { HGridToolbarCustomSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-custom.component";
 import { HGridToolbarOptionsSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-options.component";
 import { HGridToolbarTitleSampleComponent } from "./hierarchical-grid-toolbar/hierarchical-grid-toolbar-title.component";
+import { HierarchicalGridExternalOutletComponent } from './hierarchical-grid-external-outlet/hierarchical-grid-external-outlet-sample.component';
 
 @NgModule({
     declarations: [
@@ -136,6 +137,7 @@ import { HGridToolbarTitleSampleComponent } from "./hierarchical-grid-toolbar/hi
         HGridStylingComponent,
         HGridConditionalRowSelectorsComponent,
         HGridExternalAdvancedFilteringComponent,
+        HierarchicalGridExternalOutletComponent,
         HGridExternalExcelStyleFilteringComponent,
         HGridCollapsibleColumnGroupComponent,
         HGridAllDataSummaryComponent,
diff --git a/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.html b/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.html
index 6c0b5c78f5..fc4f080e51 100644
--- a/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.html
+++ b/src/app/menus/navbar/navbar-sample-2/navbar-sample-2.component.html
@@ -4,8 +4,8 @@
         <igx-icon>favorite</igx-icon>
         <igx-icon>more_vert</igx-icon>
 
-        <igx-action-icon>
+        <!-- <igx-action-icon>
             <igx-icon class="customIcon" fontSet="fa" name="fa-home"></igx-icon>
-        </igx-action-icon>
+        </igx-action-icon> -->
     </igx-navbar>
 </div>
diff --git a/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.html b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.html
new file mode 100644
index 0000000000..8a5a62f531
--- /dev/null
+++ b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.html
@@ -0,0 +1,52 @@
+<div class="grid__wrapper">
+    <igx-tree-grid igxPreventDocumentScroll #tGrid1 [data]="data" [showToolbar]="true" [columnHiding]="true" [autoGenerate]="false" height="300px" width="100%" [allowFiltering]="true"
+        primaryKey="ID" foreignKey="ParentID" filterMode="excelStyleFilter">
+        <igx-column field="ID" header="Product ID" [dataType]="'string'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="Name" header="Product Name" [dataType]="'string'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="UnitPrice" header="Unit Price" dataType="number" [sortable]="true" [movable]="true">
+            <ng-template igxCell let-cell="cell" let-val>
+                <span *ngIf="cell.row.rowData.UnitPrice == 0">-</span>
+                <span *ngIf="cell.row.rowData.UnitPrice != 0">${{val}}</span>
+            </ng-template>
+        </igx-column>
+        <igx-column field="AddedDate" header="Added Date" [dataType]="'date'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'" [sortable]="true" [movable]="true">
+            <ng-template igxCell let-cell="cell" let-val>
+                <span *ngIf="cell.row.rowData.UnitPrice == 0">-</span>
+                <img *ngIf="cell.row.rowData.UnitPrice != 0 && val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
+                <img *ngIf="cell.row.rowData.UnitPrice != 0 && !val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
+            </ng-template>
+        </igx-column>
+    </igx-tree-grid>
+
+    <br>
+
+    <igx-tree-grid igxPreventDocumentScroll #tGrid2 [data]="data" [showToolbar]="true" [columnHiding]="true" [autoGenerate]="false" height="300px" width="100%" [allowFiltering]="true"
+        primaryKey="ID" foreignKey="ParentID" filterMode="excelStyleFilter">
+        <igx-column field="ID" header="Product ID" [dataType]="'string'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="Name" header="Product Name" [dataType]="'string'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="UnitPrice" header="Unit Price" dataType="number" [sortable]="true" [movable]="true">
+            <ng-template igxCell let-cell="cell" let-val>
+                <span *ngIf="cell.row.rowData.UnitPrice == 0">-</span>
+                <span *ngIf="cell.row.rowData.UnitPrice != 0">${{val}}</span>
+            </ng-template>
+        </igx-column>
+        <igx-column field="AddedDate" header="Added Date" [dataType]="'date'" [sortable]="true" [movable]="true">
+        </igx-column>
+        <igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'" [sortable]="true" [movable]="true">
+            <ng-template igxCell let-cell="cell" let-val>
+                <span *ngIf="cell.row.rowData.UnitPrice == 0">-</span>
+                <img *ngIf="cell.row.rowData.UnitPrice != 0 && val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
+                <img *ngIf="cell.row.rowData.UnitPrice != 0 && !val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
+            </ng-template>
+        </igx-column>
+    </igx-tree-grid>
+
+</div>
+
+<div class="igx-grid__outlet" #igxFilteringOverlayOutlet igxOverlayOutlet></div>
diff --git a/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.scss b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.scss
new file mode 100644
index 0000000000..bc4dbd4a94
--- /dev/null
+++ b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.scss
@@ -0,0 +1,4 @@
+.grid__wrapper {
+    margin: 0 16px;
+    padding-top: 10px;
+}
diff --git a/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts
new file mode 100644
index 0000000000..e747a84296
--- /dev/null
+++ b/src/app/tree-grid/tree-grid-external-outlet/tree-grid-external-outlet-sample.component.ts
@@ -0,0 +1,31 @@
+import { Component, OnInit, ViewChild } from "@angular/core";
+import { IgxTreeGridComponent, IgxOverlayOutletDirective } from "igniteui-angular";
+import { FOODS_DATA } from "../data/foods";
+
+@Component({
+    selector: "tree-grid-external-outlet",
+    styleUrls: ["./tree-grid-external-outlet-sample.component.scss"],
+    templateUrl: "tree-grid-external-outlet-sample.component.html"
+})
+
+export class TreeGridExternalOutletComponent implements OnInit {
+    @ViewChild("tGrid1", { read: IgxTreeGridComponent, static: true })
+    public tGrid1: IgxTreeGridComponent;
+
+    @ViewChild("tGrid2", { read: IgxTreeGridComponent, static: true })
+    public tGrid2: IgxTreeGridComponent;
+
+    @ViewChild('igxFilteringOverlayOutlet', { read: IgxOverlayOutletDirective, static: true })
+    public _outletDirective: IgxOverlayOutletDirective;
+
+    public data: any[];
+
+    constructor() {
+    }
+    public ngOnInit(): void {
+        this.tGrid1.outlet = this._outletDirective;
+        this.tGrid2.outlet = this._outletDirective;
+
+        this.data = FOODS_DATA();
+    }
+}
diff --git a/src/app/tree-grid/tree-grid-routes-data.ts b/src/app/tree-grid/tree-grid-routes-data.ts
index af25366fb4..0cf19afab0 100644
--- a/src/app/tree-grid/tree-grid-routes-data.ts
+++ b/src/app/tree-grid/tree-grid-routes-data.ts
@@ -51,6 +51,7 @@ export const treeGridRoutesData = {
         { displayName: "TreeGrid External Excel Style Filtering", parentName: "TreeGrid" },
     "tree-grid-external-advanced-filtering":
         { displayName: "TreeGrid External Advanced Filtering", parentName: "TreeGrid" },
+    "tree-grid-external-outlet": { displayName: "TreeGrid External Outlet", parentName: "TreeGrid" },
     "treegrid-filtering-custom": { displayName: "TreeGrid Custom Filtering", parentName: "TreeGrid" },
     "treegrid-multi-column-header-template": {
         displayName: "TreeGrid Multi Column Header Template",
diff --git a/src/app/tree-grid/tree-grid-routing.module.ts b/src/app/tree-grid/tree-grid-routing.module.ts
index c34c6517f7..d977bf13a0 100644
--- a/src/app/tree-grid/tree-grid-routing.module.ts
+++ b/src/app/tree-grid/tree-grid-routing.module.ts
@@ -78,6 +78,7 @@ import { TreeGridToolbarSample4Component } from "./tree-grid-toolbar-sample-4/tr
 import { TreeGridToolbarStyleComponent } from "./tree-grid-toolbar-style/tree-grid-toolbar-style.component";
 import { TreeGridVirtualizationSampleComponent } from "./tree-grid-virtualization-sample/tree-grid-virtualization-sample.component";
 import { TreeGridAllDataSummaryComponent } from "./treegrid-allData-summary/treegrid-allData-summary.component";
+import { TreeGridExternalOutletComponent } from "./tree-grid-external-outlet/tree-grid-external-outlet-sample.component";
 
 export const treeGridRoutes: Routes = [
     {
@@ -220,6 +221,11 @@ export const treeGridRoutes: Routes = [
         data: treeGridRoutesData["tree-grid-external-excel-style-filtering"],
         path: "tree-grid-external-excel-style-filtering"
     },
+    {
+        component: TreeGridExternalOutletComponent,
+        data: treeGridRoutesData["tree-grid-external-outlet"],
+        path: "tree-grid-external-outlet"
+    },
     {
         component: TreeGridExternalAdvancedFilteringComponent,
         data: treeGridRoutesData["tree-grid-external-advanced-filtering"],
diff --git a/src/app/tree-grid/tree-grid.module.ts b/src/app/tree-grid/tree-grid.module.ts
index dbb3598377..996a816260 100644
--- a/src/app/tree-grid/tree-grid.module.ts
+++ b/src/app/tree-grid/tree-grid.module.ts
@@ -107,6 +107,7 @@ import { TreeGridToolbarSample4Component } from "./tree-grid-toolbar-sample-4/tr
 import { TreeGridToolbarStyleComponent } from "./tree-grid-toolbar-style/tree-grid-toolbar-style.component";
 import { TreeGridVirtualizationSampleComponent } from "./tree-grid-virtualization-sample/tree-grid-virtualization-sample.component";
 import { TreeGridAllDataSummaryComponent } from "./treegrid-allData-summary/treegrid-allData-summary.component";
+import { TreeGridExternalOutletComponent } from './tree-grid-external-outlet/tree-grid-external-outlet-sample.component';
 @NgModule({
     declarations: [
         TreeGridRowEditSampleComponent,
@@ -186,7 +187,8 @@ import { TreeGridAllDataSummaryComponent } from "./treegrid-allData-summary/tree
         TreeGridColumnGroupSelectionComponent,
         TreeGridColumnSelectionStylesComponent,
         TGridKeyboardnavGuide,
-        TreeGridRemotePagingDefaultTemplateComponent
+        TreeGridRemotePagingDefaultTemplateComponent,
+        TreeGridExternalOutletComponent
     ],
     imports: [
         CommonModule,

From 1a4f3d2abdb125a8853478b7d35be6217b92ed97 Mon Sep 17 00:00:00 2001
From: IBarakov <ibarakov@icloud.com>
Date: Wed, 5 Aug 2020 11:43:55 +0300
Subject: [PATCH 34/35] chore(*): update igniteui version

---
 package-lock.json | 12 +++---------
 package.json      |  2 +-
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index bc17d4f18e..fa1e00b25c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7481,16 +7481,15 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.1.0-alpha.4",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.1.0-alpha.4.tgz",
-      "integrity": "sha512-jrK1mmFnev4yvHn85hLRyDy6yVhrdOYtCZPcxYWFhx26BM6WTvK/0HW3X9+jXOUq5XIeagM0WmYSkgG2jyIfSg==",
+      "version": "10.0.7",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.7.tgz",
+      "integrity": "sha512-wnbXMsOjAhYori9mKu0iTUWRW4Dg3BURd3wS8rtQ2+pbLbFlLtmoOfrlSVa4PVcDD0VbbCCisP1/kYVFQSk1IA==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
         "core-js-pure": "^3.6.5",
         "hammerjs": "^2.0.8",
         "igniteui-trial-watermark": "^1.0.3",
         "jszip": "^3.5.0",
-        "lodash.merge": "^4.6.2",
         "resize-observer-polyfill": "^1.5.1",
         "tslib": "^2.0.0"
       }
@@ -9025,11 +9024,6 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
-    "lodash.merge": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ=="
-    },
     "lodash.sortby": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
diff --git a/package.json b/package.json
index 4867ff43d2..39d057dae8 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "^10.1.0-alpha.4",
+    "igniteui-angular": "10.0.7",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",

From 475e8ab2964b8705c67bb26f8558d373f6f2131b Mon Sep 17 00:00:00 2001
From: IBarakov <ibarakov@icloud.com>
Date: Wed, 5 Aug 2020 12:18:31 +0300
Subject: [PATCH 35/35] chore(*): install igniteui-angular v.10.0.6

---
 package-lock.json | 6 +++---
 package.json      | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index fa1e00b25c..95273660b6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7481,9 +7481,9 @@
       "dev": true
     },
     "igniteui-angular": {
-      "version": "10.0.7",
-      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.7.tgz",
-      "integrity": "sha512-wnbXMsOjAhYori9mKu0iTUWRW4Dg3BURd3wS8rtQ2+pbLbFlLtmoOfrlSVa4PVcDD0VbbCCisP1/kYVFQSk1IA==",
+      "version": "10.0.6",
+      "resolved": "https://registry.npmjs.org/igniteui-angular/-/igniteui-angular-10.0.6.tgz",
+      "integrity": "sha512-l7+KInPFlwtWZUMlNJt/9/F1myvUMM8lUaAlobxfedEmHwKTcghNG8kvZBwXPbuu9V1i79LnXOYkbDvuayyoDA==",
       "requires": {
         "@types/hammerjs": "^2.0.36",
         "core-js-pure": "^3.6.5",
diff --git a/package.json b/package.json
index 39d057dae8..b6d13fb207 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,7 @@
     "domino": "^2.1.4",
     "file-saver": "^2.0.2",
     "hammerjs": "^2.0.8",
-    "igniteui-angular": "10.0.7",
+    "igniteui-angular": "10.0.6",
     "igniteui-angular-charts": "^9.1.2",
     "igniteui-angular-core": "^9.1.2",
     "igniteui-angular-excel": "^9.1.2",