@openui5/sap.m 1.121.0 → 1.122.0

package/THIRDPARTY.txt

@@ -461,7 +461,7 @@ License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: lib/jsdoc/ui5/plugin.js
 
-Component: SAP Theming Base Content, version: 11.10.0
+Component: SAP Theming Base Content, version: 11.12.0
 Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.m",
-  "version": "1.121.0",
+  "version": "1.122.0",
   "description": "OpenUI5 UI Library sap.m",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,8 +14,8 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.ui.core": "1.121.0",
-    "@openui5/sap.ui.layout": "1.121.0",
-    "@openui5/sap.ui.unified": "1.121.0"
+    "@openui5/sap.ui.core": "1.122.0",
+    "@openui5/sap.ui.layout": "1.122.0",
+    "@openui5/sap.ui.unified": "1.122.0"
   }
 }

package/src/sap/m/.library

@@ -6,7 +6,7 @@
   <copyright>OpenUI5
  * (c) Copyright 2009-2024 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
-  <version>1.121.0</version>
+  <version>1.122.0</version>
 
   <documentation>The main UI5 control library, with responsive controls that can be used in touch devices as well as desktop browsers.</documentation>
 

package/src/sap/m/AccButton.js

@@ -21,7 +21,7 @@ sap.ui.define(['./Button','./AccButtonRenderer'],
 	 * @extends sap.m.Button
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/m/ActionListItem.js

@@ -31,7 +31,7 @@ sap.ui.define(['./ListItemBase', './library', './ActionListItemRenderer'],
 	 * @extends sap.m.ListItemBase
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/ActionSelect.js

@@ -20,7 +20,7 @@ sap.ui.define(['./Select', "sap/ui/core/Element", 'sap/ui/core/InvisibleText', '
 		 * @extends sap.m.Select
 		 *
 		 * @author SAP SE
-		 * @version 1.121.0
+		 * @version 1.122.0
 		 *
 		 * @constructor
 		 * @public

package/src/sap/m/ActionSheet.js

@@ -76,7 +76,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/ActionTile.js

@@ -31,10 +31,11 @@ sap.ui.define([
 	* @extends sap.m.GenericTile
 	*
 	* @author SAP SE
-	* @version 1.121.0
-	* @since 1.107.0
+	* @version 1.122.0
 	*
-	* @private
+	* @public
+	* @experimental since 1.122
+	* @since 1.122
 	* @alias sap.m.ActionTile
 	*/
 

package/src/sap/m/ActionTileContent.js

@@ -27,10 +27,11 @@ sap.ui.define([
      * @extends sap.m.TileContent
      *
      * @author SAP SE
-     * @version 1.121.0
-     * @since 1.107.0
+     * @version 1.122.0
+     * @since 1.122
      *
-     * @private
+     * @public
+     * @experimental since 1.122
      * @alias sap.m.ActionTileContent
     */
 
@@ -38,6 +39,9 @@ sap.ui.define([
         metadata: {
             library: "sap.m",
             aggregations : {
+                /**
+                 * Holds detail of an attribute used in the ActionTile.
+                 */
                 attributes: { type: "sap.m.TileAttribute", multiple: true, singularName: "attribute"}
             },
 			events: {
@@ -72,7 +76,7 @@ sap.ui.define([
 						 *
 						 * @since 1.121
 						 */
-						link: { type: "sap.m.link" }
+						link: { type: "sap.m.Link" }
 					}
 				}
 			}

package/src/sap/m/AdditionalTextButton.js

@@ -21,7 +21,7 @@ sap.ui.define(['./Button','./AdditionalTextButtonRenderer'],
 	 * @extends sap.m.Button
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/m/App.js

@@ -49,7 +49,7 @@ sap.ui.define([
 	 * @extends sap.m.NavContainer
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/AssociativeOverflowToolbar.js

@@ -20,7 +20,7 @@ sap.ui.define(['sap/base/Log', './OverflowToolbar', './OverflowToolbarRenderer',
 		 * @extends sap.m.OverflowToolbar
 		 *
 		 * @author SAP SE
-		 * @version 1.121.0
+		 * @version 1.122.0
 		 *
 		 * @constructor
 		 * @private
@@ -83,7 +83,7 @@ sap.ui.define(['sap/base/Log', './OverflowToolbar', './OverflowToolbarRenderer',
 
 		AssociativeOverflowToolbar.prototype.exit = function () {
 			OverflowToolbar.prototype.exit.apply(this, arguments);
-			return this._callToolbarMethod('destroyContent', [true]);
+			this._callToolbarMethod('destroyContent', [true]);
 		};
 
 		AssociativeOverflowToolbar.prototype.indexOfContent = function(oControl) {

package/src/sap/m/Avatar.js

@@ -85,7 +85,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public
@@ -768,7 +768,7 @@ sap.ui.define([
 				var iAvatarWidth = $this[0].offsetWidth,
 				iInitialsHolderWidth = this.$oInitialsHolder[0].offsetWidth;
 
-				if (iInitialsHolderWidth > iAvatarWidth) {
+				if (iInitialsHolderWidth >= iAvatarWidth) {
 					this._wideInitialsIcon();
 				}
 			}

package/src/sap/m/Bar.js

@@ -57,7 +57,7 @@ sap.ui.define([
 	 * @implements sap.m.IBar
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/Breadcrumbs.js

@@ -72,7 +72,7 @@ sap.ui.define([
 	 * @implements sap.m.IBreadcrumbs, sap.m.IOverflowToolbarContent, sap.ui.core.IShrinkable
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/BusyDialog.js

@@ -5,8 +5,8 @@
  */
 
 // Provides control sap.m.BusyDialog.
-sap.ui.define(['./library', 'sap/ui/core/Control', 'sap/m/Dialog', 'sap/m/BusyIndicator', 'sap/m/Label', 'sap/m/Button', "sap/base/Log", 'sap/ui/core/Core', 'sap/ui/core/InvisibleText', "sap/ui/core/Lib"],
-	function(library, Control, Dialog, BusyIndicator, Label, Button, Log, Core, InvisibleText, Library) {
+sap.ui.define(['./library', 'sap/ui/core/Control', 'sap/m/Dialog', 'sap/m/BusyIndicator', 'sap/m/Label', 'sap/m/Button', "sap/base/Log", 'sap/ui/core/InvisibleText', "sap/ui/core/Lib"],
+	function(library, Control, Dialog, BusyIndicator, Label, Button, Log, InvisibleText, Library) {
 		"use strict";
 
 		// shortcut for sap.m.TitleAlignment
@@ -46,7 +46,7 @@ sap.ui.define(['./library', 'sap/ui/core/Control', 'sap/m/Dialog', 'sap/m/BusyIn
 		 * @extends sap.ui.core.Control
 		 *
 		 * @author SAP SE
-		 * @version 1.121.0
+		 * @version 1.122.0
 		 *
 		 * @public
 		 * @alias sap.m.BusyDialog

package/src/sap/m/BusyIndicator.js

@@ -46,7 +46,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/Button.js

@@ -98,7 +98,7 @@ sap.ui.define([
 	 * @mixes sap.ui.core.ContextMenuSupport
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/Carousel.js

@@ -132,7 +132,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public
@@ -966,6 +966,14 @@ sap.ui.define([
 		if (!this._bDragging || this._bDragCanceled || oEvent.isMarked("delayedMouseEvent")) {
 			return;
 		}
+
+		const sTargetTag = oEvent.target.tagName.toLowerCase();
+		const bIsEditable = oEvent.target.isContentEditable;
+
+		if (sTargetTag === "input" || sTargetTag === "textarea" || sTargetTag === "select" || bIsEditable) {
+			return;
+		}
+
 		// mark the event for components that need to know if the event was handled by the carousel
 		oEvent.setMarked();
 

package/src/sap/m/CarouselLayout.js

@@ -17,7 +17,7 @@ sap.ui.define(["sap/ui/base/ManagedObject", "./library"], function (ManagedObjec
 	 * Applies a <code>sap.m.CarouselLayout</code> to a provided DOM element or Control.
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @extends sap.ui.base.ManagedObject
 	 *

package/src/sap/m/CheckBox.js

@@ -95,7 +95,7 @@ sap.ui.define([
 	 * @borrows sap.ui.core.ISemanticFormContent.getFormRenderAsControl as #getFormRenderAsControl
 	 *
 	 * @author SAP SE
-	 * @version 1.121.0
+	 * @version 1.122.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/ColorPalette.js

@@ -57,6 +57,8 @@ sap.ui.define([
 		// The name of the class, corresponding to a single color item
 		var CSS_CLASS_SWATCH = "sapMColorPaletteSquare";
 
+		var CSS_CLASS_REGION = "sapMColorPaletteContent";
+
 		// Defines the exact count of swatches per row
 		var SWATCHES_PER_ROW = 5;
 
@@ -106,7 +108,7 @@ sap.ui.define([
 		 * To prevent this, apps using the <code>ColorPalette</code> should also load the <code>sap.ui.unified</code> library in advance.
 		 *
 		 * @extends sap.ui.core.Control
-		 * @version 1.121.0
+		 * @version 1.122.0
 		 *
 		 * @constructor
 		 * @public
@@ -139,7 +141,14 @@ sap.ui.define([
 							"dimgray",
 							"black"
 						]
-					}
+					},
+
+					/**
+					 * The last selected color in the ColorPalette.
+					 * @since 1.122
+					 * @experimental Since 1.122, this property is in a beta state.
+					 */
+					selectedColor: { type: "sap.ui.core.CSSColor", defaultValue: null }
 				},
 
 				aggregations: {
@@ -153,6 +162,8 @@ sap.ui.define([
 				events: {
 					/**
 					 * Fired when the user selects a color.
+					 * Note: The <code>selectedColor</code> property is updated after the event is fired.
+					 * Use the event parameter <code>value</code> to retrieve the new value for <code>selectedColor</code>.
 					 */
 					colorSelect: {
 						parameters: {
@@ -254,6 +265,12 @@ sap.ui.define([
 
 			// Queue of recently used colors
 			this._recentColors = [];
+
+			// If the last selected color is found in the main ColorPalette.
+			this._bMainRegionSelection = true;
+
+			// If "Default Color" was selected
+			this._bDefaultColorSelected = false;
 		};
 
 		ColorPalette.prototype.exit = function () {
@@ -288,7 +305,7 @@ sap.ui.define([
 		 * Sets a default displayMode.
 		 * @param {sap.ui.unified.ColorPickerDisplayMode} oDisplayMode the color
 		 * @private
-		 * @return {this} <code>this</code> for method chaining
+		 * @returns {this} Reference to <code>this</code> for method chaining
 		 */
 		ColorPalette.prototype._setDisplayMode = function (oDisplayMode) {
 			var oColorPicker = this._getColorPicker();
@@ -308,16 +325,23 @@ sap.ui.define([
 		};
 
 		ColorPalette.prototype.ontap = function (oEvent) {
-			var $Target = jQuery(oEvent.target),
+			var oTarget = oEvent.target,
 				sColor,
-				$Swatch;
+				oSwatch,
+				oRegion,
+				sRegion;
+
+			oSwatch = oTarget.closest("." + CSS_CLASS_SWATCH);
+			oRegion = oTarget.closest("." + CSS_CLASS_REGION);
 
-			$Swatch = $Target.closest("." + CSS_CLASS_SWATCH);
-			if (!$Swatch.length) {
+			if (!(oSwatch && oRegion)) {
 				return;
 			}
 
-			sColor = $Swatch.attr("data-sap-ui-color");
+			sColor = oSwatch.getAttribute("data-sap-ui-color");
+			sRegion = oRegion.getAttribute("data-sap-ui-region");
+			this._bMainRegionSelection = sRegion === "main-colors-palette";
+
 			this._fireColorSelect(sColor, false, oEvent);
 		};
 
@@ -330,6 +354,7 @@ sap.ui.define([
 			}
 
 			if (oElementInfo.bIsDefaultColorButton) {
+				this._bMainRegionSelection = false;
 				this._fireColorSelect(this._getDefaultColor(), true, oEvent);
 				return;
 			}
@@ -357,6 +382,10 @@ sap.ui.define([
 		ColorPalette.prototype.pushToRecentColors = function (sColor) {
 			var iIndexOfColor = this._recentColors.indexOf(sColor);
 
+			if (!sColor) {
+				return;
+			}
+
 			if (iIndexOfColor > -1){
 				this._recentColors.splice(iIndexOfColor,1);
 			} else if (this._recentColors.length === 5) {
@@ -372,7 +401,7 @@ sap.ui.define([
 		 * Sets a selected color for the ColorPicker control.
 		 * @param {sap.ui.core.CSSColor} color the selected color
 		 * @public
-		 * @return {this} <code>this</code> for method chaining
+		 * @returns {this} Reference to <code>this</code> for method chaining
 		 */
 		ColorPalette.prototype.setColorPickerSelectedColor = function (color) {
 			if (!CSSColor.isValid(color)) {
@@ -390,6 +419,7 @@ sap.ui.define([
 				text: oLibraryResourceBundle.getText("COLOR_PALETTE_DEFAULT_COLOR"),
 				visible: this._getShowDefaultColorButton(),
 				press: function (oEvent) {
+					this._bMainRegionSelection = false;
 					this._fireColorSelect(this._getDefaultColor(), true, oEvent);
 				}.bind(this)
 			});
@@ -404,7 +434,7 @@ sap.ui.define([
 		 * Sets a default color.
 		 * @param {sap.ui.core.CSSColor} color the color
 		 * @private
-		 * @return {this} <code>this</code> for method chaining
+		 * @returns {this} Reference to <code>this</code> for method chaining
 		 */
 		ColorPalette.prototype._setDefaultColor = function (color) {
 			if (!CSSColor.isValid(color)) {
@@ -414,7 +444,6 @@ sap.ui.define([
 			return this;
 		};
 
-
 		ColorPalette.prototype._getShowDefaultColorButton = function () {
 			return this._bShowDefaultColorButton;
 		};
@@ -494,6 +523,24 @@ sap.ui.define([
 			return this.getAggregation("_moreColorsButton");
 		};
 
+		/**
+		 * Returns <code>true</code> if the selected color is in the main Color Palette region
+		 * @private
+		 * @returns {boolean} <code>true</code> if the selected color is in the main region
+		 */
+		ColorPalette.prototype._isSelectedInMainRegion = function() {
+			return this._bMainRegionSelection;
+		};
+
+		/**
+		 * Returns <code>true</code> if the selected color is in the Recent Colors region
+		 * @private
+		 * @returns {boolean} <code>true</code> if the selected color is in the Recent Colors region
+		 */
+		 ColorPalette.prototype._isSelectedInRecentColors = function() {
+			return !(this._bDefaultColorSelected || this._bMainRegionSelection);
+		};
+
 		/**
 		 * Opens a color picker in a Dialog.
 		 * The function assumes that there is a "more colors.." button visible.
@@ -544,6 +591,7 @@ sap.ui.define([
 				press: function (oEvent) {
 					oDialog.close();
 					if (oDialog._oColorPicker.getColorString()) {
+						this._bMainRegionSelection = false;
 						this._fireColorSelect(oDialog._oColorPicker.getColorString(), false, oEvent);
 					}
 				}.bind(this)
@@ -571,6 +619,28 @@ sap.ui.define([
 			oFirstSwatchElement.focus();
 		};
 
+		/**
+		 * Focuses the selected or first available element in the palette.
+		 * @private
+		 */
+	   ColorPalette.prototype._focusSelectedElement = function () {
+			var oSelectedElement,
+				oFirstRecentSwatch = this._getAllRecentColorSwatches()[0];
+
+			if (!this.getSelectedColor() || this._bDefaultColorSelected) {
+				this._focusFirstElement();
+				return;
+			}
+
+			if (this._bMainRegionSelection){
+				oSelectedElement = this._getAllPaletteColorSwatches().find((oDomRefs) => oDomRefs.classList.contains("sapMColorPaletteSquareSelected"));
+			} else {
+				oSelectedElement = oFirstRecentSwatch;
+			}
+
+			oSelectedElement ? oSelectedElement.focus() : this._focusFirstElement();
+	   };
+
 		/**
 		 * Helper function to fire the event "colorSelect"
 		 * @param {sap.ui.core.CSSColor} color the color
@@ -580,6 +650,8 @@ sap.ui.define([
 		 */
 		ColorPalette.prototype._fireColorSelect = function (color, defaultAction, oOriginalEvent) {
 			this.fireColorSelect({value: color, defaultAction: defaultAction, _originalEvent: oOriginalEvent});
+			this._bDefaultColorSelected = defaultAction;
+			this.setSelectedColor(color);
 			this.pushToRecentColors(color);
 		};
 
@@ -848,7 +920,7 @@ sap.ui.define([
 		 * Analyzes if given DOM element is one of the <code>ColorPalette</code> artifacts (Default Color, More Colors,
 		 * swatch color).
 		 * @param {Element} oElement DOM Element
-		 * @return {{bIsDefaultColorButton: *, bIsMoreColorsButton: boolean|*, bIsASwatch: boolean|*}} result
+		 * @returns {{bIsDefaultColorButton: *, bIsMoreColorsButton: boolean|*, bIsASwatch: boolean|*}} result
 		 * @private
 		 */
 		ColorPalette.prototype._getElementInfo = function (oElement) {
@@ -923,7 +995,7 @@ sap.ui.define([
 
 		/**
 		 * Returns the number of columns defined.
-		 * @return {*}
+		 * @returns {int} The number of columns.
 		 */
 		ItemNavigationHomeEnd.prototype.getColumns = function() {
 			return this.iColumns;
@@ -1065,7 +1137,7 @@ sap.ui.define([
 		/**
 		 * Analyzes the given item and produces information about its position.
 		 * @param {number} iIndex the item given by its position
-		 * @return {{bIsLastItem: boolean, bIsInTheLastColumn: boolean, bNextRowExists: boolean|*, bItemSameColumnNextRowExists: boolean|*}}
+		 * @returns {{bIsLastItem: boolean, bIsInTheLastColumn: boolean, bNextRowExists: boolean|*, bItemSameColumnNextRowExists: boolean|*}}
 		 * @private
 		 */
 		ItemNavigationHomeEnd.prototype._getItemInfo = function(iIndex) {
@@ -1093,7 +1165,7 @@ sap.ui.define([
 
 		/**
 		 * Calculates the index of the first item in the last row.
-		 * @return {int} the index(zero based) of the first/last item in the row.
+		 * @returns {int} the index(zero based) of the first/last item in the row.
 		 * @private
 		 */
 		ItemNavigationHomeEnd.prototype._getIndexOfTheFirstItemInLastRow = function () {
@@ -1149,7 +1221,7 @@ sap.ui.define([
 			/**
 			 * Returns a named color for given color. For example - "gold" for input "#FFB200".
 			 * @param {string} sColor the given color
-			 * @return {string|undefined} The named color, if such can really corresponds to the input color, or undefined otherwise.
+			 * @returns {string|undefined} The named color, if such can really correspond to the input color, or <code>undefined</code> otherwise.
 			 */
 			getNamedColor: function (sColor) {
 				var sHexColor = "";

package/src/sap/m/ColorPalettePopover.js

@@ -39,7 +39,7 @@ sap.ui.define([
 		 * A thin wrapper over {@link sap.m.ColorPalette} allowing the latter to be used in a popover.
 		 *
 		 * @extends sap.ui.core.Control
-		 * @version 1.121.0
+		 * @version 1.122.0
 		 *
 		 * @public
 		 * @since 1.54
@@ -81,6 +81,13 @@ sap.ui.define([
 						]
 					},
 
+					/**
+					 * The last selected color in the ColorPalette.
+					 * @since 1.122
+					 * @experimental Since 1.122, this property is in a beta state.
+					 */
+					selectedColor: { type: "sap.ui.core.CSSColor", defaultValue: null },
+
 					/**
 					 * Indicates if the button for default color selection is available.
 					 */
@@ -193,6 +200,7 @@ sap.ui.define([
 		var FORWARDABLE = {
 			COLOR_PALETTE_PROPS: {
 				colors: "setColors",
+				selectedColor: "setSelectedColor",
 				defaultColor: "_setDefaultColor",
 				showDefaultColorButton: "_setShowDefaultColorButton",
 				showMoreColorsButton: "_setShowMoreColorsButton",
@@ -230,7 +238,7 @@ sap.ui.define([
 		 * On table or desktop devices, the popover is positioned relative to the given <code>oControl</code>
 		 * parameter. On phones, it is shown full screen, the <code>oControl</code> parameter is ignored.
 		 *
-		 * @param {sap.ui.core.Control} oCpntrol
+		 * @param {sap.ui.core.Control} oControl
 		 *    When displayed on a tablet or desktop device, the <code>ColorPalettePopover</code> is positioned
 		 *    relative to this control
 		 * @returns {sap.ui.core.Control}
@@ -299,7 +307,7 @@ sap.ui.define([
 				showCloseButton: false,
 				title: oLibraryResourceBundle.getText("COLOR_PALETTE_TITLE"),
 				content: oColorPalette,
-				afterOpen: oColorPalette._focusFirstElement.bind(oColorPalette)
+				afterOpen: oColorPalette._focusSelectedElement.bind(oColorPalette)
 
 			}).addStyleClass("sapMColorPaletteContainer");