refactor(ui5-shellbar-item): rename "item-click" to "click" (#4282)

Change event name from "item-click" to "click" as it belongs to the ShellBarItem, not the ShellBar and using "item" in the event's name does not make sense and this is also the rule we used throughout the major API change activity in RC.15.

BREAKING CHANGE: ShellBarItem's event "item-click" has been renamed to "click".

Author: ilhan007

packages/fiori/src/ShellBar.js

@@ -729,7 +729,7 @@ class ShellBar extends UI5Element {
 				return this.shadowRoot.querySelector(`#${refItemId}`);
 			});
 
-			const prevented = !shellbarItem.fireEvent("item-click", { targetRef: event.target }, true);
+			const prevented = !shellbarItem.fireEvent("click", { targetRef: event.target }, true);
 
 			this._defaultItemPressPrevented = prevented;
 		}

packages/fiori/src/ShellBarItem.js

@@ -43,12 +43,13 @@ const metadata = {
 		/**
 		 * Fired, when the item is pressed.
 		 *
-		 * @event sap.ui.webcomponents.fiori.ShellBarItem#item-click
+		 * @event sap.ui.webcomponents.fiori.ShellBarItem#click
 		 * @allowPreventDefault
 		 * @param {HTMLElement} targetRef DOM ref of the clicked element
 		 * @public
+		 * @native
 		 */
-		"item-click": {
+		"click": {
 			detail: {
 				targetRef: { type: HTMLElement },
 			},

packages/fiori/test/pages/ShellBar.html

@@ -213,6 +213,8 @@ <h3>ShellBar in Compact</h3>
 		<ui5-shellbar-item icon="discussion" count="2" id="test-invalidation-item"/>
 	</ui5-shellbar>
 
+	<ui5-toast id="wcToastTC">Custom Action Fired</ui5-toast>
+	
 	<script>
 		mySearch.addEventListener("suggestionItemSelect", function (event) {
 			 console.log(event);
@@ -269,14 +271,14 @@ <h3>ShellBar in Compact</h3>
 		});
 
 		Array.from(document.querySelectorAll("ui5-shellbar-item")).forEach(function(item) {
-			item.addEventListener("item-click", function(event) {
-				console.log(event.detail.targetRef);
+			item.addEventListener("ui5-click", function(event) {
+				wcToastTC.show();
 			});
 		});
 
 		["disc", "call"].forEach(function(id) {
 			var currenItem = window[id][0] || window[id];
-			currenItem.addEventListener("ui5-itemClick", function(event) {
+			currenItem.addEventListener("ui5-click", function(event) {
 				event.preventDefault();
 				window["press-input"].value = event.target.id;
 				window["custom-item-popover"].showAt(event.detail.targetRef);