@openui5/sap.ui.webc.fiori 1.104.0 → 1.105.0

package/.reuse/dep5

@@ -159,7 +159,7 @@ Copyright:
 License: Apache-2.0 and MIT
 Comment: these files contain content from SAP and jQuery.rtl-scroll-type: _FeatureDetection.js is overall written by SAP, but contains code which is inspired by jQuery.rtl-scroll-type
 
-Files: src/sap.ui.core/src/sap/ui/thirdparty/qunit-composite*
+Files: src/sap.ui.core/src/sap/ui/thirdparty/qunit-composite.*
 Copyright: jQuery Foundation and other contributors
 License: MIT
 Comment: these files belong to: QUnit Composite

package/THIRDPARTY.txt

@@ -104,7 +104,7 @@ Component: QUnit Composite, version: 1.0.2-pre
 Copyright: jQuery Foundation and other contributors
 License: MIT
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/MIT.txt
-Contained in: src/sap.ui.core/src/sap/ui/thirdparty/qunit-composite*
+Contained in: src/sap.ui.core/src/sap/ui/thirdparty/qunit-composite.*
 
 Component: JUnit Reporter for QUnit, version: 1.1.1
 Copyright: jQuery Foundation and other contributors

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.ui.webc.fiori",
-  "version": "1.104.0",
+  "version": "1.105.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.104.0",
-    "@openui5/sap.ui.webc.main": "1.104.0",
-    "@openui5/sap.ui.webc.common": "1.104.0"
+    "@openui5/sap.ui.core": "1.105.0",
+    "@openui5/sap.ui.webc.main": "1.105.0",
+    "@openui5/sap.ui.webc.common": "1.105.0"
   }
 }

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

@@ -3,7 +3,7 @@
 
 	<name>sap.ui.webc.fiori</name>
 	<vendor>SAP SE</vendor>
-	<version>1.104.0</version>
+	<version>1.105.0</version>
 	<copyright>OpenUI5
  * (c) Copyright 2009-2022 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

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * <h3>Keyboard Handling</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -61,7 +61,7 @@ sap.ui.define([
 			properties: {
 
 				/**
-				 * Defines the <code>sap.ui.webc.fiori.Bar</code> design.
+				 * Defines the component's design.
 				 *
 				 * <br>
 				 * <br>

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

@@ -32,7 +32,7 @@ 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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -70,7 +70,7 @@ sap.ui.define([
 	 *             A special case allows switching the comparison mode between the main and side content. In this case, the screen is split into 50:50 percent for main vs. side content. The responsive behavior of the equal split is the same as in the standard view - the side content disappears on screen widths of less than 720 px and can only be viewed by triggering it.
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * <h3>Usage</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * <h3>Usage</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -25,7 +25,7 @@ sap.ui.define([
 	 *
 	 * <h3>Overview</h3>
 	 *
-	 * The <code>FlexibleColumnLayout</code> implements the master-detail-detail paradigm by displaying up to three pages in separate columns. There are several possible layouts that can be changed either with the component API, or by pressing the arrows, displayed between the columns.
+	 * The <code>FlexibleColumnLayout</code> implements the list-detail-detail paradigm by displaying up to three pages in separate columns. There are several possible layouts that can be changed either with the component API, or by pressing the arrows, displayed between the columns.
 	 *
 	 * <h3>Usage</h3>
 	 *
@@ -40,7 +40,7 @@ sap.ui.define([
 	 * <h3>Keyboard Handling</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -12,6 +12,7 @@ sap.ui.define([
 ], function(WebComponent, library) {
 	"use strict";
 
+	var IllustrationMessageSize = library.IllustrationMessageSize;
 	var IllustrationMessageType = library.IllustrationMessageType;
 
 	/**
@@ -40,7 +41,7 @@ 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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -63,6 +64,25 @@ sap.ui.define([
 					defaultValue: IllustrationMessageType.BeforeSearch
 				},
 
+				/**
+				 * Determines which illustration breakpoint variant is used. <br>
+				 * <br>
+				 * Available options are:
+				 * <ul>
+				 *     <li><code>Auto</code></li>
+				 *     <li><code>Base</code></li>
+				 *     <li><code>Spot</code></li>
+				 *     <li><code>Dialog</code></li>
+				 *     <li><code>Scene</code></li>
+				 * </ul>
+				 *
+				 * As <code>IllustratedMessage</code> adapts itself around the <code>Illustration</code>, the other elements of the component are displayed differently on the different breakpoints/illustration sizes.
+				 */
+				size: {
+					type: "sap.ui.webc.fiori.IllustrationMessageSize",
+					defaultValue: IllustrationMessageSize.Auto
+				},
+
 				/**
 				 * Defines the subtitle of the component. <br>
 				 * <br>

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

@@ -27,7 +27,7 @@ sap.ui.define([
 	 *
 	 * <h3>Overview</h3>
 	 *
-	 * The <code>ui-media-gallery</code> component allows the user to browse through multimedia items. Currently, the supported items are images and videos. The items should be defined using the <code>sap.ui.webc.fiori.MediaGalleryItem</code> component.
+	 * The <code>sap.ui.webc.fiori.MediaGallery</code> component allows the user to browse through multimedia items. Currently, the supported items are images and videos. The items should be defined using the <code>sap.ui.webc.fiori.MediaGalleryItem</code> component.
 	 *
 	 * The items are initially displayed as thumbnails. When the user selects a thumbnail, the corresponding item is displayed in larger size. <br>
 	 * The component is responsive by default and adjusts the position of the menu with respect to viewport size, but the application is able to further customize the layout via the provided API.
@@ -45,7 +45,7 @@ sap.ui.define([
 	 * </ul> <br>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * </ul>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -28,7 +28,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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

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

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

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

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

@@ -25,13 +25,13 @@ sap.ui.define([
 	 *
 	 * <h3>Overview</h3>
 	 *
-	 * The <code>sap.ui.webc.fiori.Page</code> is a container control that holds one whole screen of an application. The page has three distinct areas that can hold content - a header, content area and a footer. <h3>Structure</h3>
+	 * The <code>sap.ui.webc.fiori.Page</code> is a container component that holds one whole screen of an application. The page has three distinct areas that can hold content - a header, content area and a footer. <h3>Structure</h3>
 	 * <h4>Header</h4> The top most area of the page is occupied by the header. The standard header includes a navigation button and a title. <h4>Content</h4> The content occupies the main part of the page. Only the content area is scrollable by default. This can be prevented by setting <code>enableScrolling</code> to <code>false</code>. <h4>Footer</h4> The footer is optional and occupies the fixed bottom part of the page. Alternatively, the footer can be floating above the bottom part of the content. This is enabled with the <code>floatingFooter</code> property.
 	 *
 	 * <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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

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

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

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

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

@@ -50,7 +50,7 @@ sap.ui.define([
 	 * <h3>Keyboard Handling</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

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

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

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * <h3>Keyboard Handling</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.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.104.0
+	 * @version 1.105.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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * <h3>Usage</h3>
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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.104.0
+	 * @version 1.105.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.104.0
+	 * @version 1.105.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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -30,7 +30,7 @@ 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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -75,6 +75,13 @@ sap.ui.define([
 			},
 			events: {
 
+				/**
+				 * Fired before the component is opened. <b>This event does not bubble.</b>
+				 */
+				beforeOpen: {
+					parameters: {}
+				},
+
 				/**
 				 * Fired when cancel button is activated.
 				 */
@@ -159,10 +166,18 @@ sap.ui.define([
 					}
 				}
 			},
-			methods: ["show"]
+			methods: ["setConfirmedSettings", "show"]
 		}
 	});
 
+	/**
+	 * Sets a JavaScript object, as settings to the <code>sap.ui.webc.fiori.ViewSettingsDialog</code>. This method can be used after the dialog is initially open, as the dialog need to set its initial settings. The <code>sap.ui.webc.fiori.ViewSettingsDialog</code> throws an event called "before-open", this can be used as trigger point. The object should have the following format: <code>{ { "sortOrder" : "Ascending", "sortBy" : "Name", "filters" : [{"Filter 1": ["Some filter 1", "Some filter 2"]}, {"Filter 2": ["Some filter 4"]}]} }</code>
+	 * @param {string} settings A value to be set as predefined settings.
+	 * @public
+	 * @name sap.ui.webc.fiori.ViewSettingsDialog#setConfirmedSettings
+	 * @function
+	 */
+
 	/**
 	 * Shows the dialog.
 	 * @public

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

@@ -77,7 +77,7 @@ sap.ui.define([
 	 * <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.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * <h3>Usage</h3> The <code>sap.ui.webc.fiori.WizardStep</code> component should be used only as slot of the <code>sap.ui.webc.fiori.Wizard</code> component and should not be used standalone.
 	 *
 	 * @author SAP SE
-	 * @version 1.104.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

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

@@ -23,14 +23,14 @@ sap.ui.define([
 		 * @namespace
 		 * @alias sap.ui.webc.fiori
 		 * @author SAP SE
-		 * @version 1.104.0
+		 * @version 1.105.0
 		 * @public
 		 * @since 1.92.0
 		 * @experimental Since 1.92.0 This API is experimental and might change significantly.
 		 */
 		var thisLib = sap.ui.getCore().initLibrary({
 			name: "sap.ui.webc.fiori",
-			version: "1.104.0",
+			version: "1.105.0",
 			dependencies: ["sap.ui.core", "sap.ui.webc.common"],
 			noLibraryCSS: true,
 			designtime: "sap/ui/webc/main/designtime/library.designtime",
@@ -53,6 +53,7 @@ sap.ui.define([
 			types: [
 				"sap.ui.webc.fiori.BarDesign",
 				"sap.ui.webc.fiori.FCLLayout",
+				"sap.ui.webc.fiori.IllustrationMessageSize",
 				"sap.ui.webc.fiori.IllustrationMessageType",
 				"sap.ui.webc.fiori.MediaGalleryItemLayout",
 				"sap.ui.webc.fiori.MediaGalleryLayout",
@@ -349,7 +350,7 @@ Use to display a detail page only, when the user should focus entirely on it.
 			/**
 				 * Desktop: 25/25/50 Start, Mid and End (expanded) columns are displayed Tablet: 0/33/67 Mid and End (expanded) columns are displayed, Start is accessible by layout arrows Phone: -/-/100 (only the End column is displayed)
 
-Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail-detail.
+Use to display all three pages (list, detail, detail-detail) when the user should focus on the detail-detail.
 				 * @public
 				 */
 			ThreeColumnsEndExpanded: "ThreeColumnsEndExpanded",
@@ -357,7 +358,7 @@ Use to display all three pages (master, detail, detail-detail) when the user sho
 			/**
 				 * Desktop: 25/50/25 Start, Mid (expanded) and End columns are displayed Tablet: 0/67/33 Mid (expanded) and End columns are displayed, Start is accessible by a layout arrow Phone: -/-/100 only the End column is displayed
 
-Use to display all three pages (master, detail, detail-detail) when the user should focus on the detail.
+Use to display all three pages (list, detail, detail-detail) when the user should focus on the detail.
 				 * @public
 				 */
 			ThreeColumnsMidExpanded: "ThreeColumnsMidExpanded",
@@ -365,7 +366,7 @@ Use to display all three pages (master, detail, detail-detail) when the user sho
 			/**
 				 * Desktop: 33/67/0 Start and Mid (expanded) columns are displayed, End is accessible by a layout arrow Tablet: 33/67/0 Start and Mid (expanded) columns are displayed, End is accessible by a layout arrow Phone: -/-/100 only the End column is displayed
 
-Use to display the master and detail pages when the user should focus on the detail. The detail-detail is still loaded and easily accessible with a layout arrow.
+Use to display the list and detail pages when the user should focus on the detail. The detail-detail is still loaded and easily accessible with a layout arrow.
 				 * @public
 				 */
 			ThreeColumnsMidExpandedEndHidden: "ThreeColumnsMidExpandedEndHidden",
@@ -373,7 +374,7 @@ Use to display the master and detail pages when the user should focus on the det
 			/**
 				 * Desktop: 67/33/0 Start (expanded) and Mid columns are displayed, End is accessible by layout arrows Tablet: 67/33/0 Start (expanded) and Mid columns are displayed, End is accessible by layout arrows Phone: -/-/100 only the End column is displayed
 
-Use to display the master and detail pages when the user should focus on the master. The detail-detail is still loaded and easily accessible with layout arrows.
+Use to display the list and detail pages when the user should focus on the list. The detail-detail is still loaded and easily accessible with layout arrows.
 				 * @public
 				 */
 			ThreeColumnsStartExpandedEndHidden: "ThreeColumnsStartExpandedEndHidden",
@@ -381,7 +382,7 @@ Use to display the master and detail pages when the user should focus on the mas
 			/**
 				 * Desktop: 33/67/- Start and Mid (expanded) columns are displayed Tablet: 33/67/- Start and Mid (expanded) columns are displayed Phone: -/100/- only the Mid column is displayed
 
-Use to display both a master and a detail page when the user should focus on the detail page.
+Use to display both a list and a detail page when the user should focus on the detail page.
 				 * @public
 				 */
 			TwoColumnsMidExpanded: "TwoColumnsMidExpanded",
@@ -389,13 +390,60 @@ Use to display both a master and a detail page when the user should focus on the
 			/**
 				 * Desktop: 67/33/- Start (expanded) and Mid columns are displayed Tablet: 67/33/- Start (expanded) and Mid columns are displayed Phone: -/100/- only the Mid column is displayed
 
-Use to display both a master and a detail page when the user should focus on the master page.
+Use to display both a list and a detail page when the user should focus on the list page.
 				 * @public
 				 */
 			TwoColumnsStartExpanded: "TwoColumnsStartExpanded"
 		};
 
 
+		/**
+		 * Different types of IllustrationMessageSize.
+		 *
+		 * @enum {string}
+		 * @public
+		 * @since 1.106.0
+		 * @experimental Since 1.106.0 This API is experimental and might change significantly.
+		 * @ui5-metamodel This enumeration also will be described in the UI5 (legacy) designtime metamodel
+		 */
+		thisLib.IllustrationMessageSize = {
+
+			/**
+				 * Automatically decides the <code>Illustration</code> size (<code>Base</code>, <code>Spot</code>, <code>Dialog</code>, or <code>Scene</code>) depending on the <code>IllustratedMessage</code> container width.
+
+<b>Note:</b> <code>Auto</code> is the only option where the illustration size is changed according to the available container width. If any other <code>IllustratedMessageSize</code> is chosen, it remains until changed by the app developer.
+				 * @public
+				 */
+			Auto: "Auto",
+
+			/**
+				 * Base <code>Illustration</code> size (XS breakpoint). Suitable for cards (two columns).
+
+<b>Note:</b> When <code>Base</code> is in use, no illustration is displayed.
+				 * @public
+				 */
+			Base: "Base",
+
+			/**
+			 * Dialog <code>Illustration</code> size (M breakpoint). Suitable for dialogs.
+			 * @public
+			 */
+			Dialog: "Dialog",
+
+			/**
+			 * Scene <code>Illustration</code> size (L breakpoint). Suitable for a <code>Page</code> or a table.
+			 * @public
+			 */
+			Scene: "Scene",
+
+			/**
+			 * Spot <code>Illustration</code> size (S breakpoint). Suitable for cards (four columns).
+			 * @public
+			 */
+			Spot: "Spot"
+		};
+
+
 		/**
 		 * Different illustration types of Illustrated Message.
 		 *

package/src/sap/ui/webc/fiori/thirdparty/DynamicSideContent.js

@@ -64,7 +64,7 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 		},
 		events:  {
 			"layout-change": {
-				details: {
+				detail: {
 					currentBreakpoint: {
 						type: String,
 					},

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

@@ -1,4 +1,4 @@
-sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/delegate/ResizeHandler', 'sap/ui/webc/common/thirdparty/base/types/Float', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/types/AnimationMode', 'sap/ui/webc/common/thirdparty/base/config/AnimationMode', 'sap/ui/webc/common/thirdparty/base/Device', 'sap/ui/webc/main/thirdparty/Button', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-left', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-right', './types/FCLLayout', './fcl-utils/FCLLayout', './generated/i18n/i18n-defaults', './generated/templates/FlexibleColumnLayoutTemplate.lit', './generated/themes/FlexibleColumnLayout.css'], function (UI5Element, litRender, ResizeHandler, Float, Integer, i18nBundle, AnimationMode$1, AnimationMode, Device, Button, slimArrowLeft, slimArrowRight, FCLLayout, FCLLayout$1, i18nDefaults, FlexibleColumnLayoutTemplate_lit, FlexibleColumnLayout_css) { 'use strict';
+sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/common/thirdparty/base/renderer/LitRenderer', 'sap/ui/webc/common/thirdparty/base/delegate/ResizeHandler', 'sap/ui/webc/common/thirdparty/base/types/Float', 'sap/ui/webc/common/thirdparty/base/types/Integer', 'sap/ui/webc/common/thirdparty/base/i18nBundle', 'sap/ui/webc/common/thirdparty/base/types/AnimationMode', 'sap/ui/webc/common/thirdparty/base/config/AnimationMode', 'sap/ui/webc/main/thirdparty/Button', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-left', 'sap/ui/webc/common/thirdparty/icons/slim-arrow-right', './types/FCLLayout', './fcl-utils/FCLLayout', './generated/i18n/i18n-defaults', './generated/templates/FlexibleColumnLayoutTemplate.lit', './generated/themes/FlexibleColumnLayout.css'], function (UI5Element, litRender, ResizeHandler, Float, Integer, i18nBundle, AnimationMode$1, AnimationMode, Button, slimArrowLeft, slimArrowRight, FCLLayout, FCLLayout$1, i18nDefaults, FlexibleColumnLayoutTemplate_lit, FlexibleColumnLayout_css) { 'use strict';
 
 	function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
 
@@ -250,7 +250,6 @@ sap.ui.define(['sap/ui/webc/common/thirdparty/base/UI5Element', 'sap/ui/webc/com
 			return {
 				root: {
 					"ui5-fcl-root": true,
-					"ui5-fcl--ie": Device.isIE(),
 				},
 				columns: {
 					start: {