From 848fd6589ac2c83b8073069530c92c1191905a6e Mon Sep 17 00:00:00 2001
From: Stamen Stoychev <sstoychev@infragistics.com>
Date: Tue, 4 Mar 2025 13:59:34 +0200
Subject: [PATCH] =?UTF-8?q?Revert=20"Merge=20pull=20request=20#940=20from?=
 =?UTF-8?q?=20IgniteUI/apetrov/add-tile-manager-sample=E2=80=A6"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reverts commit 58a6ba3618ebe940b26f1ad6aa61dae406f1bb2f.
---
 browser/public/index.html                     |  12 --
 package-lock.json                             |  26 ++-
 package.json                                  |   2 +-
 .../data-chart/selection-matcher/ReadMe.md    |  56 -----
 .../data-pie-chart/animation-replay/ReadMe.md |  56 -----
 .../layouts/tile-manager/actions/.prettierrc  |  11 -
 .../layouts/tile-manager/actions/ReadMe.md    |  56 -----
 .../layouts/tile-manager/actions/index.html   |  56 -----
 .../layouts/tile-manager/actions/package.json |  59 ------
 .../tile-manager/actions/sandbox.config.json  |   7 -
 .../tile-manager/actions/src/index.css        |   2 -
 .../layouts/tile-manager/actions/src/index.ts |  95 ---------
 .../tile-manager/actions/src/layout.css       |  24 ---
 .../tile-manager/actions/tsconfig.json        |  20 --
 .../tile-manager/actions/webpack.config.js    | 105 ----------
 .../tile-manager/columngap/.prettierrc        |  11 -
 .../layouts/tile-manager/columngap/ReadMe.md  |  56 -----
 .../layouts/tile-manager/columngap/index.html |  66 ------
 .../tile-manager/columngap/package.json       |  59 ------
 .../columngap/sandbox.config.json             |   7 -
 .../tile-manager/columngap/src/index.css      |   2 -
 .../tile-manager/columngap/src/index.ts       |  29 ---
 .../tile-manager/columngap/src/layout.css     |  31 ---
 .../tile-manager/columngap/tsconfig.json      |  20 --
 .../tile-manager/columngap/webpack.config.js  | 105 ----------
 .../tile-manager/dragndrop/.prettierrc        |  11 -
 .../layouts/tile-manager/dragndrop/ReadMe.md  |  56 -----
 .../layouts/tile-manager/dragndrop/index.html |  52 -----
 .../tile-manager/dragndrop/package.json       |  59 ------
 .../dragndrop/sandbox.config.json             |   7 -
 .../tile-manager/dragndrop/src/index.css      |   2 -
 .../tile-manager/dragndrop/src/index.ts       |  21 --
 .../tile-manager/dragndrop/src/layout.css     |  35 ----
 .../tile-manager/dragndrop/tsconfig.json      |  20 --
 .../tile-manager/dragndrop/webpack.config.js  | 105 ----------
 .../layouts/tile-manager/layout/.prettierrc   |  11 -
 samples/layouts/tile-manager/layout/ReadMe.md |  56 -----
 .../layouts/tile-manager/layout/index.html    |  52 -----
 .../layouts/tile-manager/layout/package.json  |  59 ------
 .../tile-manager/layout/sandbox.config.json   |   7 -
 .../layouts/tile-manager/layout/src/index.css |   2 -
 .../layouts/tile-manager/layout/src/index.ts  |  51 -----
 .../tile-manager/layout/src/layout.css        |  25 ---
 .../layouts/tile-manager/layout/tsconfig.json |  20 --
 .../tile-manager/layout/webpack.config.js     | 105 ----------
 .../layouts/tile-manager/overview/.prettierrc |  11 -
 .../layouts/tile-manager/overview/ReadMe.md   |  56 -----
 .../layouts/tile-manager/overview/index.html  |  46 -----
 .../tile-manager/overview/package.json        |  59 ------
 .../tile-manager/overview/sandbox.config.json |   7 -
 .../tile-manager/overview/src/index.css       |   2 -
 .../tile-manager/overview/src/index.ts        |  12 --
 .../tile-manager/overview/src/layout.css      |   8 -
 .../tile-manager/overview/tsconfig.json       |  20 --
 .../tile-manager/overview/webpack.config.js   | 105 ----------
 .../layouts/tile-manager/resize/.prettierrc   |  11 -
 samples/layouts/tile-manager/resize/ReadMe.md |  56 -----
 .../layouts/tile-manager/resize/index.html    |  50 -----
 .../layouts/tile-manager/resize/package.json  |  59 ------
 .../tile-manager/resize/sandbox.config.json   |   7 -
 .../layouts/tile-manager/resize/src/index.css |   2 -
 .../layouts/tile-manager/resize/src/index.ts  |  21 --
 .../tile-manager/resize/src/layout.css        |  21 --
 .../layouts/tile-manager/resize/tsconfig.json |  20 --
 .../tile-manager/resize/webpack.config.js     | 105 ----------
 .../layouts/tile-manager/styling/.prettierrc  |  11 -
 .../layouts/tile-manager/styling/ReadMe.md    |  56 -----
 .../layouts/tile-manager/styling/index.html   | 194 ------------------
 .../layouts/tile-manager/styling/package.json |  59 ------
 .../tile-manager/styling/sandbox.config.json  |   7 -
 .../tile-manager/styling/src/index.css        |   2 -
 .../layouts/tile-manager/styling/src/index.ts |  13 --
 .../tile-manager/styling/src/layout.css       |  50 -----
 .../tile-manager/styling/src/styles.css       |  15 --
 .../tile-manager/styling/tsconfig.json        |  20 --
 .../tile-manager/styling/webpack.config.js    | 105 ----------
 76 files changed, 13 insertions(+), 2926 deletions(-)
 delete mode 100644 samples/charts/data-chart/selection-matcher/ReadMe.md
 delete mode 100644 samples/charts/data-pie-chart/animation-replay/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/actions/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/actions/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/actions/index.html
 delete mode 100644 samples/layouts/tile-manager/actions/package.json
 delete mode 100644 samples/layouts/tile-manager/actions/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/actions/src/index.css
 delete mode 100644 samples/layouts/tile-manager/actions/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/actions/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/actions/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/actions/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/columngap/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/columngap/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/columngap/index.html
 delete mode 100644 samples/layouts/tile-manager/columngap/package.json
 delete mode 100644 samples/layouts/tile-manager/columngap/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/columngap/src/index.css
 delete mode 100644 samples/layouts/tile-manager/columngap/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/columngap/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/columngap/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/columngap/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/dragndrop/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/dragndrop/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/dragndrop/index.html
 delete mode 100644 samples/layouts/tile-manager/dragndrop/package.json
 delete mode 100644 samples/layouts/tile-manager/dragndrop/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/dragndrop/src/index.css
 delete mode 100644 samples/layouts/tile-manager/dragndrop/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/dragndrop/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/dragndrop/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/dragndrop/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/layout/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/layout/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/layout/index.html
 delete mode 100644 samples/layouts/tile-manager/layout/package.json
 delete mode 100644 samples/layouts/tile-manager/layout/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/layout/src/index.css
 delete mode 100644 samples/layouts/tile-manager/layout/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/layout/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/layout/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/layout/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/overview/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/overview/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/overview/index.html
 delete mode 100644 samples/layouts/tile-manager/overview/package.json
 delete mode 100644 samples/layouts/tile-manager/overview/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/overview/src/index.css
 delete mode 100644 samples/layouts/tile-manager/overview/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/overview/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/overview/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/overview/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/resize/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/resize/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/resize/index.html
 delete mode 100644 samples/layouts/tile-manager/resize/package.json
 delete mode 100644 samples/layouts/tile-manager/resize/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/resize/src/index.css
 delete mode 100644 samples/layouts/tile-manager/resize/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/resize/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/resize/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/resize/webpack.config.js
 delete mode 100644 samples/layouts/tile-manager/styling/.prettierrc
 delete mode 100644 samples/layouts/tile-manager/styling/ReadMe.md
 delete mode 100644 samples/layouts/tile-manager/styling/index.html
 delete mode 100644 samples/layouts/tile-manager/styling/package.json
 delete mode 100644 samples/layouts/tile-manager/styling/sandbox.config.json
 delete mode 100644 samples/layouts/tile-manager/styling/src/index.css
 delete mode 100644 samples/layouts/tile-manager/styling/src/index.ts
 delete mode 100644 samples/layouts/tile-manager/styling/src/layout.css
 delete mode 100644 samples/layouts/tile-manager/styling/src/styles.css
 delete mode 100644 samples/layouts/tile-manager/styling/tsconfig.json
 delete mode 100644 samples/layouts/tile-manager/styling/webpack.config.js

diff --git a/browser/public/index.html b/browser/public/index.html
index 2d82af848..4f23a6bbd 100644
--- a/browser/public/index.html
+++ b/browser/public/index.html
@@ -200,7 +200,6 @@
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/type-scatter-polyline-series">─<span>Scatter Polyline Series</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/type-scatter-series">─<span>Scatter Series</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/scatter-spline-chart">─<span>Scatter Spline Chart</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/selection-matcher">─<span>Selection Matcher</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/series-animations">─<span>Series Animations</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/series-annotations">─<span>Series Annotations</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-chart/series-error-bars">─<span>Series Error Bars</span></a> 
@@ -231,7 +230,6 @@
        <label id="nav-data-pie-chart" class="nav-component">Data Pie Chart</label> 
        <div id="nav-data-pie-chart-list" class="nav-list" state="collapsed"> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-pie-chart/animation">─<span>Animation</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/charts/data-pie-chart/animation-replay">─<span>Animation Replay</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-pie-chart/highlight-filter">─<span>Highlight Filter</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-pie-chart/highlighting">─<span>Highlighting</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/charts/data-pie-chart/legend">─<span>Legend</span></a> 
@@ -1023,16 +1021,6 @@
            <a class="nav-link" href="#" data-nav="/samples/layouts/tabs/prefix-suffix">─<span>Prefix Suffix</span></a> 
            <a class="nav-link" href="#" data-nav="/samples/layouts/tabs/scrolling">─<span>Scrolling</span></a> 
        </div>
-       <label id="nav-tile-manager" class="nav-component">Tile Manager</label> 
-       <div id="nav-tile-manager-list" class="nav-list" state="collapsed"> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/actions">─<span>Actions</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/columngap">─<span>Columngap</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/dragndrop">─<span>Dragndrop</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/layout">─<span>Layout</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/overview">─<span>Overview</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/resize">─<span>Resize</span></a> 
-           <a class="nav-link" href="#" data-nav="/samples/layouts/tile-manager/styling">─<span>Styling</span></a> 
-       </div>
 
        <div class="nav-group">MAPS</div> 
        <label id="nav-geographic-map" class="nav-component">Geographic Map</label> 
diff --git a/package-lock.json b/package-lock.json
index 1b01d18c6..e54153a22 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,7 +21,7 @@
         "core-js": "^3.6.5",
         "file-saver": "^2.0.2",
         "igniteui-dockmanager": "1.16.0",
-        "igniteui-webcomponents": "5.3.0-beta.2",
+        "igniteui-webcomponents": "5.2.1",
         "igniteui-webcomponents-charts": "5.2.1-beta.0",
         "igniteui-webcomponents-core": "5.2.1-beta.0",
         "igniteui-webcomponents-dashboards": "5.2.1-beta.0",
@@ -1995,20 +1995,18 @@
       "integrity": "sha512-wx4aBmgeGvFmOKucFKY+8VFJSYZxs9poN3SDNQFF6lT6NrQUnHiPB2PWz2sc4ieEcAaYYzN+1uWahEeTq2aRIQ=="
     },
     "node_modules/@lit-labs/virtualizer": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@lit-labs/virtualizer/-/virtualizer-2.1.0.tgz",
-      "integrity": "sha512-I79sNaalK9rD6FWO/AoxBMnA6jjNBrQu7F6lzz8W/GkQLcqveMWK3IrJAilso+XeFFn7BvlxBv6FqZaoMt+Qkg==",
-      "license": "BSD-3-Clause",
+      "version": "2.0.12",
+      "resolved": "https://registry.npmjs.org/@lit-labs/virtualizer/-/virtualizer-2.0.12.tgz",
+      "integrity": "sha512-sL7AXhacSdzOJLEQFcPCrV7tu2rZQ10upeGMAxKmTT0Ae4kBFV8nwlFiUEQPBt1idUsAkiDG1yN91IgUWQXVNQ==",
       "dependencies": {
-        "lit": "^3.2.0",
+        "lit": "^3.1.0",
         "tslib": "^2.0.3"
       }
     },
     "node_modules/@lit-labs/virtualizer/node_modules/tslib": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
-      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
-      "license": "0BSD"
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@lit/context": {
       "version": "1.1.3",
@@ -8727,13 +8725,13 @@
       "integrity": "sha512-q6thtu+7R6MOB+i9GorFPCcWeOImW43BzCAtKnDAYWwaoueb8Lg1EhBkIhAyfEIH+yZ/9c5lnZdU61/GRPoP+g=="
     },
     "node_modules/igniteui-webcomponents": {
-      "version": "5.3.0-beta.2",
-      "resolved": "https://registry.npmjs.org/igniteui-webcomponents/-/igniteui-webcomponents-5.3.0-beta.2.tgz",
-      "integrity": "sha512-3Az5lo30Wd1441xy76sLJsf3uU7N/ypOHC5FRz0XdMe1GtIzHOUpycroD0MoG+gT2fjUmUypbLdraDOnDDrszQ==",
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/igniteui-webcomponents/-/igniteui-webcomponents-5.2.1.tgz",
+      "integrity": "sha512-0SJ1Xr9VhYbPGPStw4qLelB+umFqWAboEurQ/4yN1iq4rIqP3w3QaU13hcDm/kLrTL4M9UH++XTisUeII3Bppg==",
       "license": "SEE LICENSE IN LICENSE",
       "dependencies": {
         "@floating-ui/dom": "^1.6.0",
-        "@lit-labs/virtualizer": "^2.1.0",
+        "@lit-labs/virtualizer": "^2.0.10",
         "@lit/context": "^1.1.0",
         "lit": "^3.2.0"
       },
diff --git a/package.json b/package.json
index ecfe7e40d..84bee7a1d 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "core-js": "^3.6.5",
     "file-saver": "^2.0.2",
     "igniteui-dockmanager": "1.16.0",
-    "igniteui-webcomponents": "5.3.0-beta.2",
+    "igniteui-webcomponents": "5.2.1",
     "igniteui-webcomponents-charts": "5.2.1-beta.0",
     "igniteui-webcomponents-core": "5.2.1-beta.0",
     "igniteui-webcomponents-dashboards": "5.2.1-beta.0",
diff --git a/samples/charts/data-chart/selection-matcher/ReadMe.md b/samples/charts/data-chart/selection-matcher/ReadMe.md
deleted file mode 100644
index 08c4ba9a4..000000000
--- a/samples/charts/data-chart/selection-matcher/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Selection Matcher feature using [Data Chart](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/charts/data-chart/selection-matcher" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/charts/data-chart/selection-matcher?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/charts/data-chart/selection-matcher
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/charts/data-pie-chart/animation-replay/ReadMe.md b/samples/charts/data-pie-chart/animation-replay/ReadMe.md
deleted file mode 100644
index b17c1f548..000000000
--- a/samples/charts/data-pie-chart/animation-replay/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Animation Replay feature using [Data Pie Chart](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/charts/data-pie-chart/animation-replay" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/charts/data-pie-chart/animation-replay?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/charts/data-pie-chart/animation-replay
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/actions/.prettierrc b/samples/layouts/tile-manager/actions/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/actions/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/ReadMe.md b/samples/layouts/tile-manager/actions/ReadMe.md
deleted file mode 100644
index ba48172e5..000000000
--- a/samples/layouts/tile-manager/actions/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Actions feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/actions" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/actions?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/actions
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/actions/index.html b/samples/layouts/tile-manager/actions/index.html
deleted file mode 100644
index c6770f247..000000000
--- a/samples/layouts/tile-manager/actions/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Actions</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <igc-tile-manager id="tile-manager1" column-count="2" gap="20px">
-        <igc-tile >
-          <h3 slot="title">Default Actions</h3>
-          <p>This tile has default actions and title.</p>
-        </igc-tile>
-        <igc-tile disable-fullscreen>
-          <h3 slot="title">No Fullscreen Action</h3>
-          <p>Fullscreen is disabled via property.</p>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <h3 slot="title">Custom Actions</h3>
-          <igc-icon-button id="customOne" slot="actions" variant="flat" collection="material" exportparts="icon" name="north_east"
-            aria-label="north_east"></igc-icon-button>
-          <p>Replace the default actions with custom ones, and include extra actions when the tile is maximized.</p>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <igc-icon-button id="customTwo" slot="actions" variant="flat" collection="material" exportparts="icon"
-            name="north_east"></igc-icon-button>
-          <p>Display only custom actions in the header.</p>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <h3 slot="title">Only title</h3>
-          <p>Display only title in the header.</p>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <p>Content only.</p>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/package.json b/samples/layouts/tile-manager/actions/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/actions/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/actions/sandbox.config.json b/samples/layouts/tile-manager/actions/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/actions/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/src/index.css b/samples/layouts/tile-manager/actions/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/actions/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/src/index.ts b/samples/layouts/tile-manager/actions/src/index.ts
deleted file mode 100644
index 4e77a222d..000000000
--- a/samples/layouts/tile-manager/actions/src/index.ts
+++ /dev/null
@@ -1,95 +0,0 @@
-import { defineComponents, IgcTileManagerComponent, IgcIconButtonComponent, IgcIconComponent, IgcButtonComponent, registerIconFromText } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent, IgcIconButtonComponent, IgcIconComponent, IgcButtonComponent);
-
-export class TileManagerActions {
-
-  constructor() {
-    const northEast =
-      '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="m216-160-56-56 464-464H360v-80h400v400h-80v-264L216-160Z"/></svg>';
-    registerIconFromText('north_east', northEast, 'material');
-    const southWest =
-      '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M200-200v-400h80v264l464-464 56 56-464 464h264v80H200Z"/></svg>';
-    registerIconFromText('south_west', southWest, 'material');
-    const more =
-      '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M480-160q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 33-23.5 56.5T480-160Zm0-240q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm0-240q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Z"/></svg>';
-    registerIconFromText('more', more, 'material');
-    const chart =
-      '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M640-160v-280h160v280H640Zm-240 0v-640h160v640H400Zm-240 0v-440h160v440H160Z"/></svg>';
-    registerIconFromText('chart', chart, 'material');
-
-    document.querySelector('#customOne')?.addEventListener('click', (event: Event) => {
-
-      const tile = (event.target as HTMLElement).closest('igc-tile');
-
-      if (tile) {
-        tile.maximized = !tile.maximized;
-
-        const actionsSlot = tile.querySelector('[slot="actions"]') as HTMLElement;
-        const currentBtn = event.target as HTMLElement;
-
-        if (currentBtn) {
-          if (tile.maximized) {
-            currentBtn.setAttribute('name', 'south_west');
-            currentBtn.setAttribute('aria-label', 'collapse');
-
-            const chartBtn = document.createElement('igc-icon-button');
-            chartBtn.classList.add('additional-action');
-            chartBtn.setAttribute('slot', 'actions');
-            chartBtn.setAttribute('variant', 'flat');
-            chartBtn.setAttribute('collection', 'material');
-            chartBtn.setAttribute('name', 'chart');
-            chartBtn.setAttribute('aria-label', 'chart');
-
-            const moreBtn = document.createElement('igc-icon-button');
-            moreBtn.classList.add('additional-action');
-            moreBtn.setAttribute('slot', 'actions');
-            moreBtn.setAttribute('variant', 'flat');
-            moreBtn.setAttribute('collection', 'material');
-            moreBtn.setAttribute('name', 'more');
-            moreBtn.setAttribute('aria-label', 'more');
-
-            tile.append(chartBtn);
-            tile.append(moreBtn);
-          } else {
-            currentBtn.setAttribute('name', 'north_east');
-            currentBtn.setAttribute('aria-label', 'expand');
-
-            const additionalButtons =
-              actionsSlot.parentElement?.querySelectorAll('.additional-action');
-            additionalButtons?.forEach((btn) => btn.remove());
-          }
-        }
-      }
-    })
-
-
-
-    document.querySelector('#customTwo')?.addEventListener('click', (event: Event) => {
-      const tile = (event.target as HTMLElement).closest('igc-tile');
-
-      if (tile) {
-        tile.maximized = !tile.maximized;
-
-        const currentBtn = event.target as HTMLElement;
-
-        if (currentBtn) {
-          if (tile.maximized) {
-            currentBtn.setAttribute('name', 'south_west');
-            currentBtn.setAttribute('aria-label', 'collapse');
-          }
-          else {
-            currentBtn.setAttribute('name', 'north_east');
-            currentBtn.setAttribute('aria-label', 'expand');
-          }
-        }
-      }
-    })
-
-    
-  }
-}
-
-new TileManagerActions();
diff --git a/samples/layouts/tile-manager/actions/src/layout.css b/samples/layouts/tile-manager/actions/src/layout.css
deleted file mode 100644
index 1389f4169..000000000
--- a/samples/layouts/tile-manager/actions/src/layout.css
+++ /dev/null
@@ -1,24 +0,0 @@
-igc-tile-manager {
-  max-width: 1000px;
-  margin-bottom: 20px;
-}
-
-igc-tile:nth-child(n + 3):nth-child(-n + 4)::part(actions) {
-  padding: 13px 16px;
-}
-
-igc-tile:nth-child(n+3)::part(header) {
-  padding: 0px;
-}
-
-igc-tile:nth-child(5)::part(header) {
-  padding: 18px 0 18px 0;
-}
-
-p, igc-tile:nth-child(3) h3, igc-tile:nth-child(5) h3  {
-  margin-left: 20px;
-}
-
-igc-tile:nth-last-child(1) p {
-  margin-top: 30px;
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/tsconfig.json b/samples/layouts/tile-manager/actions/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/actions/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/actions/webpack.config.js b/samples/layouts/tile-manager/actions/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/actions/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/columngap/.prettierrc b/samples/layouts/tile-manager/columngap/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/columngap/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/ReadMe.md b/samples/layouts/tile-manager/columngap/ReadMe.md
deleted file mode 100644
index 4cd52c544..000000000
--- a/samples/layouts/tile-manager/columngap/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Columngap feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/columngap" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/columngap?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/columngap
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/columngap/index.html b/samples/layouts/tile-manager/columngap/index.html
deleted file mode 100644
index 77333b090..000000000
--- a/samples/layouts/tile-manager/columngap/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Columns</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <div class="inputWrapper">
-      <igc-input label="Columns Number" id="rowIn" type='number' value="0" min="0"></igc-input>
-      <igc-input label="Gap Size" type='string'></igc-input>
-      <igc-input label="Minimum Column Width" type='string'></igc-input>
-      <igc-input label="Minimum Row Height" type='string'></igc-input>
-    </div>
-      <igc-tile-manager gap="10px">
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1048/998" alt="picture" />
-          </div>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1049/999" alt="picture" />
-          </div>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1050/1000" alt="picture" />
-          </div>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1051/1001" alt="picture" />
-          </div>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1052/1002" alt="picture" />
-          </div>
-        </igc-tile>
-        <igc-tile disable-fullscreen disable-maximize>
-          <div class="picture">
-            <img src="https://picsum.photos/1053/1003" alt="picture" />
-          </div>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/package.json b/samples/layouts/tile-manager/columngap/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/columngap/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/columngap/sandbox.config.json b/samples/layouts/tile-manager/columngap/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/columngap/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/src/index.css b/samples/layouts/tile-manager/columngap/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/columngap/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/src/index.ts b/samples/layouts/tile-manager/columngap/src/index.ts
deleted file mode 100644
index f3389f123..000000000
--- a/samples/layouts/tile-manager/columngap/src/index.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { defineComponents, IgcTileManagerComponent, IgcInputComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent, IgcInputComponent);
-
-export class TileManagerColumn {
-
-  constructor() {
-    const tileManager = document.querySelector("igc-tile-manager");
-    document.addEventListener('igcChange', (e) => {
-      const fieldInput = e.target as IgcInputComponent;
-      if (tileManager) {
-        switch (fieldInput.label) {
-          case 'Columns Number': tileManager.columnCount = parseInt(fieldInput.value);
-            break;
-          case 'Gap Size': tileManager.gap = fieldInput.value;
-            break;
-          case 'Minimum Column Width': tileManager.minColumnWidth = fieldInput.value;;
-            break;
-          case 'Minimum Row Height': tileManager.minRowHeight = fieldInput.value;;
-            break;
-        }
-      }
-    })
-  }
-}
-
-new TileManagerColumn();
diff --git a/samples/layouts/tile-manager/columngap/src/layout.css b/samples/layouts/tile-manager/columngap/src/layout.css
deleted file mode 100644
index 2d4a65d91..000000000
--- a/samples/layouts/tile-manager/columngap/src/layout.css
+++ /dev/null
@@ -1,31 +0,0 @@
-p {
-  font-size: 25px;
-  padding: 10px;
-}
-
-igc-tile-manager {
-  max-width: 1000px;
-  margin-bottom: 20px;
-}
-
-igc-input {
-  width: min-content;
-  --ig-size: var(--ig-size-small);
-  margin-right: 50px;
-}
-
-img {
-  height: 100%;
-  width: 100%;
-}
-
-.inputWrapper{
-  width: 1000px;
-  display: flex;
-  justify-content: center;
-  margin-bottom: 20px;
-}
-
-.sample {
-  overflow: auto;
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/tsconfig.json b/samples/layouts/tile-manager/columngap/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/columngap/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/columngap/webpack.config.js b/samples/layouts/tile-manager/columngap/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/columngap/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/dragndrop/.prettierrc b/samples/layouts/tile-manager/dragndrop/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/dragndrop/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/dragndrop/ReadMe.md b/samples/layouts/tile-manager/dragndrop/ReadMe.md
deleted file mode 100644
index eab96335a..000000000
--- a/samples/layouts/tile-manager/dragndrop/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Dragndrop feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/dragndrop" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/dragndrop?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/dragndrop
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/dragndrop/index.html b/samples/layouts/tile-manager/dragndrop/index.html
deleted file mode 100644
index 6529ba332..000000000
--- a/samples/layouts/tile-manager/dragndrop/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Drag and drop</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <div class="radioWrapper">
-      <igc-radio-group id="dragMode" alignment="horizontal">
-        <igc-radio name="dragMode" value="TileHeader" checked>Tile-header</igc-radio>
-        <igc-radio name="dragMode" value="Tile">Tile</igc-radio>
-      </igc-radio-group>
-    </div>
-      <igc-tile-manager drag-mode="tile-header" drag-action="slide" column-count="2" gap="20px">
-        <igc-tile>
-         <span slot="title">Tile 1 header</span>
-          <p>Content for Tile 1</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 2 header</span>
-          <p>Content for Tile 2</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 3 header</span>
-          <p>Content for Tile 3</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 4 header</span>
-          <p>Content for Tile 4</p>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/dragndrop/package.json b/samples/layouts/tile-manager/dragndrop/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/dragndrop/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/dragndrop/sandbox.config.json b/samples/layouts/tile-manager/dragndrop/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/dragndrop/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/dragndrop/src/index.css b/samples/layouts/tile-manager/dragndrop/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/dragndrop/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/dragndrop/src/index.ts b/samples/layouts/tile-manager/dragndrop/src/index.ts
deleted file mode 100644
index a8621b485..000000000
--- a/samples/layouts/tile-manager/dragndrop/src/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineComponents, IgcTileManagerComponent, IgcRadioGroupComponent, IgcRadioComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent, IgcRadioGroupComponent, IgcRadioComponent);
-
-export class TileManagerDragnDrop {
-  constructor() {
-    document.addEventListener('igcChange', (e) => {
-      const radio = e.target as IgcRadioComponent;
-      switch (radio.value) {
-        case 'TileHeader': document.querySelector("igc-tile-manager")?.setAttribute("drag-mode", "tile-header");
-          break;
-        case 'Tile': document.querySelector("igc-tile-manager")?.setAttribute("drag-mode", "tile");
-          break;
-      }
-    })
-  }
-}
-
-new TileManagerDragnDrop();
diff --git a/samples/layouts/tile-manager/dragndrop/src/layout.css b/samples/layouts/tile-manager/dragndrop/src/layout.css
deleted file mode 100644
index e64c1b900..000000000
--- a/samples/layouts/tile-manager/dragndrop/src/layout.css
+++ /dev/null
@@ -1,35 +0,0 @@
- span{
-  font-size: 30px;
-}
-
-igc-tile::part(header) {
-  border-bottom: 2px solid var(--ig-primary-700);
-}
-
-p {
-  font-size: 25px;
-  margin-left: 20px;
-  padding-top: 10px;
-}
-
-igc-radio-group {
-  margin-left: 20px;
-  width: fit-content;
-  padding: 4px 15px;
-  margin-bottom: 10px;
-  border: 2px solid var(--ig-primary-700);
-  background-color: var(--ig-gray-300);
-}
-
-igc-tile-manager {
-  max-width: 1000px;
-}
-
-igc-tile::part(dragging) {
-  color: yellow;
-
-}
-
-.radioWrapper {
-  display: flex;
-}
diff --git a/samples/layouts/tile-manager/dragndrop/tsconfig.json b/samples/layouts/tile-manager/dragndrop/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/dragndrop/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/dragndrop/webpack.config.js b/samples/layouts/tile-manager/dragndrop/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/dragndrop/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/layout/.prettierrc b/samples/layouts/tile-manager/layout/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/layout/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/ReadMe.md b/samples/layouts/tile-manager/layout/ReadMe.md
deleted file mode 100644
index c4728769a..000000000
--- a/samples/layouts/tile-manager/layout/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Layout feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/layout" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/layout?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/layout
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/layout/index.html b/samples/layouts/tile-manager/layout/index.html
deleted file mode 100644
index b4e9b7e82..000000000
--- a/samples/layouts/tile-manager/layout/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Layout</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <div class="btnWrapper">
-      <igc-button id="saveL">Save Layout</igc-button>
-      <igc-button id="loadL">Load Layout</igc-button>
-      <igc-button id="addT">Add Tile</igc-button>
-      <igc-button id="remT">Remove Tile</igc-button>
-      </div>
-      <igc-tile-manager id="tile-manager1" drag-mode="tile" column-count="2" gap="20px">
-        <igc-tile>
-          <span slot="title">Tile 1 header</span>
-          <p>Content for Tile 1</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 2 header</span>
-          <p>Content for Tile 2</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 3 header</span>
-          <p>Content for Tile 3</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 4 header</span>
-          <p>Content for Tile 4</p>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/package.json b/samples/layouts/tile-manager/layout/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/layout/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/layout/sandbox.config.json b/samples/layouts/tile-manager/layout/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/layout/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/src/index.css b/samples/layouts/tile-manager/layout/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/layout/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/src/index.ts b/samples/layouts/tile-manager/layout/src/index.ts
deleted file mode 100644
index 08dbb117d..000000000
--- a/samples/layouts/tile-manager/layout/src/index.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-import { defineComponents, IgcTileManagerComponent, IgcButtonComponent, IgcButtonGroupComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent, IgcButtonComponent, IgcButtonGroupComponent);
-
-export class TileManagerLayout {
-
-  constructor() {
-    let serializedData: string;
-    var tileManager = document.querySelector<IgcTileManagerComponent>('#tile-manager1')!;
-
-    document.querySelector('#saveL')?.addEventListener('click', () => {
-      const tileManager =
-        document.querySelector<IgcTileManagerComponent>('#tile-manager1')!;
-
-      serializedData = tileManager.saveLayout();
-    })
-
-    document.querySelector('#loadL')?.addEventListener('click', () => {
-      const tileManager =
-        document.querySelector<IgcTileManagerComponent>('#tile-manager1')!;
-
-      tileManager.loadLayout(serializedData);
-    })
-
-    document.querySelector('#addT')?.addEventListener('click', () => {
-      const tiles = tileManager.querySelectorAll('igc-tile');
-      const newTile = document.createElement('igc-tile');
-      const contentHeader = document.createElement('span');
-      const content = document.createElement('p');
-      contentHeader.textContent = `Tile ${tileManager.tiles.length + 1} header`;
-      content.textContent = `Content for Tile ${tileManager.tiles.length + 1}`;
-      contentHeader.setAttribute('slot', 'title');
-      newTile.position = 0;
-      newTile.append(contentHeader);
-      newTile.append(content);
-      tileManager.insertBefore(newTile, tiles[3]);
-    })
-
-    document.querySelector('#remT')?.addEventListener('click', () => {
-      const firstTile = tileManager.querySelector('igc-tile:first-of-type');
-
-      if (firstTile) {
-        firstTile.remove();
-      }
-    })
-  }
-}
-
-new TileManagerLayout();
diff --git a/samples/layouts/tile-manager/layout/src/layout.css b/samples/layouts/tile-manager/layout/src/layout.css
deleted file mode 100644
index 5a0e98aa6..000000000
--- a/samples/layouts/tile-manager/layout/src/layout.css
+++ /dev/null
@@ -1,25 +0,0 @@
-span{
-  font-size: 30px;
-}
-
-p {
-  font-size: 25px;
-  margin-left: 20px;
-}
-
-.btnWrapper {
-  margin: 0 0 15px 20px;
-}
-
-igc-button:nth-of-type(-n+3) {
-  margin-right: 5px;;
-}
-
-igc-tile-manager {
-  max-width: 1000px;
-  margin-bottom: 20px;
-}
-
-.sample {
-  overflow: auto;
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/tsconfig.json b/samples/layouts/tile-manager/layout/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/layout/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/layout/webpack.config.js b/samples/layouts/tile-manager/layout/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/layout/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/overview/.prettierrc b/samples/layouts/tile-manager/overview/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/overview/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/ReadMe.md b/samples/layouts/tile-manager/overview/ReadMe.md
deleted file mode 100644
index c5376311d..000000000
--- a/samples/layouts/tile-manager/overview/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Overview feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/overview" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/overview?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/overview
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/overview/index.html b/samples/layouts/tile-manager/overview/index.html
deleted file mode 100644
index 2f66fb2c8..000000000
--- a/samples/layouts/tile-manager/overview/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Overview</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <igc-tile-manager column-count="2" gap="20px">
-        <igc-tile>
-          <span slot="title">Tile 1 header</span>
-          <p>Content for Tile 1</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 2 header</span>
-          <p>Content for Tile 2</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 3 header</span>
-          <p>Content for Tile 3</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 4 header</span>
-          <p>Content for Tile 4</p>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/package.json b/samples/layouts/tile-manager/overview/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/overview/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/overview/sandbox.config.json b/samples/layouts/tile-manager/overview/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/overview/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/src/index.css b/samples/layouts/tile-manager/overview/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/overview/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/src/index.ts b/samples/layouts/tile-manager/overview/src/index.ts
deleted file mode 100644
index b5162d4ba..000000000
--- a/samples/layouts/tile-manager/overview/src/index.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { defineComponents, IgcTileManagerComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent);
-
-export class TileManagerOverview {
-  constructor() {
-  }
-}
-
-new TileManagerOverview();
diff --git a/samples/layouts/tile-manager/overview/src/layout.css b/samples/layouts/tile-manager/overview/src/layout.css
deleted file mode 100644
index 5755b133f..000000000
--- a/samples/layouts/tile-manager/overview/src/layout.css
+++ /dev/null
@@ -1,8 +0,0 @@
-span{
-  font-size: 30px;
-}
-
-p {
-  font-size: 25px;
-  margin-left : 20px;
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/tsconfig.json b/samples/layouts/tile-manager/overview/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/overview/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/overview/webpack.config.js b/samples/layouts/tile-manager/overview/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/overview/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/resize/.prettierrc b/samples/layouts/tile-manager/resize/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/resize/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/ReadMe.md b/samples/layouts/tile-manager/resize/ReadMe.md
deleted file mode 100644
index 7f0aac25e..000000000
--- a/samples/layouts/tile-manager/resize/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Resize feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/resize" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/resize?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/resize
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/resize/index.html b/samples/layouts/tile-manager/resize/index.html
deleted file mode 100644
index 142d0c288..000000000
--- a/samples/layouts/tile-manager/resize/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Resize</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <igc-radio-group id="resize" alignment="horizontal">
-        <igc-radio name="resize" value="Always" checked>Always</igc-radio>
-        <igc-radio name="resize" value="Hover">Hover</igc-radio>
-      </igc-radio-group>
-      <igc-tile-manager resize-mode="always" column-count="3" gap="20px">
-        <igc-tile>
-          <span slot="title">Tile 1 header</span>
-          <p>Content for Tile 1</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 2 header</span>
-          <p>Content for Tile 2</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 3 header</span>
-          <p>Content for Tile 3</p>
-        </igc-tile>
-        <igc-tile>
-          <span slot="title">Tile 4 header</span>
-          <p>Content for Tile 4</p>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/package.json b/samples/layouts/tile-manager/resize/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/resize/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/resize/sandbox.config.json b/samples/layouts/tile-manager/resize/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/resize/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/src/index.css b/samples/layouts/tile-manager/resize/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/resize/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/src/index.ts b/samples/layouts/tile-manager/resize/src/index.ts
deleted file mode 100644
index 278304016..000000000
--- a/samples/layouts/tile-manager/resize/src/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { defineComponents, IgcTileManagerComponent, IgcRadioGroupComponent, IgcRadioComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-
-defineComponents(IgcTileManagerComponent, IgcRadioGroupComponent, IgcRadioComponent);
-
-export class TileManagerResize {
-  constructor() {
-    document.addEventListener('igcChange', (e) => {
-      const radio = e.target as IgcRadioComponent;
-      if (radio.value === "Hover") {
-        document.querySelector("igc-tile-manager")?.setAttribute("resize-mode", "hover");
-      }
-      else {
-        document.querySelector("igc-tile-manager")?.setAttribute("resize-mode", "always");
-      }
-    })
-  }
-}
-
-new TileManagerResize();
diff --git a/samples/layouts/tile-manager/resize/src/layout.css b/samples/layouts/tile-manager/resize/src/layout.css
deleted file mode 100644
index df8afd227..000000000
--- a/samples/layouts/tile-manager/resize/src/layout.css
+++ /dev/null
@@ -1,21 +0,0 @@
-span{
-  font-size: 30px;
-}
-
-p {
-  font-size: 25px;
-  padding-left: 20px;
-}
-
-igc-radio-group {
-  margin-left: 20px;
-  width: fit-content;
-  padding: 4px 15px;
-  margin-bottom: 10px;
-  border: 2px solid var(--ig-primary-700);
-  background-color: var(--ig-gray-300);
-}
-
-igc-tile-manager {
-  max-width: 1000px;
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/tsconfig.json b/samples/layouts/tile-manager/resize/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/resize/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/resize/webpack.config.js b/samples/layouts/tile-manager/resize/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/resize/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};
diff --git a/samples/layouts/tile-manager/styling/.prettierrc b/samples/layouts/tile-manager/styling/.prettierrc
deleted file mode 100644
index 15a7c7c6c..000000000
--- a/samples/layouts/tile-manager/styling/.prettierrc
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "printWidth": 250,
-  "tabWidth": 4,
-  "useTabs": false,
-  "semi": true,
-  "singleQuote": false,
-  "trailingComma": "none",
-  "bracketSpacing": true,
-  "jsxBracketSameLine": false,
-  "fluid": false
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/ReadMe.md b/samples/layouts/tile-manager/styling/ReadMe.md
deleted file mode 100644
index eac523441..000000000
--- a/samples/layouts/tile-manager/styling/ReadMe.md
+++ /dev/null
@@ -1,56 +0,0 @@
-<!-- NOTE: do not change this file because it's auto re-generated from template: -->
-<!-- https://github.com/IgniteUI/igniteui-wc-examples/tree/vnext/templates/browser/sample/ReadMe.md -->
-
-This folder contains implementation of Web Components application with example of Styling feature using [Tile Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component.
-
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-    <body>
-        <a target="_blank" href="https://infragistics.com/webcomponentssite/components/general-getting-started.html" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem" alt="View Docs" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-docs.png"/>
-        </a>
-        <a target="_blank" href="./src/index.ts" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="View Code" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-code.png"/>
-        </a>
-        <a target="_blank" href="https://www.infragistics.com/webcomponents-demos/samples/layouts/tile-manager/styling" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-run.png"/>
-        </a>
-        <a target="_blank" href="https://codesandbox.io/s/github/IgniteUI/igniteui-wc-examples/tree/master/samples/layouts/tile-manager/styling?fontsize=14&hidenavigation=1&theme=dark&view=preview&file=/src/{SampleFile}" rel="noopener noreferrer">
-            <img height="40px" style="border-radius: 0rem; max-width: 100%;" alt="Run Sample" src="https://github.com/IgniteUI/igniteui-blazor-examples/raw/vnext/templates/sample/images/button-sandbox.png"/>
-        </a>
-    </body>
-</html>
-
-## Branches
-
-> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
-
-## Instructions
-
-To set up this project locally, execute these commands:
-
-```
-git clone https://github.com/IgniteUI/igniteui-wc-examples.git
-git checkout master
-cd ./igniteui-wc-examples
-cd ./samples/layouts/tile-manager/styling
-```
-
-open above folder in VS Code or type:
-```
-code .
-```
-
-In terminal window, run:
-
-```
-npm install
-npm run start
-```
-
-Then open http://localhost:4200/ in your browser
-
-
-## Learn More
-
-To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html).
diff --git a/samples/layouts/tile-manager/styling/index.html b/samples/layouts/tile-manager/styling/index.html
deleted file mode 100644
index 28a61f3d8..000000000
--- a/samples/layouts/tile-manager/styling/index.html
+++ /dev/null
@@ -1,194 +0,0 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-  <title>Tile Manager Styling</title>
-  <meta charset="UTF-8" />
-
-  <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
-  <link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" type="text/css" />
-</head>
-
-<body>
-  <div id="root">
-    <div class="container sample center">
-      <igc-tile-manager id="tile-manager1" column-count="3" gap="20px">
-        <igc-tile row-span="2">
-          <h2 slot="title">Order info</h2>
-          <igc-list class="list">
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> list_alt </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>OrderID</p>
-                <p>10293</p>
-              </div>
-            </igc-list-item>
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> list_alt </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>Customer Name</p>
-                <p>Tortuga Restaurante</p>
-              </div>
-            </igc-list-item>
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> calendar_month </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>Order Date</p>
-                <p>August 29, 1996</p>
-              </div>
-            </igc-list-item>
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> calendar_month </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>Shipped Date</p>
-                <p>September 11, 1996</p>
-              </div>
-            </igc-list-item>
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> list_alt </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>Product Name</p>
-                <p>Carnavon Tigers</p>
-              </div>
-            </igc-list-item>
-            <igc-list-item>
-              <igc-avatar slot="start" shape="circle" class="avatar">
-                <span class="material-icons"> list_alt </span>
-              </igc-avatar>
-              <div slot="title" class="content">
-                <p>Ship Country</p>
-                <p>Mexico</p>
-              </div>
-            </igc-list-item>
-          </igc-list>
-        </igc-tile>
-        <igc-tile col-span="2">
-          <h2 slot="title">Order Line Items</h2>
-          <div class="group">
-            <igc-card class="card">
-              <div class="group_1">
-                <igc-card-header>
-                  <div slot="thumbnail">
-                    <igc-avatar shape="circle">
-                      <span class="material-icons">
-                        production_quantity_limits
-                      </span>
-                    </igc-avatar>
-                  </div>
-                  <h3 slot="title">Carnavon Tigers</h3>
-                </igc-card-header>
-                <igc-card-content class="column">
-                  <div class="body-content">
-                    <span>Quantity</span> <span>12</span>
-                  </div>
-                  <div class="body-content">
-                    <span>Unit Price</span> <span>$50</span>
-                  </div>
-                </igc-card-content>
-              </div>
-            </igc-card>
-            <igc-card class="card">
-              <div class="group_1">
-                <igc-card-header>
-                  <div slot="thumbnail">
-                    <igc-avatar shape="circle">
-                      <span class="material-icons">
-                        production_quantity_limits
-                      </span>
-                    </igc-avatar>
-                  </div>
-                  <h3 slot="title">Guarana Fantastica</h3>
-                </igc-card-header>
-                <igc-card-content class="column">
-                  <div class="body-content">
-                    <span>Quantity</span> <span>10</span>
-                  </div>
-                  <div class="body-content">
-                    <span>Unit Price</span> <span>$4</span>
-                  </div>
-                </igc-card-content>
-              </div>
-            </igc-card>
-            <igc-card class="card">
-              <div class="group_1">
-                <igc-card-header>
-                  <div slot="thumbnail">
-                    <igc-avatar shape="circle">
-                      <span class="material-icons">
-                        production_quantity_limits
-                      </span>
-                    </igc-avatar>
-                  </div>
-                  <h3 slot="title">Vegie-spread</h3>
-                </igc-card-header>
-                <igc-card-content class="column">
-                  <div class="body-content">
-                    <span>Quantity</span> <span>5</span>
-                  </div>
-                  <div class="body-content">
-                    <span>Unit Price</span> <span>$35</span>
-                  </div>
-                </igc-card-content>
-              </div>
-            </igc-card>
-            <igc-card class="card">
-              <div class="group_1">
-                <igc-card-header>
-                  <div slot="thumbnail">
-                    <igc-avatar shape="circle">
-                      <span class="material-icons">
-                        production_quantity_limits
-                      </span>
-                    </igc-avatar>
-                  </div>
-                  <h3 slot="title">Rhonbrau Klosterbier</h3>
-                </igc-card-header>
-                <igc-card-content class="column">
-                  <div class="body-content">
-                    <span>Quantity</span> <span>7</span>
-                  </div>
-                  <div class="body-content">
-                    <span>Unit Price</span> <span>$6</span>
-                  </div>
-                </igc-card-content>
-              </div>
-            </igc-card>
-          </div>
-        </igc-tile>
-        <igc-tile col-span="1">
-          <h2 slot="title">Order Value</h2>
-          <div class="string">
-            <h1>$8.66K</h1>
-          </div>
-        </igc-tile>
-        <igc-tile>
-          <h2 slot="title">Item quantity</h2>
-          <div class="string">
-            <h1>4</h1>
-          </div>
-        </igc-tile>
-      </igc-tile-manager>
-    </div>
-  </div>
-
-  <!-- This script is needed only for parcel and it will be excluded for webpack -->
-  <% if (false) { %>
-    <script src="src/index.ts"></script>
-    <% } %>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/package.json b/samples/layouts/tile-manager/styling/package.json
deleted file mode 100644
index 25b28a29f..000000000
--- a/samples/layouts/tile-manager/styling/package.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "name": "wc-avatar-icon",
-  "version": "1.0.0",
-  "description": "This project provides example of Avatar Icon using IgniteUI for Web Components",
-  "main": "src/index.ts",
-  "scripts": {
-    "build": "npm run build:prod",
-    "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod": "webpack-dev-server --env.NODE_ENV=production  --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start": "npm run serve:dev",
-    "build:legacy": "npm run build:prod:legacy",
-    "build:dev:legacy": "webpack --env.legacy=true  --mode development --config ./webpack.config.js --progress --color --display-error-details",
-    "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true  --mode production --config ./webpack.config.js  --progress  --color --display-error-details --bail",
-    "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
-    "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
-    "start:legacy": "npm run serve:dev:legacy"
-  },
-  "author": "Infragistics",
-  "dependencies": {
-    "@webcomponents/custom-elements": "^1.4.1",
-    "@webcomponents/template": "^1.4.2",
-    "babel-runtime": "^6.26.0",
-    "core-js": "^3.6.5",
-    "igniteui-webcomponents": "5.3.0-beta.2",
-    "lit": "^3.2.0",
-    "lit-html": "^3.2.0",
-    "tslib": "^2.0.0"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/core": "^7.8.3",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@types/source-map": "^0.5.7",
-    "babel-loader": "^8.1.0",
-    "babel-plugin-transform-custom-element-classes": "^0.1.0",
-    "css-loader": "^1.0.0",
-    "csv-loader": "^3.0.2",
-    "file-loader": "^4.2.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.5",
-    "html-webpack-plugin": "^4.3.0",
-    "parcel-bundler": "^1.6.1",
-    "source-map": "^0.7.3",
-    "style-loader": "^0.22.1",
-    "tsconfig-paths-webpack-plugin": "^4.0.0",
-    "typescript": "^4.4.4",
-    "webpack": "^5.96.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.1",
-    "worker-loader": "^3.0.8",
-    "xml-loader": "^1.2.1"
-  },
-  "license": "",
-  "homepage": "."
-}
diff --git a/samples/layouts/tile-manager/styling/sandbox.config.json b/samples/layouts/tile-manager/styling/sandbox.config.json
deleted file mode 100644
index 5c5b54fe2..000000000
--- a/samples/layouts/tile-manager/styling/sandbox.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-    "infiniteLoopProtection": false,
-    "hardReloadOnChange": false,
-    "view": "browser",
-    "template": "parcel"
-}
-  
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/src/index.css b/samples/layouts/tile-manager/styling/src/index.css
deleted file mode 100644
index 0fe936871..000000000
--- a/samples/layouts/tile-manager/styling/src/index.css
+++ /dev/null
@@ -1,2 +0,0 @@
-/* shared styles are loaded from: */
-/* https://static.infragistics.com/xplatform/css/samples */
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/src/index.ts b/samples/layouts/tile-manager/styling/src/index.ts
deleted file mode 100644
index 106e0703d..000000000
--- a/samples/layouts/tile-manager/styling/src/index.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { defineComponents, IgcAvatarComponent, IgcCardComponent, IgcListComponent, IgcTileManagerComponent } from 'igniteui-webcomponents';
-import 'igniteui-webcomponents/themes/light/bootstrap.css';
-import './layout.css'
-import './styles.css'
-
-defineComponents(IgcTileManagerComponent, IgcListComponent, IgcAvatarComponent, IgcCardComponent);
-
-export class TileManagerStyling {
-  constructor() {
-  }
-}
-
-new TileManagerStyling();
diff --git a/samples/layouts/tile-manager/styling/src/layout.css b/samples/layouts/tile-manager/styling/src/layout.css
deleted file mode 100644
index 3bb137362..000000000
--- a/samples/layouts/tile-manager/styling/src/layout.css
+++ /dev/null
@@ -1,50 +0,0 @@
-igc-tile-manager {
-  max-width: 1000px;
-  margin-bottom: 20px;
-}
-
-.sample {
-  overflow: auto;
-}
-
-.group {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-evenly;
-  flex-wrap: wrap;
-  margin-top: 25px;
-
-}
-
-.card {
-  min-height: 30px;
-  width: 285px;
-  min-width: 285px;
-  max-width: 285px;
-}
-
-igc-card-content {
-  color: var(--content-text-color);
-}
-
-.body-content {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.card:nth-child(n+3) {
-  margin-top: 10px;
-}
-
-h2 {
-  font-size: 22px;
-}
-
-.string {
-  text-align: center;
-  margin-top: 50px;
-  color: var(--ig-gray-800);
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/src/styles.css b/samples/layouts/tile-manager/styling/src/styles.css
deleted file mode 100644
index 46c00c9fb..000000000
--- a/samples/layouts/tile-manager/styling/src/styles.css
+++ /dev/null
@@ -1,15 +0,0 @@
-igc-tile-manager::part(base) {
-  background-color: var(--ig-surface-900);
-}
-
-igc-tile::part(content-container) {
-  color: var(--ig-secondary-200);
-}
-
-igc-tile::part(header) {
-  background-color: var(--ig-gray-300);
-}
-
-igc-tile::part(title) {
-  color: var(--ig-primary-400);
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/tsconfig.json b/samples/layouts/tile-manager/styling/tsconfig.json
deleted file mode 100644
index de23257dd..000000000
--- a/samples/layouts/tile-manager/styling/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-      "noImplicitReturns": true,
-      "esModuleInterop": true,
-      "noImplicitAny": true,
-      "declarationDir": "dist/types",
-      "moduleResolution": "node",
-      "declaration": true,
-      "target": "es2015",
-      "module": "es2015",
-      "strict": true
-  },
-  "include": [
-      "src/**/*"
-  ],
-  "exclude": [
-      "node_modules",
-      "dist"
-  ]
-}
\ No newline at end of file
diff --git a/samples/layouts/tile-manager/styling/webpack.config.js b/samples/layouts/tile-manager/styling/webpack.config.js
deleted file mode 100644
index 9d11a6155..000000000
--- a/samples/layouts/tile-manager/styling/webpack.config.js
+++ /dev/null
@@ -1,105 +0,0 @@
-const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const path = require('path');
-const webpack = require('webpack');
-
-module.exports = env => {
-    const nodeEnv = process.env.NODE_ENV || 'development';
-    const isProd = nodeEnv === 'production';
-    const isLegacy = !!process.env.legacy && !(process.env.legacy == "false");
-    console.log(">> webpack nodeEnv=" + nodeEnv);
-    console.log(">> webpack isProd=" + isProd);
-    console.log(">> webpack isLegacy=" + isLegacy);
-    const presets = [
-        ["@babel/preset-env", {
-            "useBuiltIns": "usage",
-            "corejs": 3,
-            "targets": {
-                "browsers": isLegacy ? ["defaults"] : [
-                    "last 2 Chrome versions",
-                    "last 2 Safari versions",
-                    "last 2 iOS versions",
-                    "last 2 Firefox versions",
-                    "last 2 Edge versions"]
-            }
-        }],
-        "@babel/preset-typescript"
-    ];
-
-    return {
-        entry: isLegacy ? [
-            path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'),
-            path.resolve(__dirname, 'node_modules/@webcomponents/template'),
-            path.resolve(__dirname, 'src')
-        ] : path.resolve(__dirname, 'src'),
-        devtool: isProd ? false : 'source-map',
-        output: {
-            filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js',
-            globalObject: 'this',
-            path: path.resolve(__dirname, 'dist'),
-        },
-
-        resolve: {
-            mainFields: ['esm2015', 'module', 'main'],
-            extensions: ['.ts', '.js', '.json'],
-            plugins: [new TsconfigPathsPlugin({
-                configFile: './tsconfig.json',
-                extensions: ['.ts', '.js'],
-                mainFields: ['esm2015', 'module', 'main']
-            })]
-        },
-
-        module: {
-            rules: [
-                { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] },
-                { test: /\.(csv|tsv)$/, use: ['csv-loader'] },
-                { test: /\.xml$/, use: ['xml-loader'] },
-                { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] },
-                {
-                    test: /worker\.(ts|js)$/,
-                    use: [
-                        { loader: 'worker-loader' },
-                        {
-                            loader: 'babel-loader', options: {
-                                "compact": isProd ? true : false,
-                                "presets": presets,
-                                "plugins": [
-                                    "@babel/plugin-proposal-class-properties",
-                                    "@babel/plugin-transform-runtime"
-                                ]
-                            }
-                        }
-                    ]
-                },
-                {
-                    test: /\.(ts|js)$/, loader: 'babel-loader',
-                    options: {
-                        "compact": isProd ? true : false,
-                        "presets": presets,
-                        "plugins": [
-                            "@babel/plugin-proposal-class-properties",
-                            "@babel/plugin-transform-runtime"
-                        ]
-                    },
-                    exclude:
-                        function (modulePath) {
-                            return /node_modules/.test(modulePath) &&
-                                !/igniteui-webcomponents/.test(modulePath) &&
-                                !/lit-html/.test(modulePath);
-                        }
-                }],
-        },
-
-        plugins: [
-            new webpack.DefinePlugin({
-                'process.env.NODE_ENV': JSON.stringify(nodeEnv)
-            }),
-            new HtmlWebpackPlugin({
-                title: 'for-cs',
-                template: 'index.html'
-            }),
-            new ForkTsCheckerWebpackPlugin()
-        ]
-    };
-};