From cd8e50278f52a21027e1ff8d976eeb96e24cbd56 Mon Sep 17 00:00:00 2001
From: plamenivanov91 <plamen.ivanov01@sap.com>
Date: Tue, 7 Nov 2023 13:53:30 +0200
Subject: [PATCH 1/5] docs: new cem for Topic-P components - Icon Issue: #7610

---
 packages/main/src/Icon.ts | 39 +++++++++++----------------------------
 1 file changed, 11 insertions(+), 28 deletions(-)

diff --git a/packages/main/src/Icon.ts b/packages/main/src/Icon.ts
index c8c6d342ff93..7c513dbab282 100644
--- a/packages/main/src/Icon.ts
+++ b/packages/main/src/Icon.ts
@@ -90,16 +90,6 @@ const PRESENTATION_ROLE = "presentation";
  * <code>&lt;ui5-icon name="business-suite/ab-testing">&lt;/ui5-icon></code>
  *
  * <br><br>
- * <h3>CSS Shadow Parts</h3>
- *
- * <ui5-link target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/CSS/::part">CSS Shadow Parts</ui5-link> allow developers to style elements inside the Shadow DOM.
- * <br>
- * The <code>ui5-icon</code> exposes the following CSS Shadow Parts:
- * <ul>
- * <li>root - Used to style the outermost wrapper of the <code>ui5-icon</code></li>
- * </ul>
- *
- * <br><br>
  * <h3>Keyboard Handling</h3>
  *
  * <ul>
@@ -111,12 +101,11 @@ const PRESENTATION_ROLE = "presentation";
  *
  * <code>import "@ui5/webcomponents/dist/Icon.js";</code>
  *
+ * @csspart root - Used to style the outermost wrapper of the <code>ui5-icon</code>.
+ *
  * @constructor
- * @author SAP SE
- * @alias sap.ui.webc.main.Icon
- * @extends sap.ui.webc.base.UI5Element
- * @tagname ui5-icon
- * @implements sap.ui.webc.main.IIcon
+ * @extends UI5Element
+ * @implements {IIcon}
  * @public
  */
 @customElement({
@@ -139,9 +128,8 @@ class Icon extends UI5Element {
 	/**
 	 * Defines the component semantic design.
 	 *
-	 * @type {sap.ui.webc.main.types.IconDesign}
-	 * @name sap.ui.webc.main.Icon.prototype.design
-	 * @defaultvalue "Default"
+	 * @type {IconDesign}
+	 * @default "Default"
 	 * @public
 	 * @since 1.9.2
 	 */
@@ -150,9 +138,8 @@ class Icon extends UI5Element {
 
 	/**
 	 * Defines if the icon is interactive (focusable and pressable)
-	 * @name sap.ui.webc.main.Icon.prototype.interactive
 	 * @type {boolean}
-	 * @defaultvalue false
+	 * @default false
 	 * @public
 	 * @since 1.0.0-rc.8
 	 */
@@ -190,9 +177,8 @@ class Icon extends UI5Element {
 	 * Example:
 	 * <br>
 	 * <code>name='business-suite/3d'</code>, <code>name='business-suite/1x2-grid-layout'</code>, <code>name='business-suite/4x4-grid-layout'</code>.
-	 * @name sap.ui.webc.main.Icon.prototype.name
 	 * @type {string}
-	 * @defaultvalue ""
+	 * @default ""
 	 * @public
 	 */
 	@property()
@@ -205,9 +191,8 @@ class Icon extends UI5Element {
 	 * <b>Note:</b> Every icon should have a text alternative in order to
 	 * calculate its accessible name.
 	 *
-	 * @name sap.ui.webc.main.Icon.prototype.accessibleName
 	 * @type {string}
-	 * @defaultvalue ""
+	 * @default ""
 	 * @public
 	 */
 	@property()
@@ -218,9 +203,8 @@ class Icon extends UI5Element {
 	 * <br><br>
 	 * <b>Note:</b> The tooltip text should be provided via the <code>accessible-name</code> property.
 	 *
-	 * @name sap.ui.webc.main.Icon.prototype.showTooltip
 	 * @type {boolean}
-	 * @defaultvalue false
+	 * @default false
 	 * @public
 	 */
 	@property({ type: Boolean })
@@ -228,9 +212,8 @@ class Icon extends UI5Element {
 
 	/**
 	 * Defines the accessibility role of the component.
-	 * @name sap.ui.webc.main.Icon.prototype.accessibleRole
 	 * @type {string}
-	 * @defaultvalue ""
+	 * @default ""
 	 * @public
 	 * @since 1.1.0
 	 */

From eff0298688142b6ce571d27e726cb9d86dbb2549 Mon Sep 17 00:00:00 2001
From: plamenivanov91 <plamen.ivanov01@sap.com>
Date: Mon, 13 Nov 2023 15:37:57 +0200
Subject: [PATCH 2/5] docs: new cem for Topic-P components - Icon -fixed review
 comments

---
 packages/main/src/Icon.ts       | 9 ++-------
 packages/main/src/Interfaces.ts | 3 +--
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/packages/main/src/Icon.ts b/packages/main/src/Icon.ts
index 7c513dbab282..1d8cb6fc0064 100644
--- a/packages/main/src/Icon.ts
+++ b/packages/main/src/Icon.ts
@@ -10,6 +10,7 @@ import { isSpace, isEnter } from "@ui5/webcomponents-base/dist/Keys.js";
 import executeTemplate from "@ui5/webcomponents-base/dist/renderer/executeTemplate.js";
 import IconTemplate from "./generated/templates/IconTemplate.lit.js";
 import IconDesign from "./types/IconDesign.js";
+import type { IIcon } from "./Interfaces";
 
 // Styles
 import iconCss from "./generated/themes/Icon.css.js";
@@ -124,11 +125,10 @@ const PRESENTATION_ROLE = "presentation";
  * @since 1.0.0-rc.8
  */
 @event("click")
-class Icon extends UI5Element {
+class Icon extends UI5Element implements IIcon {
 	/**
 	 * Defines the component semantic design.
 	 *
-	 * @type {IconDesign}
 	 * @default "Default"
 	 * @public
 	 * @since 1.9.2
@@ -138,7 +138,6 @@ class Icon extends UI5Element {
 
 	/**
 	 * Defines if the icon is interactive (focusable and pressable)
-	 * @type {boolean}
 	 * @default false
 	 * @public
 	 * @since 1.0.0-rc.8
@@ -177,7 +176,6 @@ class Icon extends UI5Element {
 	 * Example:
 	 * <br>
 	 * <code>name='business-suite/3d'</code>, <code>name='business-suite/1x2-grid-layout'</code>, <code>name='business-suite/4x4-grid-layout'</code>.
-	 * @type {string}
 	 * @default ""
 	 * @public
 	 */
@@ -191,7 +189,6 @@ class Icon extends UI5Element {
 	 * <b>Note:</b> Every icon should have a text alternative in order to
 	 * calculate its accessible name.
 	 *
-	 * @type {string}
 	 * @default ""
 	 * @public
 	 */
@@ -203,7 +200,6 @@ class Icon extends UI5Element {
 	 * <br><br>
 	 * <b>Note:</b> The tooltip text should be provided via the <code>accessible-name</code> property.
 	 *
-	 * @type {boolean}
 	 * @default false
 	 * @public
 	 */
@@ -212,7 +208,6 @@ class Icon extends UI5Element {
 
 	/**
 	 * Defines the accessibility role of the component.
-	 * @type {string}
 	 * @default ""
 	 * @public
 	 * @since 1.1.0
diff --git a/packages/main/src/Interfaces.ts b/packages/main/src/Interfaces.ts
index 6240ff43baaf..aa37e77f614b 100644
--- a/packages/main/src/Interfaces.ts
+++ b/packages/main/src/Interfaces.ts
@@ -64,11 +64,10 @@ const IColorPaletteItem = "sap.ui.webc.main.IColorPaletteItem";
 /**
  * Interface for components that represent an icon, usable in numerous higher-order components
  *
- * @name sap.ui.webc.main.IIcon
  * @interface
  * @public
  */
-const IIcon = "sap.ui.webc.main.IIcon";
+interface IIcon extends HTMLElement { }
 
 /**
  * Interface for components that represent an input, usable in numerous higher-order components

From 7d36604a99263e4a1601104680dff2d2a4602d76 Mon Sep 17 00:00:00 2001
From: plamenivanov91 <plamen.ivanov01@sap.com>
Date: Mon, 13 Nov 2023 15:40:29 +0200
Subject: [PATCH 3/5] docs: new cem for Topic-P components - Icon -ignored lint
 error

---
 packages/main/src/Interfaces.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/main/src/Interfaces.ts b/packages/main/src/Interfaces.ts
index aa37e77f614b..cd267e56c5be 100644
--- a/packages/main/src/Interfaces.ts
+++ b/packages/main/src/Interfaces.ts
@@ -67,6 +67,7 @@ const IColorPaletteItem = "sap.ui.webc.main.IColorPaletteItem";
  * @interface
  * @public
  */
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
 interface IIcon extends HTMLElement { }
 
 /**

From 1534d897f15f52f947a96430ca498a5548e4b6c8 Mon Sep 17 00:00:00 2001
From: Ivaylo Plashkov <ivaylo.plashkov@sap.com>
Date: Mon, 20 Nov 2023 09:55:12 +0200
Subject: [PATCH 4/5] fix(ui5-wizard): scrollbar styles are now present on root
 (#7838)

---
 packages/fiori/src/Wizard.hbs | 2 +-
 packages/fiori/src/Wizard.ts  | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/fiori/src/Wizard.hbs b/packages/fiori/src/Wizard.hbs
index ff477052c20b..aa9f5c4e6b0a 100644
--- a/packages/fiori/src/Wizard.hbs
+++ b/packages/fiori/src/Wizard.hbs
@@ -1,4 +1,4 @@
-<div class="ui5-wiz-root" aria-label="{{ariaLabelText}}" role="region">
+<div class="{{classes.root}}" aria-label="{{ariaLabelText}}" role="region">
 	<nav class="ui5-wiz-nav" part="navigator" aria-label="{{navAriaLabelText}}" tabindex="-1">
 		<div class="ui5-wiz-nav-list" role="list" aria-label="{{listAriaLabelText}}" aria-describedby="wiz-nav-descr" aria-controls="{{_id}}-wiz-content">
 			{{#each _stepsInHeader}}
diff --git a/packages/fiori/src/Wizard.ts b/packages/fiori/src/Wizard.ts
index e48af5cd4451..1d980864d2af 100644
--- a/packages/fiori/src/Wizard.ts
+++ b/packages/fiori/src/Wizard.ts
@@ -5,6 +5,7 @@ import event from "@ui5/webcomponents-base/dist/decorators/event.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
 import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import getEffectiveScrollbarStyle from "@ui5/webcomponents-base/dist/util/getEffectiveScrollbarStyle.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import NavigationMode from "@ui5/webcomponents-base/dist/types/NavigationMode.js";
@@ -360,6 +361,10 @@ class Wizard extends UI5Element {
 
 	get classes() {
 		return {
+			root: {
+				"ui5-wiz-root": true,
+				"ui5-content-native-scrollbars": getEffectiveScrollbarStyle(),
+			},
 			popover: {
 				"ui5-wizard-responsive-popover": true,
 				"ui5-wizard-popover": !isPhone(),

From d548da545ed6e9e9e9f27502f9dd75b8e3343781 Mon Sep 17 00:00:00 2001
From: plamenivanov91 <plamen.ivanov01@sap.com>
Date: Mon, 20 Nov 2023 11:34:45 +0200
Subject: [PATCH 5/5] docs: new cem for Topic-P components - Icon -removed
 @interace jsdoc tag from interfaces file

---
 packages/main/src/Interfaces.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/main/src/Interfaces.ts b/packages/main/src/Interfaces.ts
index cd267e56c5be..3eb36ee8caf5 100644
--- a/packages/main/src/Interfaces.ts
+++ b/packages/main/src/Interfaces.ts
@@ -64,7 +64,6 @@ const IColorPaletteItem = "sap.ui.webc.main.IColorPaletteItem";
 /**
  * Interface for components that represent an icon, usable in numerous higher-order components
  *
- * @interface
  * @public
  */
 // eslint-disable-next-line @typescript-eslint/no-empty-interface