@openui5/sap.ui.webc.fiori 1.96.2 → 1.97.0

package/.reuse/dep5

@@ -418,7 +418,7 @@ Comment: these files contain content from SAP and BooleanExpressionEvaluator: Bo
 
 # Library: sap.ui.webc.common:
 
-Files: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theme-base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.*
+Files: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theming/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-business-suite/*.*
 Copyright: SAP
 License: Apache-2.0
 Comment: these files belong to: UI5 Web Components

package/THIRDPARTY.txt

@@ -412,10 +412,11 @@ Copyright: SAP
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.*
-	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theme-base/*.*
+	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theming/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.*
+	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-business-suite/*.*
 
 Component: lit-html, version: 1.4.1
 Copyright: Google LLC

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.ui.webc.fiori",
-  "version": "1.96.2",
+  "version": "1.97.0",
   "description": "OpenUI5 UI Library sap.ui.webc.fiori",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -16,8 +16,8 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.ui.core": "1.96.2",
-    "@openui5/sap.ui.webc.main": "1.96.2",
-    "@openui5/sap.ui.webc.common": "1.96.2"
+    "@openui5/sap.ui.core": "1.97.0",
+    "@openui5/sap.ui.webc.main": "1.97.0",
+    "@openui5/sap.ui.webc.common": "1.97.0"
   }
 }

package/src/sap/ui/webc/fiori/.library

@@ -3,7 +3,7 @@
 
 	<name>sap.ui.webc.fiori</name>
 	<vendor>SAP SE</vendor>
-	<version>1.96.2</version>
+	<version>1.97.0</version>
 	<copyright>OpenUI5
  * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>

package/src/sap/ui/webc/fiori/Bar.js

@@ -39,7 +39,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/BarcodeScannerDialog.js

@@ -32,12 +32,12 @@ sap.ui.define([
 	 * For a list of supported barcode formats, see the <ui5-link target="_blank" href="https://github.com/zxing-js/library">zxing-js/library</ui5-link> documentation.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
-	 * @since 1.92.0
-	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
+	 * @since 1.95.0
+	 * @experimental Since 1.95.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.fiori.BarcodeScannerDialog
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
@@ -101,4 +101,4 @@ sap.ui.define([
 	 */
 
 	return BarcodeScannerDialog;
-});
+});

package/src/sap/ui/webc/fiori/FilterItem.js

@@ -0,0 +1,71 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides control sap.ui.webc.fiori.FilterItem.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/FilterItem"
+], function(WebComponent, library) {
+	"use strict";
+
+	/**
+	 * Constructor for a new <code>FilterItem</code>.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @extends sap.ui.webc.common.WebComponent
+	 * @class
+	 *
+	 * <h3>Overview</h3>
+	 *
+	 * <h3>Usage</h3>
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @constructor
+	 * @public
+	 * @since 1.97.0
+	 * @experimental Since 1.97.0 This control is experimental and its API might change significantly.
+	 * @alias sap.ui.webc.fiori.FilterItem
+	 * @implements sap.ui.webc.fiori.IFilterItem
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var FilterItem = WebComponent.extend("sap.ui.webc.fiori.FilterItem", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-filter-item-ui5",
+			interfaces: [
+				"sap.ui.webc.fiori.IFilterItem"
+			],
+			properties: {
+
+				/**
+				 * Defines the text of the component.
+				 */
+				text: {
+					type: "string",
+					defaultValue: ""
+				}
+			},
+			aggregations: {
+
+				/**
+				 * Defines the <code>values</code> list.
+				 */
+				values: {
+					type: "sap.ui.webc.fiori.IFilterItemOption",
+					multiple: true,
+					slot: "values"
+				}
+			}
+		}
+	});
+
+	return FilterItem;
+});

package/src/sap/ui/webc/fiori/FilterItemOption.js

@@ -0,0 +1,68 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides control sap.ui.webc.fiori.FilterItemOption.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/FilterItemOption"
+], function(WebComponent, library) {
+	"use strict";
+
+	/**
+	 * Constructor for a new <code>FilterItemOption</code>.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @extends sap.ui.webc.common.WebComponent
+	 * @class
+	 *
+	 * <h3>Overview</h3>
+	 *
+	 * <h3>Usage</h3>
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @constructor
+	 * @public
+	 * @since 1.97.0
+	 * @experimental Since 1.97.0 This control is experimental and its API might change significantly.
+	 * @alias sap.ui.webc.fiori.FilterItemOption
+	 * @implements sap.ui.webc.fiori.IFilterItemOption
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var FilterItemOption = WebComponent.extend("sap.ui.webc.fiori.FilterItemOption", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-filter-item-option-ui5",
+			interfaces: [
+				"sap.ui.webc.fiori.IFilterItemOption"
+			],
+			properties: {
+
+				/**
+				 * Defines whether the option is selected
+				 */
+				selected: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Defines the text of the component.
+				 */
+				text: {
+					type: "string",
+					defaultValue: ""
+				}
+			}
+		}
+	});
+
+	return FilterItemOption;
+});

package/src/sap/ui/webc/fiori/FlexibleColumnLayout.js

@@ -46,7 +46,7 @@ sap.ui.define([
 	 * <br>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
@@ -62,7 +62,7 @@ sap.ui.define([
 			properties: {
 
 				/**
-				 * On object of strings that defines several additional accessibility texts for even further customization.
+				 * An object of strings that defines several additional accessibility texts for even further customization.
 				 *
 				 * It supports the following fields: - <code>startColumnAccessibleName</code>: the accessibility name for the <code>startColumn</code> region - <code>midColumnAccessibleName</code>: the accessibility name for the <code>midColumn</code> region - <code>endColumnAccessibleName</code>: the accessibility name for the <code>endColumn</code> region - <code>startArrowLeftText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the left - <code>startArrowRightText</code>: the text that the first arrow (between the <code>begin</code> and <code>mid</code> columns) will have when pointing to the right - <code>endArrowLeftText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the left - <code>endArrowRightText</code>: the text that the second arrow (between the <code>mid</code> and <code>end</code> columns) will have when pointing to the right
 				 */

package/src/sap/ui/webc/fiori/IllustratedMessage.js

@@ -40,12 +40,12 @@ sap.ui.define([
 	 * <h3>Usage</h3> <code>sap.ui.webc.fiori.IllustratedMessage</code> is meant to be used inside container component, for example a <code>sap.ui.webc.main.Card</code>, a <code>sap.ui.webc.main.Dialog</code> or a <code>sap.ui.webc.fiori.Page</code>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
-	 * @since 1.92.0
-	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
+	 * @since 1.95.0
+	 * @experimental Since 1.95.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.fiori.IllustratedMessage
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
@@ -111,4 +111,4 @@ sap.ui.define([
 	});
 
 	return IllustratedMessage;
-});
+});

package/src/sap/ui/webc/fiori/NotificationAction.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.fiori.NotificationAction</code> represents an abstract action, used in the <code>sap.ui.webc.fiori.NotificationListItem</code> and the <code>sap.ui.webc.fiori.NotificationListGroupItem</code> items.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/NotificationListGroupItem.js

@@ -47,7 +47,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/NotificationListItem.js

@@ -49,7 +49,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/Page.js

@@ -31,7 +31,7 @@ sap.ui.define([
 	 * <b>Note:</b> <code>sap.ui.webc.fiori.Page</code> occipues the whole available space of its parent. In order to achieve the intended design you have to make sure that there is enough space for the <code>sap.ui.webc.fiori.Page</code> to be rendered.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/ProductSwitch.js

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * <br>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/ProductSwitchItem.js

@@ -34,7 +34,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/ShellBar.js

@@ -55,7 +55,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/ShellBarItem.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 *
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/SideNavigation.js

@@ -35,7 +35,7 @@ sap.ui.define([
 	 * Use the available <code>sap.ui.webc.fiori.SideNavigationItem</code> and <code>sap.ui.webc.fiori.SideNavigationSubItem</code> components to build your menu. The items can consist of text only or an icon with text. The use or non-use of icons must be consistent for all items on one level. You must not combine entries with and without icons on the same level. We strongly recommend that you do not use icons on the second level.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/SideNavigationItem.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.fiori.SideNavigationItem</code> is used within <code>sap.ui.webc.fiori.SideNavigation</code> only. Via the <code>sap.ui.webc.fiori.SideNavigationItem</code> you control the content of the <code>SideNavigation</code>.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/SideNavigationSubItem.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.fiori.SideNavigationSubItem</code> is intended to be used inside a <code>sap.ui.webc.fiori.SideNavigationItem</code> only.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/SortItem.js

@@ -0,0 +1,68 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides control sap.ui.webc.fiori.SortItem.
+sap.ui.define([
+	"sap/ui/webc/common/WebComponent",
+	"./library",
+	"./thirdparty/SortItem"
+], function(WebComponent, library) {
+	"use strict";
+
+	/**
+	 * Constructor for a new <code>SortItem</code>.
+	 *
+	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
+	 * @param {object} [mSettings] Initial settings for the new control
+	 *
+	 * @extends sap.ui.webc.common.WebComponent
+	 * @class
+	 *
+	 * <h3>Overview</h3>
+	 *
+	 * <h3>Usage</h3>
+	 *
+	 * @author SAP SE
+	 * @version 1.97.0
+	 *
+	 * @constructor
+	 * @public
+	 * @since 1.97.0
+	 * @experimental Since 1.97.0 This control is experimental and its API might change significantly.
+	 * @alias sap.ui.webc.fiori.SortItem
+	 * @implements sap.ui.webc.fiori.ISortItem
+	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
+	 */
+	var SortItem = WebComponent.extend("sap.ui.webc.fiori.SortItem", {
+		metadata: {
+			library: "sap.ui.webc.fiori",
+			tag: "ui5-sort-item-ui5",
+			interfaces: [
+				"sap.ui.webc.fiori.ISortItem"
+			],
+			properties: {
+
+				/**
+				 * Defines if the component is selected.
+				 */
+				selected: {
+					type: "boolean",
+					defaultValue: false
+				},
+
+				/**
+				 * Defines the text of the component.
+				 */
+				text: {
+					type: "string",
+					defaultValue: ""
+				}
+			}
+		}
+	});
+
+	return SortItem;
+});

package/src/sap/ui/webc/fiori/Timeline.js

@@ -28,7 +28,7 @@ sap.ui.define([
 	 * The <code>sap.ui.webc.fiori.Timeline</code> component shows entries (such as objects, events, or posts) in chronological order. A common use case is to provide information about changes to an object, or events related to an object. These entries can be generated by the system (for example, value XY changed from A to B), or added manually. There are two distinct variants of the timeline: basic and social. The basic timeline is read-only, while the social timeline offers a high level of interaction and collaboration, and is integrated within SAP Jam.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/TimelineItem.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * An entry posted on the timeline.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/UploadCollection.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * <h3>Overview</h3> This component allows you to represent files before uploading them to a server, with the help of <code>sap.ui.webc.fiori.UploadCollectionItem</code>. It also allows you to show already uploaded files.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
@@ -42,6 +42,14 @@ sap.ui.define([
 			tag: "ui5-upload-collection-ui5",
 			properties: {
 
+				/**
+				 * Sets the accessible aria name of the component.
+				 */
+				accessibleName: {
+					type: "string",
+					defaultValue: ""
+				},
+
 				/**
 				 * Defines the height of the control
 				 */
@@ -108,7 +116,9 @@ sap.ui.define([
 			aggregations: {
 
 				/**
-				 * Defines the <code>sap.ui.webc.fiori.UploadCollection</code> header.
+				 * Defines the <code>sap.ui.webc.fiori.UploadCollection</code> header. <br>
+				 * <br>
+				 * <b>Note:</b> If <code>header</code> slot is provided, the labelling of the <code>UploadCollection</code> is a responsibility of the application developer. <code>accessibleName</code> should be used.
 				 */
 				header: {
 					type: "sap.ui.core.Control",

package/src/sap/ui/webc/fiori/UploadCollectionItem.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * <h3>Overview</h3> A component to be used within the <code>sap.ui.webc.fiori.UploadCollection</code>.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/webc/fiori/ViewSettingsDialog.js

@@ -21,7 +21,7 @@ sap.ui.define([
 	 * @extends sap.ui.webc.common.WebComponent
 	 * @class
 	 *
-	 * <h3>Overview</h3> The <code>sap.ui.webc.fiori.ViewSettingsDialog</code> component helps the user to sort data within a list or a table. It consists of several lists like <code>Sort order</code> which is built-in and <code>Sort By</code> which must be provided by the developer. The selected options can be used to create sorters for the table.
+	 * <h3>Overview</h3> The <code>sap.ui.webc.fiori.ViewSettingsDialog</code> component helps the user to sort data within a list or a table. It consists of several lists like <code>Sort order</code> which is built-in and <code>Sort By</code> and <code>Filter By</code> lists, for which you must be provide items(<code>sap.ui.webc.fiori.SortItem</code> & <code>sap.ui.webc.fiori.FilterItem</code> respectively) These options can be used to create sorters for a table.
 	 *
 	 * The <code>sap.ui.webc.fiori.ViewSettingsDialog</code> interrupts the current application processing as it is the only focused UI element and the main screen is dimmed/blocked. The <code>sap.ui.webc.fiori.ViewSettingsDialog</code> is modal, which means that user action is required before returning to the parent window is possible.
 	 *
@@ -30,12 +30,12 @@ sap.ui.define([
 	 * <h3>Responsive Behavior</h3> <code>sap.ui.webc.fiori.ViewSettingsDialog</code> stretches on full screen on phones.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
-	 * @since 1.92.0
-	 * @experimental Since 1.92.0 This control is experimental and its API might change significantly.
+	 * @since 1.95.0
+	 * @experimental Since 1.95.0 This control is experimental and its API might change significantly.
 	 * @alias sap.ui.webc.fiori.ViewSettingsDialog
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
@@ -56,10 +56,19 @@ sap.ui.define([
 			aggregations: {
 
 				/**
-				 * Defines the <code>sortItems</code> list.
+				 *
+				 */
+				filterItems: {
+					type: "sap.ui.webc.fiori.IFilterItem",
+					multiple: true,
+					slot: "filterItems"
+				},
+
+				/**
+				 *
 				 */
 				sortItems: {
-					type: "sap.ui.webc.main.IListItem",
+					type: "sap.ui.webc.fiori.ISortItem",
 					multiple: true,
 					slot: "sortItems"
 				}
@@ -79,7 +88,7 @@ sap.ui.define([
 						},
 
 						/**
-						 * The current sort by selected.
+						 * The currently selected <code>sap.ui.webc.fiori.SortItem</code> text attribute.
 						 */
 						sortBy: {
 							type: "string"
@@ -100,7 +109,7 @@ sap.ui.define([
 						},
 
 						/**
-						 * The current sort by selected.
+						 * The currently selected <code>sap.ui.webc.fiori.SortItem</code> text attribute.
 						 */
 						sortBy: {
 							type: "string"
@@ -120,4 +129,4 @@ sap.ui.define([
 	 */
 
 	return ViewSettingsDialog;
-});
+});

package/src/sap/ui/webc/fiori/Wizard.js

@@ -23,14 +23,14 @@ sap.ui.define([
 	 *
 	 * <h3>Overview</h3>
 	 *
-	 * The <code>sap.ui.webc.fiori.Wizard</code> helps users complete a complex task by dividing it into sections and guiding the user through it. It has two main areas - a navigation area at the top showing the step sequence and a content area below it.
+	 * The <code>sap.ui.webc.fiori.Wizard</code> helps users to complete a complex task by dividing it into sections and guiding them through it. It has two main areas - a navigation area at the top showing the step sequence and a content area below it.
 	 *
 	 * <h3>Structure</h3>
 	 * <h4>Navigation area</h4> The top most area of the <code>sap.ui.webc.fiori.Wizard</code> is occupied by the navigation area. It shows the sequence of steps, where the recommended number of steps is between 3 and 8 steps.
 	 * <ul>
 	 *     <li> Steps can have different visual representations - numbers or icons.
 	 *     <li> Steps might have labels for better readability - titleText and subTitleText.</li>
-	 *     <li> Steps are defined by using the <code>sap.ui.webc.fiori.WizardStep</code> as slotted element within the <code>sap.ui.webc.fiori.Wizard</code></li>
+	 *     <li> Steps are defined by using the <code>sap.ui.webc.fiori.WizardStep</code> as slotted element within the <code>sap.ui.webc.fiori.Wizard</code>.</li>
 	 * </ul>
 	 *
 	 * <b>Note:</b> If no selected step is defined, the first step will be auto selected. <br>
@@ -50,21 +50,21 @@ sap.ui.define([
 	 * </code> <code>&#9;&lt;ui5-wizard&gt;&lt;/ui5-wizard&gt;<br>
 	 * </code> <code>&lt;/ui5-dialog&gt;</code>
 	 *
-	 * <h4>Moving to next step</h4> The <code>sap.ui.webc.fiori.WizardStep</code> provides the necessary API and it's up to the user of the component to use it to move to the next step. You have to set its <code>selected</code> property (and remove the <code>disabled</code> one if set) to <code>true</code>. And, the <code>sap.ui.webc.fiori.Wizard</code> will automatically scroll to the content of the newly selected step. <br>
+	 * <h4>Moving to next step</h4> The <code>sap.ui.webc.fiori.WizardStep</code> provides the necessary API and it's up to the user of the component to use it to move to the next step. You have to set its <code>selected</code> property (and remove the <code>disabled</code> one if set) to <code>true</code>. The <code>sap.ui.webc.fiori.Wizard</code> will automatically scroll to the content of the newly selected step. <br>
 	 * <br>
 	 *
 	 *
 	 * The Fiori 3 guidelines recommends having a "nextStep" button in the content area. You can place a button, or any other type of element to trigger step change, inside the <code>sap.ui.webc.fiori.WizardStep</code>, and show/hide it when certain fields are filled or user defined criteria is met.
 	 *
 	 * <h3>Usage</h3>
-	 * <h4>When to use:</h4> When the user has to accomplish a long set of tasks.
+	 * <h4>When to use:</h4> When the user has to accomplish a long or unfamiliar task.
 	 *
 	 * <h4>When not to use:</h4> When the task has less than 3 steps.
 	 *
-	 * <h3>Responsive Behavior</h3> On small widths the step's titleText, subtitleText and separators in the navigation area will start truncate and shrink and from particular point they will hide to free as much space as possible.
+	 * <h3>Responsive Behavior</h3> On small widths the step's titleText, subtitleText and separators in the navigation area shrink and from particular point the steps are grouped together and overlap. Tapping on them will show a popover to select the step to navigate to. On mobile device, the grouped steps are presented within a dialog.
 	 *
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 *
 	 * @constructor
 	 * @public
@@ -117,21 +117,21 @@ sap.ui.define([
 				stepChange: {
 					parameters: {
 						/**
-						 * the new step
+						 * The new step.
 						 */
 						step: {
 							type: "HTMLElement"
 						},
 
 						/**
-						 * the previous step
+						 * The previous step.
 						 */
 						previousStep: {
 							type: "HTMLElement"
 						},
 
 						/**
-						 * the step change occurs due to user's click or 'Enter'/'Space' key press on step within the navigation
+						 * The step change occurs due to user's click or 'Enter'/'Space' key press on step within the navigation.
 						 */
 						changeWithClick: {
 							type: "boolean"