chore(ui5-toolbar): toolbar item wrapper introduced (#12243)

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar-item): wrappers introduced

* chore(ui5-toolbar-item): toolbar wrappers

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar-item): item wrapers introduced

* chore(ui5-toolbar-item): items wrappers introduced

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar): item wrappers introduced

* fix(ui5-shellbar): adjust sizes-parameters for shellbar

* chore(ui5-toolbar): wrappers introduced

* fix(ui5-toolbar): toolbar items introduced

* chore(ui5-toolbar): toolbar wrappers introduced

* chore(ui5-toolbar): wrappers introduced

* chore(ui5-toolbar): toolbarItem wrappers

* chore(ui5-toolbar): toolbar wrappers introduced

* chore(ui5-toolbar): toolbar item wrapper introduced

* chore(ui5-toolbar-item): wrappers introduced

* Delete packages/main/test/pages/ToolbarWrappers.html

* chore(ui5-toolbar): fix tests

* chore(ui5-toolbar): fix click event handling in ToolbarItem

* chore(ui5-toolbar): fix toolbar items

* chore(ui5-toolbar): fix OTB width

* fix(ui5-toolbar): enhance overflow handling and add new toolbar item examples

* chore(ui5-toolbar): fix reviwe comments

* chore(ui5-toolbar): fix review comments

* fix(ui5-toolbar): fix tests

* chore(ui5-toolbar): review comments

* fix(ui5-toolbar): migrate ToolbarItem to UI5 Web Component

* fix(ui5-toolbar-item): item wrapper introduced

* fix(ui5-toolbar-item): general wrapper introduced

* fix(ui5-toolbar-item): remove code from components that is not needed

* fix(ui5-toolbar-item): code-review comments addressed

* fix(ui5-toolbar-item): code-review comments addressed

* fix(ui5-toolbar-item): correct code issue

* fix(ui5-toolbar-item): checkForWrapper fixed

* fix(ui5-toolbar-item): code reviews feedback implementation

* fix(ui5-toolbar): typo in sample fixed

* chore(ui5-toolbar): experimental flag added

* chore(ui5-toolbar): failing tests fixed

* chore(ui5-toolbar): failing tests fixed

* feat(ui5-toolbar): failing tests fixed

Author: PetyaMarkovaBogdanova

packages/main/cypress/specs/Toolbar.cy.tsx

@@ -4,7 +4,7 @@ import ToolbarSelect from "../../src/ToolbarSelect.js";
 import ToolbarSelectOption from "../../src/ToolbarSelectOption.js";
 import ToolbarSeparator from "../../src/ToolbarSeparator.js";
 import ToolbarSpacer from "../../src/ToolbarSpacer.js";
-import type ToolbarItem from "../../src/ToolbarItem.js";
+import ToolbarItem from "../../src/ToolbarItem.js";
 import add from "@ui5/webcomponents-icons/dist/add.js";
 import decline from "@ui5/webcomponents-icons/dist/decline.js";
 import employee from "@ui5/webcomponents-icons/dist/employee.js";
@@ -123,7 +123,7 @@ describe("Toolbar general interaction", () => {
 			.should("exist", "hidden class attached to tb button, meaning it's not shown as expected");
 	});
 
-	it("Should call event handlers on abstract item", () => {
+	it("Should call event handlers on item", () => {
 		cy.mount(
 			<Toolbar>
 				<ToolbarButton text="Button 1"></ToolbarButton>
@@ -575,6 +575,7 @@ describe("ToolbarButton", () => {
 		cy.get("@toolbar").then($toolbar => {
 			const toolbar = $toolbar[0] as Toolbar;
 			const addButton = document.getElementById("add-btn") as ToolbarButton;
+
 			expect(toolbar.itemsToOverflow.includes(addButton)).to.be.true;
 
 			const initialOverflowCount = toolbar.itemsToOverflow.length;
@@ -664,3 +665,4 @@ describe("ToolbarButton", () => {
 			.should("contain.text", "Decline Item");
 	});
 });
+