From 2b679178806b02d7f6f45a613ccb50ab727e6847 Mon Sep 17 00:00:00 2001
From: tfsbuild <tfsbuild@infragistics.com>
Date: Mon, 15 Jul 2024 15:49:44 -0400
Subject: [PATCH] Adding changes from build
 igniteui-xplat-examples-output+PRs_2024.7.15.1

---
 .../annotations-all/package.json              |  2 +-
 .../annotations-callouts/package.json         |  2 +-
 .../annotations-crosshairs/package.json       |  2 +-
 .../annotations-custom/package.json           |  2 +-
 .../annotations-final-value/package.json      |  2 +-
 .../annotations-highlighting/package.json     |  2 +-
 .../category-chart/axis-gap/package.json      |  2 +-
 .../axis-gridlines/package.json               |  2 +-
 .../category-chart/axis-inverted/package.json |  2 +-
 .../category-chart/axis-labels/package.json   |  2 +-
 .../axis-locations/package.json               |  2 +-
 .../category-chart/axis-overlap/package.json  |  2 +-
 .../category-chart/axis-range/package.json    |  2 +-
 .../axis-tickmarks/package.json               |  2 +-
 .../chart-highlight-filter/package.json       |  2 +-
 .../column-chart-with-tooltips/package.json   |  2 +-
 .../custom-selection/src/app.component.ts     | 33 ++++++++++++++++++-
 .../data-aggregations/package.json            |  2 +-
 .../category-chart/data-filter/package.json   |  2 +-
 .../data-tooltip-positioning/package.json     |  2 +-
 .../highlighting-behavior/package.json        |  2 +-
 .../highlighting-mode/package.json            |  2 +-
 .../marker-options/package.json               |  2 +-
 .../selection-multiple-modes/package.json     |  2 +-
 .../category-chart/value-lines/package.json   |  2 +-
 .../axis-label-rotation/package.json          |  2 +-
 .../package.json                              |  2 +-
 .../package.json                              |  2 +-
 .../chart-highlight-filter/package.json       |  2 +-
 .../data-chart/transition-event/package.json  |  2 +-
 samples/charts/sparkline/markers/package.json |  2 +-
 .../sparkline/normal-range/package.json       |  2 +-
 .../charts/sparkline/trendlines/package.json  |  2 +-
 .../sparkline/unknown-values/package.json     |  2 +-
 samples/charts/toolbar/theming/package.json   |  2 +-
 .../charts/tree-map/highlighting/package.json |  2 +-
 samples/charts/tree-map/layout/package.json   |  2 +-
 37 files changed, 68 insertions(+), 37 deletions(-)

diff --git a/samples/charts/category-chart/annotations-all/package.json b/samples/charts/category-chart/annotations-all/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-all/package.json
+++ b/samples/charts/category-chart/annotations-all/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/annotations-callouts/package.json b/samples/charts/category-chart/annotations-callouts/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-callouts/package.json
+++ b/samples/charts/category-chart/annotations-callouts/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/annotations-crosshairs/package.json b/samples/charts/category-chart/annotations-crosshairs/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-crosshairs/package.json
+++ b/samples/charts/category-chart/annotations-crosshairs/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/annotations-custom/package.json b/samples/charts/category-chart/annotations-custom/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-custom/package.json
+++ b/samples/charts/category-chart/annotations-custom/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/annotations-final-value/package.json b/samples/charts/category-chart/annotations-final-value/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-final-value/package.json
+++ b/samples/charts/category-chart/annotations-final-value/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/annotations-highlighting/package.json b/samples/charts/category-chart/annotations-highlighting/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/annotations-highlighting/package.json
+++ b/samples/charts/category-chart/annotations-highlighting/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-gap/package.json b/samples/charts/category-chart/axis-gap/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-gap/package.json
+++ b/samples/charts/category-chart/axis-gap/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-gridlines/package.json b/samples/charts/category-chart/axis-gridlines/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-gridlines/package.json
+++ b/samples/charts/category-chart/axis-gridlines/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-inverted/package.json b/samples/charts/category-chart/axis-inverted/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-inverted/package.json
+++ b/samples/charts/category-chart/axis-inverted/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-labels/package.json b/samples/charts/category-chart/axis-labels/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-labels/package.json
+++ b/samples/charts/category-chart/axis-labels/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-locations/package.json b/samples/charts/category-chart/axis-locations/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-locations/package.json
+++ b/samples/charts/category-chart/axis-locations/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-overlap/package.json b/samples/charts/category-chart/axis-overlap/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-overlap/package.json
+++ b/samples/charts/category-chart/axis-overlap/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-range/package.json b/samples/charts/category-chart/axis-range/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-range/package.json
+++ b/samples/charts/category-chart/axis-range/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/axis-tickmarks/package.json b/samples/charts/category-chart/axis-tickmarks/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/axis-tickmarks/package.json
+++ b/samples/charts/category-chart/axis-tickmarks/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/chart-highlight-filter/package.json b/samples/charts/category-chart/chart-highlight-filter/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/chart-highlight-filter/package.json
+++ b/samples/charts/category-chart/chart-highlight-filter/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/column-chart-with-tooltips/package.json b/samples/charts/category-chart/column-chart-with-tooltips/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/column-chart-with-tooltips/package.json
+++ b/samples/charts/category-chart/column-chart-with-tooltips/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/custom-selection/src/app.component.ts b/samples/charts/category-chart/custom-selection/src/app.component.ts
index 63d10096c..5a7eceefa 100644
--- a/samples/charts/category-chart/custom-selection/src/app.component.ts
+++ b/samples/charts/category-chart/custom-selection/src/app.component.ts
@@ -1,6 +1,7 @@
 import { AfterViewInit, Component, ViewChild, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
 import { SelectableDataItem, SelectableData } from './SelectableData';
-import { IgxDataLegendComponent, IgxCategoryChartComponent } from 'igniteui-angular-charts';
+import { IgxCategoryChartComponent, IgxDomainChartSeriesPointerEventArgs } from 'igniteui-angular-charts';
+import { IgxDataLegendComponent } from 'igniteui-angular-charts';
 
 @Component({
     selector: "app-root",
@@ -33,5 +34,35 @@ export class AppComponent implements AfterViewInit
 	{
 	}
 
+	public categoryChartCustomSelectionPointerDown({ sender, args }: { sender: any, args: IgxDomainChartSeriesPointerEventArgs }): void {
+
+	    var chart = this.chart;
+	    var selectableData = chart.dataSource as SelectableData;
+	let oldItem = args.item as SelectableDataItem;
+
+	    if (oldItem === null) return;
+
+	    let newItem: SelectableDataItem = new SelectableDataItem({
+	        category: oldItem.category,
+	        dataValue: oldItem.dataValue,
+	        selectedValue: oldItem.selectedValue
+	    });
+
+	    var selectedIndex = -1;
+	    for (var i = 0; i < selectableData.length; i++) {
+	        if (oldItem.category === selectableData[i].category) {
+	            selectedIndex = i;
+	            break;
+	        }
+	    }
+
+	    if (oldItem.selectedValue === oldItem.dataValue)
+	        newItem.selectedValue = null;
+	    else
+	        newItem.selectedValue = newItem.dataValue;
+
+	    chart.notifySetItem(selectableData, selectedIndex, oldItem, newItem);
+	}
+
 }
 
diff --git a/samples/charts/category-chart/data-aggregations/package.json b/samples/charts/category-chart/data-aggregations/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/data-aggregations/package.json
+++ b/samples/charts/category-chart/data-aggregations/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/data-filter/package.json b/samples/charts/category-chart/data-filter/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/data-filter/package.json
+++ b/samples/charts/category-chart/data-filter/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/data-tooltip-positioning/package.json b/samples/charts/category-chart/data-tooltip-positioning/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/data-tooltip-positioning/package.json
+++ b/samples/charts/category-chart/data-tooltip-positioning/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/highlighting-behavior/package.json b/samples/charts/category-chart/highlighting-behavior/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/highlighting-behavior/package.json
+++ b/samples/charts/category-chart/highlighting-behavior/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/highlighting-mode/package.json b/samples/charts/category-chart/highlighting-mode/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/highlighting-mode/package.json
+++ b/samples/charts/category-chart/highlighting-mode/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/marker-options/package.json b/samples/charts/category-chart/marker-options/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/marker-options/package.json
+++ b/samples/charts/category-chart/marker-options/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/selection-multiple-modes/package.json b/samples/charts/category-chart/selection-multiple-modes/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/selection-multiple-modes/package.json
+++ b/samples/charts/category-chart/selection-multiple-modes/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/category-chart/value-lines/package.json b/samples/charts/category-chart/value-lines/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/category-chart/value-lines/package.json
+++ b/samples/charts/category-chart/value-lines/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/data-chart/axis-label-rotation/package.json b/samples/charts/data-chart/axis-label-rotation/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/data-chart/axis-label-rotation/package.json
+++ b/samples/charts/data-chart/axis-label-rotation/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/data-chart/chart-highlight-filter-datasource/package.json b/samples/charts/data-chart/chart-highlight-filter-datasource/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/data-chart/chart-highlight-filter-datasource/package.json
+++ b/samples/charts/data-chart/chart-highlight-filter-datasource/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/data-chart/chart-highlight-filter-multiple-series/package.json b/samples/charts/data-chart/chart-highlight-filter-multiple-series/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/data-chart/chart-highlight-filter-multiple-series/package.json
+++ b/samples/charts/data-chart/chart-highlight-filter-multiple-series/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/data-chart/chart-highlight-filter/package.json b/samples/charts/data-chart/chart-highlight-filter/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/data-chart/chart-highlight-filter/package.json
+++ b/samples/charts/data-chart/chart-highlight-filter/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/data-chart/transition-event/package.json b/samples/charts/data-chart/transition-event/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/data-chart/transition-event/package.json
+++ b/samples/charts/data-chart/transition-event/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/sparkline/markers/package.json b/samples/charts/sparkline/markers/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/sparkline/markers/package.json
+++ b/samples/charts/sparkline/markers/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/sparkline/normal-range/package.json b/samples/charts/sparkline/normal-range/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/sparkline/normal-range/package.json
+++ b/samples/charts/sparkline/normal-range/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/sparkline/trendlines/package.json b/samples/charts/sparkline/trendlines/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/sparkline/trendlines/package.json
+++ b/samples/charts/sparkline/trendlines/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/sparkline/unknown-values/package.json b/samples/charts/sparkline/unknown-values/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/sparkline/unknown-values/package.json
+++ b/samples/charts/sparkline/unknown-values/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/toolbar/theming/package.json b/samples/charts/toolbar/theming/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/toolbar/theming/package.json
+++ b/samples/charts/toolbar/theming/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/tree-map/highlighting/package.json b/samples/charts/tree-map/highlighting/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/tree-map/highlighting/package.json
+++ b/samples/charts/tree-map/highlighting/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",
diff --git a/samples/charts/tree-map/layout/package.json b/samples/charts/tree-map/layout/package.json
index 292eee597..b5daa37a0 100644
--- a/samples/charts/tree-map/layout/package.json
+++ b/samples/charts/tree-map/layout/package.json
@@ -22,7 +22,7 @@
     "igniteui-angular-core": "17.3.1-alpha.0",
     "igniteui-angular-inputs": "17.3.1-alpha.0",
     "igniteui-angular-layouts": "17.3.1-alpha.0",
-    "igniteui-webcomponents": "4.9.0",
+    "igniteui-webcomponents": "4.11.1",
     "intl": "1.2.5",
     "jszip": "3.8.0",
     "rxjs": "7.8.1",