@openui5/sap.ui.dt 1.140.0 → 1.141.0

package/THIRDPARTY.txt

@@ -379,7 +379,7 @@ License: MIT
 License Text: https://github.com/UI5/openui5/blob/master/LICENSES/MIT.txt
 Contained in: src/sap.ui.integration/src/sap/ui/integration/thirdparty/adaptive-expressions.js
 
-Component: Markdown-it, version: 12.3.2
+Component: Markdown-it, version: 14.1.0
 Copyright: 2014 Vitaly Puzrin, Alex Kocharin
 License: MIT
 License Text: https://github.com/UI5/openui5/blob/master/LICENSES/MIT.txt
@@ -444,7 +444,7 @@ License: Apache-2.0
 License Text: https://github.com/UI5/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: lib/jsdoc/ui5/plugin.js
 
-Component: SAP Theming Base Content, version: 11.31.1
+Component: SAP Theming Base Content, version: 11.32.2-20250827135846+79bb30d311678435d61b21db26ecbe07d6b05079
 Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
 License: Apache-2.0
 License Text: https://github.com/UI5/openui5/blob/master/LICENSES/Apache-2.0.txt

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.ui.dt",
-  "version": "1.140.0",
+  "version": "1.141.0",
   "description": "OpenUI5 UI Library sap.ui.dt",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,6 +14,6 @@
     "url": "https://github.com/UI5/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.ui.core": "1.140.0"
+    "@openui5/sap.ui.core": "1.141.0"
   }
 }

package/src/sap/ui/dt/.library

@@ -6,7 +6,7 @@
   <copyright>OpenUI5
  * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
-  <version>1.140.0</version>
+  <version>1.141.0</version>
 
   <documentation>SAP UI library: sap.ui.dt (by SAP, Author)</documentation>
 
@@ -17,13 +17,6 @@
   </dependencies>
 
   <appData>
-    <manifest xmlns="http://www.sap.com/ui5/buildext/manifest">
-      <sap.ui5>
-        <library>
-          <i18n>false</i18n><!-- no default i18n bundle in this lib -->
-        </library>
-      </sap.ui5>
-    </manifest>
     <selenium xmlns="http://www.sap.com/ui5/buildext/selenium" package="com.sap.ui5.selenium.dt" />
     <!-- excludes for the JSCoverage -->
     <jscoverage xmlns="http://www.sap.com/ui5/buildext/jscoverage" >
@@ -37,4 +30,4 @@
     </ownership>
   </appData>
 
-</library>
+</library>

package/src/sap/ui/dt/AggregationDesignTimeMetadata.js

@@ -23,7 +23,7 @@ function(
 	 * @extends sap.ui.dt.DesignTimeMetadata
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/AggregationOverlay.js

@@ -33,7 +33,7 @@ function(
 	 * @extends sap.ui.dt.Overlay
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/ControlObserver.js

@@ -22,7 +22,7 @@ function(ManagedObjectObserver) {
 	 * @extends sap.ui.dt.ManagedObjectObserver
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/DOMUtil.js

@@ -25,7 +25,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/DesignTime.js

@@ -69,7 +69,7 @@ sap.ui.define([
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/DesignTimeMetadata.js

@@ -45,7 +45,7 @@ sap.ui.define([
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/ElementDesignTimeMetadata.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * @extends sap.ui.dt.DesignTimeMetadata
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/ElementOverlay.js

@@ -55,7 +55,7 @@ sap.ui.define([
 	 * @extends sap.ui.dt.Overlay
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/ElementUtil.js

@@ -29,7 +29,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/ManagedObjectObserver.js

@@ -23,7 +23,7 @@ sap.ui.define([
 	 * @class The ManagedObjectObserver observes changes of a ManagedObject and propagates them via events.
 	 * @extends sap.ui.base.ManagedObject
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/MetadataPropagationUtil.js

@@ -21,7 +21,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @private
 	 * @since 1.54
 	 * @alias sap.ui.dt.MetadataPropagationUtil

package/src/sap/ui/dt/MutationObserver.js

@@ -30,7 +30,7 @@ sap.ui.define([
 	 * @class The MutationObserver observes changes of a ManagedObject and propagates them via events.
 	 * @extends sap.ui.base.ManagedObject
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/Overlay.js

@@ -42,7 +42,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Element
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/OverlayRegistry.js

@@ -23,7 +23,7 @@ function(
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/OverlayUtil.js

@@ -21,7 +21,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @private
 	 * @since 1.30
 	 * @alias sap.ui.dt.OverlayUtil

package/src/sap/ui/dt/Plugin.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/ScrollbarSynchronizer.js

@@ -22,7 +22,7 @@ function(
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/SelectionManager.js

@@ -32,7 +32,7 @@ function(
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/SelectionMode.js

@@ -16,7 +16,7 @@ sap.ui.define(function() {
 	 * @namespace
 	 * @name sap.ui.dt.SelectionMode
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @private
 	 */
 	return {

package/src/sap/ui/dt/TaskManager.js

@@ -21,7 +21,7 @@ function(
 	 * The TaskManager keeps list of task and allows to manage them via simple API.
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/TaskRunner.js

@@ -24,7 +24,7 @@ function(
 	 * TaskRunner run tasks defined in sap.ui.dt.TaskManager.
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/Util.js

@@ -20,7 +20,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @since 1.54

package/src/sap/ui/dt/enablement/ElementEnablementTest.js

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * @extends sap.ui.dt.test.Test
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/enablement/Test.js

@@ -22,7 +22,7 @@ sap.ui.define([
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/enablement/Util.js

@@ -22,7 +22,7 @@ sap.ui.define([
 	 * @namespace
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @static

package/src/sap/ui/dt/enablement/report/LibraryReport.js

@@ -27,7 +27,7 @@ sap.ui.define([
 	 * @extends sap.ui.dt.enablement.Test
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/enablement/report/QUnitReport.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * @extends sap.ui.base.ManagedObject
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/library.js

@@ -20,7 +20,7 @@ sap.ui.define([
 	/**
 	 * Object containing the aggregation configuration
 	 *
-	 * @typedef {object} sap.ui.dt.DesignTimeMetadata.Aggregation
+	 * @typedef {object} sap.ui.dt.designtime.DesignTimeMetadata.Aggregation
 	 * @property {boolean|function} [ignore = false] - Used to ignore the aggregation (and all its children) at design time.
 	 * For example, this can be used to ignore deprecated or duplicated aggregations as well as aggregations irrelevant during the design time (such as dependents).
 	 * If the value is true, then no overlays will be created for the aggregation and its children.
@@ -44,47 +44,44 @@ sap.ui.define([
 	 * It can be used if you need to know the relevantContainer during the execution of the function.
 	 * @property {boolean|function} [propagateRelevantContainer] - Defines the relevant container control for the actions which belong to successor controls.
 	 *
-	 * @private
-	 * @ui5-restricted
+	 * @public
 	 */
 
 	/**
 	 * Object containing the aggregation configuration
 	 *
-	 * @typedef {object} sap.ui.dt.DesignTimeMetadata.Property
+	 * @typedef {object} sap.ui.dt.designtime.DesignTimeMetadata.Property
 	 * @property {boolean|function} [ignore = false] - Used to ignore the property at design time.
 	 * For example, this can be used to ignore deprecated properties or properties that shall not be changed during design time.
 	 *
-	 * @private
-	 * @ui5-restricted
+	 * @public
 	 */
 
 	/**
 	 * Object containing the association configuration
 	 *
-	 * @typedef {object} sap.ui.dt.DesignTimeMetadata.Association
+	 * @typedef {object} sap.ui.dt.designtime.DesignTimeMetadata.Association
 	 * @property {boolean} aggregationLike - Can be used to tell the design time that it should follow the association hierarchy.
 	 * This is used by controls like e.g. the componentContainer that should allow to follow the association component,
 	 * which defines the control hierarchy but is not a real aggregation (more isolation, regarding model propagation/rendering/eventing/...).
 	 *
-	 * @private
-	 * @ui5-restricted
+	 * @public
 	 */
 
 	/**
 	 * Object containing a sample design time configuration
 	 *
-	 * @typedef {object} sap.ui.dt.DesignTimeMetadata
+	 * @typedef {object} sap.ui.dt.designtime.DesignTimeMetadata
 	 * @property {object|function} name - Specify or calculate a speaking name for the  control (which is understandable to key users).
 	 * This is needed for the "reveal" action to show the names in the context menu (Add <name in singular> and Available <name in plural>).
 	 * Name your control based on the general UI concept and follow the guidance from https://experience.sap.com/fiori-design/.
 	 * Example: Key users don't care about the difference between a smart, mobile or responsive version of a form, it's just a form.
 	 * @property {string|function} name.singular - i18n key from library's design-time resource bundle or function returning the translated text
 	 * @property {string|function} name.plural - i18n key from library's design-time resource bundle or function returning the translated text
-	 * @property {function} [getLabel] - Allows you to return the label texts of the control, that is useful in outlines, context menus
-	 * and e.g. "add" dialogs so that users can identify which of the controls of this type is meant (e.g. the product price).
-	 * Our default implementation tries getText() and then getLabelText(). If it's not available,
-	 * it tries getLabel().getText(), then getTitle(), and then getId()
+	 * @property {function} [getLabel] - Allows to provide a customized getter for the control label that is used in
+	 * outlines, context menus and actions like "reveal" or "rename".
+	 * The default implementation tries to get the following properties in that order:
+	 * <code>text</code>, <code>labelText</code>, <code>label</code>, <code>title</code>, <code>heading</code>, <code>dataSourceLabel</code>
 	 * @property {string|function} [domRef] - Defines the DOM reference of the control
 	 * @property {function} isVisible - Needed for Elements that are not derived from sap.ui.core.Control.
 	 * The function should return the visibility of the Element as a boolean (true = visible).
@@ -113,8 +110,7 @@ sap.ui.define([
 	 * @property {function} tool.start - Called when the tool is started
 	 * @property {function} tool.stop - Called when the tool is stopped
 	 *
-	 * @private
-	 * @ui5-restricted
+	 * @public
 	 */
 
 	/**
@@ -123,7 +119,7 @@ sap.ui.define([
 	 * @namespace
 	 * @alias sap.ui.dt
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @since 1.30
 	 * @private
 	 * @ui5-restricted
@@ -131,7 +127,7 @@ sap.ui.define([
 	var thisLib = Lib.init({
 		name: "sap.ui.dt",
 		apiVersion: 2,
-		version: "1.140.0",
+		version: "1.141.0",
 		dependencies: ["sap.ui.core"],
 		types: [],
 		interfaces: [],

package/src/sap/ui/dt/messagebundle.properties

@@ -0,0 +1,7 @@
+#This is the resource bundle for the sap.ui.rta library
+# __ldi.translation.uuid=6cb30b13-cebe-4851-a2f1-eb261e580bc7
+
+#XHED: Header for the Extended Actions
+CTX_EXTENDED_ACTIONS_HEADER=Extended Actions
+#YDES: Description for the Extended Actions Header
+CTX_EXTENDED_ACTIONS_HEADER_DESCRIPTION=This helps you quickly find key functions from related controls that are relevant here.

package/src/sap/ui/dt/plugin/ContextMenu.js

@@ -3,32 +3,29 @@
  * (c) Copyright 2025 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
-
 sap.ui.define([
 	"sap/base/assert",
 	"sap/m/Button",
-	"sap/m/FlexBox",
-	"sap/m/FormattedText",
 	"sap/m/Menu",
 	"sap/m/MenuItem",
 	"sap/ui/base/DesignTime",
+	"sap/ui/core/Lib",
 	"sap/ui/dt/util/_createPromise",
-	"sap/ui/dt/OverlayRegistry",
 	"sap/ui/dt/Plugin",
+	"sap/ui/dt/OverlayRegistry",
 	"sap/ui/dt/Util",
 	"sap/ui/events/KeyCodes",
 	"sap/ui/Device"
 ], function(
 	assert,
 	Button,
-	FlexBox,
-	FormattedText,
 	Menu,
 	MenuItem,
 	BaseDesignTime,
+	Lib,
 	_createPromise,
-	OverlayRegistry,
 	Plugin,
+	OverlayRegistry,
 	DtUtil,
 	KeyCodes,
 	Device
@@ -43,7 +40,7 @@ sap.ui.define([
 	 * @class The ContextMenu registers event handler to open the context menu. Menu entries can dynamically be added
 	 * @extends sap.ui.dt.Plugin
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.53
@@ -66,10 +63,10 @@ sap.ui.define([
 				closedContextMenu: {}
 			}
 		}
-
 	});
 
 	const sMainStyleClass = "sapUiDtContextMenu";
+	const oTextResources = Lib.getResourceBundleFor("sap.ui.dt");
 
 	ContextMenu.prototype.init = function() {
 		this.oContextMenuControl = new Menu();
@@ -78,6 +75,7 @@ sap.ui.define([
 		this.oContextMenuControl.addStyleClass(sMainStyleClass);
 		this._aMenuItems = [];
 		this._aGroupedItems = [];
+		this._bHasPropagatedMenuItems = false;
 		this._aSubMenus = [];
 	};
 
@@ -166,6 +164,12 @@ sap.ui.define([
 						const aMenuItemsWithPropagatingControl = aMenuItems.map((oMenuItem) => {
 							oMenuItem.propagatingControl = oPropagatedActionInfo.propagatingControl;
 							oMenuItem.propagatingControlName = oPropagatedActionInfo.propagatingControlName;
+							if (BaseDesignTime.isDesignModeEnabled() || !oMenuItem.propagatingControlName) {
+								// in design mode we use the technical name of the propagating control
+								// if no name is provided by the plugin
+								oMenuItem.propagatingControlName =
+									oPropagatedActionInfo.propagatingControl.getMetadata().getName().split(".").pop();
+							}
 							return oMenuItem;
 						});
 						resolve(aMenuItemsWithPropagatingControl);
@@ -175,7 +179,6 @@ sap.ui.define([
 			return null;
 		}).filter(Boolean);
 	}
-
 	/**
 	 * Opens the Context Menu
 	 * @param {sap.ui.dt.Overlay} oOverlay - Overlay object
@@ -184,50 +187,116 @@ sap.ui.define([
 	 */
 	ContextMenu.prototype.open = function(oOverlay, bIsSubMenu, oEvent) {
 		let aSelectedOverlays;
-		function addMenuItems(oMenu, aMenuItems) {
-			let bStartsSection = !!aMenuItems[0]?.propagatingControl;
-			let oTargetOverlay = oOverlay;
-			let aTargetSelectedOverlays = aSelectedOverlays;
-			aMenuItems.forEach(function(oMenuItem, index) {
-				if (oMenuItem.propagatingControl) {
-					oTargetOverlay = OverlayRegistry.getOverlay(oMenuItem.propagatingControl);
-					aTargetSelectedOverlays = [oTargetOverlay];
+		const sExtendedMenuTitle = oTextResources.getText("CTX_EXTENDED_ACTIONS_HEADER");
+		const sExtendedMenuTooltip = oTextResources.getText("CTX_EXTENDED_ACTIONS_HEADER_DESCRIPTION");
+		const oElement = oOverlay.getElement();
+		const oElementDesignTimeMetadata = oOverlay.getDesignTimeMetadata();
+		this.sSelectedControlName = oElementDesignTimeMetadata.getName(oElement)?.singular
+			|| oElement.getMetadata().getName().split(".").pop();
+		this.bHasExtendedActionsTitleSet = false;
+
+		function addMenuItems(oMenu, aMenuItems, sPropagatedControlName, bIsSubMenu, bAddAsNormalActions) {
+			const fnRemoveFocusability = function() {
+				return false;
+			};
+			if (sPropagatedControlName) {
+				// Extended Actions for a propagated control
+				if (!bAddAsNormalActions) {
+					// only add the title once, not for each propagated control
+					if (!this.bHasExtendedActionsTitleSet) {
+						this.bHasExtendedActionsTitleSet = true;
+						const oExtendedActionsItem = new MenuItem({
+							key: "CTX_EXTENDED_MENU_TITLE",
+							id: "CTX_EXTENDED_MENU_TITLE",
+							text: sExtendedMenuTitle,
+							enabled: false
+						});
+						oExtendedActionsItem.addStyleClass("sapUiDtContextMenuExtendedActionsTitle");
+						oExtendedActionsItem.setTooltip(sExtendedMenuTooltip);
+						// prevent focusability of the title item
+						oExtendedActionsItem.isFocusable = fnRemoveFocusability;
+						oMenu.addItem(oExtendedActionsItem);
+					}
+					// we have to provide a unique ID for each propagated control
+					// (in case there are multiple propagated controls in the menu)
+					const sId = `CTX_PROPAGATED_CONTROL_NAME_${sPropagatedControlName.replace(/[\.\s]/g, "_").toUpperCase()}`;
+					const oTitleMenuItem = new MenuItem({
+						key: sId,
+						id: sId,
+						text: sPropagatedControlName,
+						enabled: false
+					});
+					oTitleMenuItem.addStyleClass("sapUiDtContextMenuPropagatedControlTitle");
+					// prevent focusability of the title item
+					oTitleMenuItem.isFocusable = fnRemoveFocusability;
+					oMenu.addItem(oTitleMenuItem);
 				}
-				const sText = typeof oMenuItem.text === "function" ? oMenuItem.text(oTargetOverlay) : oMenuItem.text;
-				const bEnabled = typeof oMenuItem.enabled === "function" ? oMenuItem.enabled(aTargetSelectedOverlays) : oMenuItem.enabled;
-				const oMenuItemInstance = new MenuItem({
-					key: oMenuItem.id,
-					icon: oMenuItem.icon,
-					text: sText,
-					enabled: bEnabled,
-					startsSection: bStartsSection
-				});
-
-				oMenu.addItem(oMenuItemInstance);
-
-				// Add end content to the menu item
-				if (oMenuItem.propagatingControlName || oMenuItem.additionalInfo) {
-					const oFlexBox = new FlexBox({
-						justifyContent: "SpaceBetween",
-						alignItems: "Center"
+				aMenuItems.forEach(function(oMenuItem) {
+					const oTargetOverlay = OverlayRegistry.getOverlay(oMenuItem.propagatingControl);
+					const aTargetSelectedOverlays = [oTargetOverlay];
+					const sText = typeof oMenuItem.text === "function" ? oMenuItem.text(oTargetOverlay) : oMenuItem.text;
+					const bEnabled = typeof oMenuItem.enabled === "function"
+						? oMenuItem.enabled(aTargetSelectedOverlays)
+						: oMenuItem.enabled;
+					const oMenuItemInstance = new MenuItem({
+						key: oMenuItem.id,
+						icon: oMenuItem.icon,
+						text: sText,
+						enabled: bEnabled
 					});
-					if (oMenuItem.propagatingControlName) {
-						oFlexBox.addItem(new FormattedText({
-							htmlText: `<strong>${oMenuItem.propagatingControlName}</strong>`
-						}));
+
+					if (!bAddAsNormalActions) {
+						oMenuItemInstance.addStyleClass("sapUiDtContextMenuPropagatedItem");
 					}
+					oMenu.addItem(oMenuItemInstance);
+					// Add end content to the menu item
 					if (oMenuItem.additionalInfo) {
 						const oAdditionalInfoButton = createAdditionalInfo.call(this, oMenuItem);
-						oFlexBox.addItem(oAdditionalInfoButton);
+						oMenuItemInstance.addEndContent(oAdditionalInfoButton);
 					}
-					oMenuItemInstance.addEndContent(oFlexBox);
+				}.bind(this));
+			} else {
+				// Standard actions for the current context element
+				const aTargetSelectedOverlays = aSelectedOverlays;
+				if (!bIsSubMenu) {
+					const oTitleMenuItem = new MenuItem({
+						key: "CTX_CONTROL_NAME",
+						id: "CTX_CONTROL_NAME",
+						text: this.sSelectedControlName,
+						enabled: false
+					});
+					oTitleMenuItem.addStyleClass("sapUiDtContextMenuControlTitle");
+					// prevent focusability of the title item
+					oTitleMenuItem.isFocusable = fnRemoveFocusability;
+					oMenu.addItem(oTitleMenuItem);
 				}
+				aMenuItems.forEach(function(oMenuItem, index) {
+					const sText = typeof oMenuItem.text === "function" ? oMenuItem.text(oOverlay) : oMenuItem.text;
+					const bEnabled = typeof oMenuItem.enabled === "function"
+						? oMenuItem.enabled(aTargetSelectedOverlays)
+						: oMenuItem.enabled;
+					const oMenuItemInstance = new MenuItem({
+						key: oMenuItem.id,
+						icon: oMenuItem.icon,
+						text: sText,
+						enabled: bEnabled
+					});
 
-				if (oMenuItem.submenu) {
-					addMenuItems.call(this, oMenu.getItems()[index], oMenuItem.submenu);
-				}
-				bStartsSection = false;
-			}.bind(this));
+					oMenu.addItem(oMenuItemInstance);
+
+					// Add end content to the menu item
+					if (oMenuItem.additionalInfo) {
+						const oAdditionalInfoButton = createAdditionalInfo.call(this, oMenuItem);
+						oMenuItemInstance.addEndContent(oAdditionalInfoButton);
+					}
+
+					if (oMenuItem.submenu) {
+						const bIsSubMenu = true;
+						// we need to add one to the index, because we added the control name as first item
+						addMenuItems.call(this, oMenu.getItems()[index + 1], oMenuItem.submenu, undefined, bIsSubMenu);
+					}
+				}.bind(this));
+			}
 		}
 
 		const oNewContextElement = oOverlay.getElement();
@@ -269,7 +338,7 @@ sap.ui.define([
 			this._fnCancelMenuPromise = oDtSyncPromise.cancel;
 			oPromise = oDtSyncPromise.promise
 			.then(function() {
-				this._aGroupedItems = [];
+				this._bHasPropagatedMenuItems = false;
 				this._aSubMenus = [];
 				const aPluginItemPromises = [];
 				const aPlugins = this.getDesignTime().getPlugins();
@@ -286,7 +355,6 @@ sap.ui.define([
 				if (aSelectedOverlays.length === 1) {
 					aPropagatedMenuItemPromises = collectPropagatedMenuItemPromises(aPlugins, aSelectedOverlays[0]);
 				}
-
 				const oPluginItemsPromise = _createPromise(function(resolve, reject) {
 					aPluginItemPromises.push(...aPropagatedMenuItemPromises);
 					Promise.all(aPluginItemPromises).then(resolve).catch(reject);
@@ -295,20 +363,25 @@ sap.ui.define([
 				return oPluginItemsPromise.promise;
 			}.bind(this))
 			.then(function(aPluginMenuItems) {
-				return aPluginMenuItems.reduce(function(aConcatenatedMenuItems, aMenuItems) {
-					return aConcatenatedMenuItems.concat(aMenuItems);
-				});
+				if (aPluginMenuItems.length > 0) {
+					return aPluginMenuItems.reduce(function(aConcatinatedMenuItems, aMenuItems) {
+						return aConcatinatedMenuItems.concat(aMenuItems);
+					});
+				}
+				return aPluginMenuItems;
 			})
 			.then(function(aPluginMenuItems) {
 				aPluginMenuItems.forEach(function(mMenuItem) {
 					if (mMenuItem.submenu !== undefined) {
 						this._addSubMenu(mMenuItem);
+					} else if (mMenuItem.propagatingControlName !== undefined) {
+						this._addMenuItemToGroup(mMenuItem);
+						this.addMenuItem(mMenuItem, true);
 					} else {
 						this.addMenuItem(mMenuItem, true);
 					}
 				}.bind(this));
 
-				this._addItemGroupsToMenu();
 				delete this._fnCancelMenuPromise;
 			}.bind(this));
 		}
@@ -319,15 +392,28 @@ sap.ui.define([
 			});
 
 			if (aAllMenuItems.length > 0) {
+				const bIsSubMenu = false;
 				const aMenuItems = this._sortMenuItems(aAllMenuItems.filter((mMenuItem) => !mMenuItem.propagatingControl));
-				const aPropagatedMenuItems = this._sortMenuItems(aAllMenuItems.filter((mMenuItem) => mMenuItem.propagatingControl));
-				addMenuItems.call(this, this.oContextMenuControl, aMenuItems);
-				addMenuItems.call(this, this.oContextMenuControl, aPropagatedMenuItems, true);
+				addMenuItems.call(this, this.oContextMenuControl, aMenuItems, undefined, bIsSubMenu);
+				this._aGroupedItems.forEach(function(oPropagatedMenuItemGroup) {
+					const bAddAsNormalActions = (oPropagatedMenuItemGroup.sGroupName === this.sSelectedControlName);
+					addMenuItems.call(
+						this,
+						this.oContextMenuControl,
+						oPropagatedMenuItemGroup.aGroupedItems,
+						oPropagatedMenuItemGroup.sGroupName,
+						bIsSubMenu,
+						bAddAsNormalActions
+					);
+				}.bind(this));
 				// we have to distinguish between the mouse and the keyboard event
 				const oOpenerRef = (oEvent.type === "keyup") ? oOverlay : undefined;
+				// Set focus to the overlay before opening the context menu to ensure that the keyboard
+				// navigation works properly after closing, as the popover restores the focus
+				// to the last focused element before opening (which can be a non-selectable overlay).
+				oOverlay.focus();
 				this.oContextMenuControl.openAsContextMenu(oEvent, oOpenerRef);
 			}
-
 			this.fireOpenedContextMenu();
 		}.bind(this))
 		.catch(function(oError) {
@@ -478,6 +564,7 @@ sap.ui.define([
 	 * Called when ContextMenu gets closed
 	 */
 	ContextMenu.prototype._contextMenuClosed = function() {
+		this._aGroupedItems = [];
 		this.fireClosedContextMenu();
 	};
 
@@ -508,12 +595,7 @@ sap.ui.define([
 		if (Device.os.ios) {
 			return false;
 		}
-
-		if (this.getDesignTime().getBusyPlugins().length) {
-			return true;
-		}
-
-		return false;
+		return !!this.getDesignTime().getBusyPlugins().length;
 	};
 
 	/**
@@ -521,18 +603,28 @@ sap.ui.define([
 	 * @param {object} mMenuItem The menu item to add to a group
 	 */
 	ContextMenu.prototype._addMenuItemToGroup = function(mMenuItem) {
+		const sGroupName = mMenuItem.propagatingControlName;
 		const bGroupExists = this._aGroupedItems.some(function(_oGroupedItem) {
-			if (_oGroupedItem.sGroupName === mMenuItem.group) {
+			if (_oGroupedItem.sGroupName === sGroupName) {
 				_oGroupedItem.aGroupedItems.push(mMenuItem);
 				return true;
 			}
 		});
 
 		if (!bGroupExists) {
-			this._aGroupedItems.push({
-				sGroupName: mMenuItem.group,
-				aGroupedItems: [mMenuItem]
-			});
+			if (sGroupName !== this.sSelectedControlName) {
+				this._aGroupedItems.push({
+					sGroupName: mMenuItem.propagatingControlName,
+					aGroupedItems: [mMenuItem]
+				});
+				this._bHasPropagatedMenuItems = true;
+			} else {
+				// ensure that the group with the same name as the current control is always on top
+				this._aGroupedItems.unshift({
+					sGroupName: mMenuItem.propagatingControlName,
+					aGroupedItems: [mMenuItem]
+				});
+			}
 		}
 	};
 
@@ -553,26 +645,5 @@ sap.ui.define([
 		this.addMenuItem(mMenuItem, true);
 	};
 
-	/**
-	 * Adds the grouped menu item to the collapsed version of a ContextMenu
-	 */
-	ContextMenu.prototype._addItemGroupsToMenu = function() {
-		this._aGroupedItems.forEach(function(oGroupedItem) {
-			// If there is only one menu item that belongs to a group we don't need that group
-			if (oGroupedItem.aGroupedItems.length === 1) {
-				this.addMenuItem(oGroupedItem.aGroupedItems[0], true);
-			} else {
-				this.addMenuItem({
-					id: `${oGroupedItem.sGroupName}-groupItem`,
-					enabled: true,
-					text: oGroupedItem.sGroupName,
-					icon: oGroupedItem.aGroupedItems[0].icon,
-					rank: oGroupedItem.aGroupedItems[0].rank,
-					submenu: oGroupedItem.aGroupedItems
-				}, true);
-			}
-		}.bind(this));
-	};
-
 	return ContextMenu;
 });

package/src/sap/ui/dt/plugin/ControlDragDrop.js

@@ -26,7 +26,7 @@ sap.ui.define([
 	 * @class The ControlDragDrop enables D&D functionality for the overlays based on aggregation types
 	 * @extends sap.ui.dt.plugin.DragDrop
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.30

package/src/sap/ui/dt/plugin/CutPaste.js

@@ -33,7 +33,7 @@ sap.ui.define([
 	 * @class The CutPaste enables Cut & Paste functionality for the overlays based on aggregation types
 	 * @extends sap.ui.dt.Plugin
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.34

package/src/sap/ui/dt/plugin/DragDrop.js

@@ -36,7 +36,7 @@ sap.ui.define([
 	 * @extends sap.ui.dt.Plugin
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/plugin/ElementMover.js

@@ -30,7 +30,7 @@ sap.ui.define([
 	 * @class The ElementMover enables movement of UI5 elements based on aggregation types, which can be used by drag and
 	 *        drop or cut and paste behavior.
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.34

package/src/sap/ui/dt/plugin/MouseSelection.js

@@ -22,7 +22,7 @@ function(Plugin) {
 	 * @extends sap.ui.dt.Plugin
 	 *
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/ui/dt/plugin/ToolHooks.js

@@ -16,7 +16,7 @@ sap.ui.define([
 	 *
 	 * @extends sap.ui.dt.Plugin
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 * @constructor
 	 * @private
 	 * @since 1.61

package/src/sap/ui/dt/themes/base/ContextMenu.less

@@ -1,7 +1,10 @@
 /******************************************************************
 	Style of the DT Contextmenu - base Theme
 *******************************************************************/
-@_sap_ui_dt_ContextMenu_MnuItemTextColor: @sapUiBaseText;
+@_sap_ui_dt_ContextMenu_MnuItemTextColor: var(--sapTextColor); // #000
+@_sap_ui_dt_ContextMenu_MnuItemIconColor: var(--sapContent_NonInteractiveIconColor); // #111
+@_sap_ui_dt_ContextMenu_PrpgtedMnuItemBGColor: var(--sapList_AlternatingBackground); // darken(#111, 10);
+@_sap_ui_dt_ContextMenu_PrpgtedTitleBorderColor: var(--sapShell_BorderColor); // #111
 
 .sapUiDtContextMenu.sapMMenu {
 	.sapMMenuList {
@@ -30,7 +33,7 @@
 						}
 					}
 					.sapUiIcon {
-						color: @_sap_ui_dt_ContextMenu_MnuItemTextColor !important;
+						color: @_sap_ui_dt_ContextMenu_MnuItemIconColor !important;
 					}
 				}
 			}
@@ -38,6 +41,66 @@
 			&.sapMMenuItemDisabled {
 				opacity: 0.5;
 			}
+
+			// style for control names
+			&.sapUiDtContextMenuControlTitle {
+				opacity: 1;
+				height: 1.5rem;
+				.sapMMenuItemIcon {
+					display: none;
+				}
+				.sapMMenuItemText {
+					font-weight: bold;
+					color: @_sap_ui_dt_ContextMenu_MnuItemTextColor;
+				}
+			}
+
+			// Style for title "Extended Actions"
+			&.sapUiDtContextMenuExtendedActionsTitle {
+				opacity: 1;
+				height: 2rem;
+				text-align: center;
+				background-color: @_sap_ui_dt_ContextMenu_PrpgtedMnuItemBGColor;
+				border-top: 0.063rem solid @_sap_ui_dt_ContextMenu_PrpgtedTitleBorderColor;
+				border-bottom: 0.063rem solid @_sap_ui_dt_ContextMenu_PrpgtedTitleBorderColor;
+				border-radius: 0;
+				padding: 0.313rem 0.625rem;
+				.sapMMenuItemIcon {
+					display: none;
+				}
+				.sapMMenuItemText {
+					color: @_sap_ui_dt_ContextMenu_MnuItemTextColor;
+				}
+			}
+
+			// style for names of propagated controls
+			&.sapUiDtContextMenuPropagatedControlTitle {
+				opacity: 1;
+				height: 1.5rem;
+				background-color: @_sap_ui_dt_ContextMenu_PrpgtedMnuItemBGColor;
+				margin: 0!important;
+				padding: 0.313rem 0.625rem;
+				.sapMMenuItemIcon {
+					display: none;
+				}
+				.sapMMenuItemText {
+					font-weight: bold;
+					color: @_sap_ui_dt_ContextMenu_MnuItemTextColor;
+				}
+			}
+
+			// style for propagated menu items
+			&.sapUiDtContextMenuPropagatedItem {
+				margin: 0!important;
+				&:not(:hover) {
+					background-color: @_sap_ui_dt_ContextMenu_PrpgtedMnuItemBGColor;
+				}
+				&.sapMMenuItemDisabled{
+					&:hover {
+						background-color: @_sap_ui_dt_ContextMenu_PrpgtedMnuItemBGColor;
+					}
+				}
+			}
 		}
 	}
 }
@@ -59,7 +122,7 @@
 }
 
 .sapUiSizeCompact .sapMMenu.sapUiDtContextMenu {
-	.sapMMenuItem {
+	.sapMMenuItem:not(.sapUiDtContextMenuControlTitle):not(.sapUiDtContextMenuPropagatedControlTitle):not(.sapUiDtContextMenuExtendedActionsTitle) {
 		height: 2.25rem;
 		padding: 0 0.25rem;
 
@@ -77,8 +140,15 @@
 }
 
 html.sap-desktop, html.sap-tablet {
-
-	& .sapUiSizeCozy .sapUiDtContextMenu.sapMMenu .sapMMenuList > .sapMMenuItem > .sapMMenuItemIcon + .sapMMenuItemText {
-		margin-left: 1.75rem;
+	.sapUiSizeCozy {
+		.sapUiDtContextMenu.sapMMenu {
+			.sapMMenuList {
+				.sapMMenuItem:not(.sapUiDtContextMenuPropagatedControlTitle):not(.sapUiDtContextMenuControlTitle):not(.sapUiDtContextMenuExtendedActionsTitle) {
+					.sapMMenuItemIcon + .sapMMenuItemText {
+						margin-left: 1.75rem;
+					}
+				}
+			}
+		}
 	}
 }

package/src/sap/ui/dt/util/ZIndexManager.js

@@ -28,7 +28,7 @@ sap.ui.define([
 	 *
 	 * @namespace
 	 * @author SAP SE
-	 * @version 1.140.0
+	 * @version 1.141.0
 	 *
 	 * @private
 	 * @since 1.64