@openui5/sap.m 1.103.0 → 1.105.0

package/src/sap/m/IllustratedMessage.js

@@ -82,7 +82,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -115,6 +115,14 @@ sap.ui.define([
 				 */
 				enableFormattedText: { type: "boolean", group: "Appearance", defaultValue: false },
 
+				/**
+				 * Defines whether the <code>IllustratedMessage</code> would resize itself according to it's height
+				 * if <code>illustrationSize</code> property is set to <code>IllustratedMessageSize.Auto</code>.
+				 *
+				 * @since 1.104
+				 */
+				enableVerticalResponsiveness: { type: "boolean", group: "Appearance", defaultValue: false },
+
 				/**
 				 * Determines which illustration breakpoint variant is used.
 				 *
@@ -258,6 +266,12 @@ sap.ui.define([
 		BASE: 259
 	};
 
+	IllustratedMessage.BREAK_POINTS_HEIGHT = {
+		DIALOG: 451,
+		SPOT: 296,
+		BASE: 154
+	};
+
 	IllustratedMessage.MEDIA = {
 		BASE: "sapMIllustratedMessage-Base",
 		SPOT: "sapMIllustratedMessage-Spot",
@@ -274,6 +288,7 @@ sap.ui.define([
 	 */
 
 	IllustratedMessage.prototype.init = function () {
+		this._sLastKnownMedia = null;
 		this._updateInternalIllustrationSetAndType(this.getIllustrationType());
 	};
 
@@ -452,7 +467,7 @@ sap.ui.define([
 	/**
 	 * Helper function which ensures that there is non-breaking space between the last two words
 	 * of a given DOM content. By adding it, we prevent one word (widow) on the last row of a text node.
-	 * @param {DOMRef} oDomRef - the DOM object which will be checked against
+	 * @param {HTMLElement} oDomRef - the DOM object which will be checked against
 	 * @private
 	 */
 	IllustratedMessage.prototype._preventWidowWords = function(oDomRef) {
@@ -477,14 +492,16 @@ sap.ui.define([
 	 */
 	IllustratedMessage.prototype._updateDomSize = function () {
 		var oDomRef = this.getDomRef(),
-			sSize;
+			sSize, sCustomSize;
 
 		if (oDomRef) {
 			sSize = this.getIllustrationSize();
 			if (sSize === IllustratedMessageSize.Auto) {
-				this._updateMedia(oDomRef.getBoundingClientRect().width);
+				this._updateMedia(oDomRef.getBoundingClientRect().width, oDomRef.getBoundingClientRect().height);
 			} else {
-				this._updateMediaStyle(IllustratedMessage.MEDIA[sSize.toUpperCase()]);
+				sCustomSize = IllustratedMessage.MEDIA[sSize.toUpperCase()];
+				this._updateMediaStyle(sCustomSize);
+				this._updateSymbol(sCustomSize);
 			}
 		}
 
@@ -507,50 +524,72 @@ sap.ui.define([
 	 * @private
 	 */
 	IllustratedMessage.prototype._onResize = function (oEvent) {
-		var iCurrentWidth = oEvent.size.width;
+		var iCurrentWidth = oEvent.size.width,
+			iCurrentHeight = oEvent.size.height;
 
-		this._updateMedia(iCurrentWidth);
+		this._updateMedia(iCurrentWidth, iCurrentHeight);
 	};
 
 	/**
-	 * Updates the media size of the control based on its own width, not on the entire screen size (which media query does).
+	 * Updates the media size of the control based on its own width and height, not on the entire screen size (which media query does).
 	 * @param {number} iWidth - the actual width of the control
+	 * @param {number} iHeight - the actual height of the control
 	 * @private
 	 */
-	IllustratedMessage.prototype._updateMedia = function (iWidth) {
-		if (!iWidth) {
+	IllustratedMessage.prototype._updateMedia = function (iWidth, iHeight) {
+		var bVertical = this.getEnableVerticalResponsiveness(),
+			sNewMedia;
+
+		if (!iWidth && !iHeight) {
 			return;
 		}
 
-		if (iWidth <= IllustratedMessage.BREAK_POINTS.BASE) {
-			this._updateMediaStyle(IllustratedMessage.MEDIA.BASE);
-		} else if (iWidth <= IllustratedMessage.BREAK_POINTS.SPOT) {
-			this._updateMediaStyle(IllustratedMessage.MEDIA.SPOT);
-		} else if (iWidth <= IllustratedMessage.BREAK_POINTS.DIALOG) {
-			this._updateMediaStyle(IllustratedMessage.MEDIA.DIALOG);
+		if (iWidth <= IllustratedMessage.BREAK_POINTS.BASE || (iHeight <= IllustratedMessage.BREAK_POINTS_HEIGHT.BASE && bVertical)) {
+			sNewMedia = IllustratedMessage.MEDIA.BASE;
+		} else if (iWidth <= IllustratedMessage.BREAK_POINTS.SPOT || (iHeight <= IllustratedMessage.BREAK_POINTS_HEIGHT.SPOT && bVertical)) {
+			sNewMedia = IllustratedMessage.MEDIA.SPOT;
+		} else if (iWidth <= IllustratedMessage.BREAK_POINTS.DIALOG || (iHeight <= IllustratedMessage.BREAK_POINTS_HEIGHT.DIALOG && bVertical)) {
+			sNewMedia = IllustratedMessage.MEDIA.DIALOG;
 		} else {
-			this._updateMediaStyle(IllustratedMessage.MEDIA.SCENE);
+			sNewMedia = IllustratedMessage.MEDIA.SCENE;
 		}
+
+		this._updateMediaStyle(sNewMedia);
+		this._updateSymbol(sNewMedia);
 	};
 
 	/**
-	 * It puts the appropriate classes on the control and updates illustration's symbol based on the current media size.
+	 * It puts the appropriate classes on the control based on the current media size.
 	 * @param {string} sCurrentMedia
 	 * @private
 	 */
 	IllustratedMessage.prototype._updateMediaStyle = function (sCurrentMedia) {
+		if (this._sLastKnownMedia !== sCurrentMedia) {
+			this._sLastKnownMedia = sCurrentMedia;
+		} else {
+			return; // No need to iterate over the media classes if the media is the same as the one previously used
+		}
 		Object.keys(IllustratedMessage.MEDIA).forEach(function (sMedia) {
-			var bEnable = sCurrentMedia === IllustratedMessage.MEDIA[sMedia],
-				sIdMedia = sMedia.charAt(0) + sMedia.slice(1).toLowerCase();
+			var bEnable = sCurrentMedia === IllustratedMessage.MEDIA[sMedia];
 			this.toggleStyleClass(IllustratedMessage.MEDIA[sMedia], bEnable);
-			if (bEnable && sCurrentMedia !== IllustratedMessage.MEDIA.BASE) { // No need to require a resource for BASE illustrationSize, since there is none
-				this._getIllustration().setSet(this._sIllustrationSet, true)
-					.setMedia(sIdMedia, true)
-					.setType(this._sIllustrationType);
-			}
 		}, this);
 	};
 
+	/**
+	 * Updates illustration's symbol based on the current media size.
+	 * @param {string} sCurrentMedia
+	 * @private
+	 */
+	IllustratedMessage.prototype._updateSymbol = function (sCurrentMedia) {
+		var sIdMedia = sCurrentMedia.substring(sCurrentMedia.indexOf('-') + 1);
+
+		if (sCurrentMedia !== IllustratedMessage.MEDIA.BASE) { // No need to require a resource for BASE illustrationSize, since there is none
+			this._getIllustration().setSet(this._sIllustrationSet, true)
+				.setMedia(sIdMedia, true)
+				.setType(this._sIllustrationType);
+		}
+	};
+
 	/**
 	 * ATTACH/DETACH HANDLERS
 	 */

package/src/sap/m/IllustratedMessageRenderer.js

@@ -23,26 +23,30 @@ sap.ui.define([], function () {
 	 */
 	IllustratedMessageRenderer.render = function (oRm, oIllustratedMessage) {
 		var oIllustratedMessageIllustration = oIllustratedMessage._getIllustration(),
-			oIllustratedMessageTitle = oIllustratedMessage._getTitle(),
-			oIllustratedMessageDescription = oIllustratedMessage._getDescription(),
-			oIllustratedMessageAdditionalContent = oIllustratedMessage.getAdditionalContent();
+			sIllustratedMessageTitle = oIllustratedMessage._getTitle(),
+			sIllustratedMessageDescription = oIllustratedMessage._getDescription(),
+			aIllustratedMessageAdditionalContent = oIllustratedMessage.getAdditionalContent(),
+			bIllustratedMessageEnableVerticalResponsiveness = oIllustratedMessage.getEnableVerticalResponsiveness();
 
 		// IllustratedMessage's Root DOM Element.
 		oRm.openStart("figure", oIllustratedMessage);
 		oRm.class("sapMIllustratedMessage");
+		if (bIllustratedMessageEnableVerticalResponsiveness) {
+			oRm.class("sapMIllustratedMessageScalable");
+		}
 		oRm.openEnd();
 
 			oRm.renderControl(oIllustratedMessageIllustration);
 
 			oRm.openStart("figcaption").openEnd();
-				oRm.renderControl(oIllustratedMessageTitle);
-				oRm.renderControl(oIllustratedMessageDescription.addStyleClass("sapMIllustratedMessageDescription"));
+				oRm.renderControl(sIllustratedMessageTitle);
+				oRm.renderControl(sIllustratedMessageDescription.addStyleClass("sapMIllustratedMessageDescription"));
 			oRm.close("figcaption");
 
 			oRm.openStart("div");
 			oRm.class("sapMIllustratedMessageAdditionalContent"); // helper class in order to hide the additional content when on Base breakpoint
 			oRm.openEnd();
-				oIllustratedMessageAdditionalContent.forEach(function (oControl) {
+				aIllustratedMessageAdditionalContent.forEach(function (oControl) {
 					oRm.renderControl(oControl);
 				});
 			oRm.close("div");

package/src/sap/m/Illustration.js

@@ -32,7 +32,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/IllustrationPool.js

@@ -211,6 +211,7 @@ sap.ui.define([
 			if (oDOMPool === null) {
 				oDOMPool = document.createElement("div");
 				oDOMPool.id = SAP_ILLUSTRATION_POOL_ID;
+				oDOMPool.ariaHidden = true;
 
 				Core.getStaticAreaRef().appendChild(oDOMPool);
 

package/src/sap/m/IllustrationRenderer.js

@@ -4,7 +4,7 @@
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
-sap.ui.define(["sap/ui/Device"], function (Device) {
+sap.ui.define([], function () {
 	"use strict";
 
 	/**

package/src/sap/m/Image.js

@@ -57,7 +57,7 @@ sap.ui.define([
 	 * @implements sap.ui.core.IFormContent
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @public
 	 * @alias sap.m.Image
@@ -388,7 +388,7 @@ sap.ui.define([
 	/**
 	 * Sets the <code>detailBox</code> aggregation.
 	 * @param {sap.m.LightBox|undefined} oLightBox - Instance of the <code>LightBox</code> control or undefined
-	 * @returns {object} <code>this</code> for chaining
+	 * @returns {this} <code>this</code> for chaining
 	 * @override
 	 * @public
 	 */

package/src/sap/m/ImageContent.js

@@ -33,7 +33,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 * @since 1.38
 	 *
 	 * @public

package/src/sap/m/Input.js

@@ -8,6 +8,9 @@
 sap.ui.define([
 	'./InputBase',
 	'sap/ui/core/Item',
+	'sap/ui/core/Core',
+	'sap/ui/core/LabelEnablement',
+	'sap/ui/core/AccessKeysEnablement',
 	'./ColumnListItem',
 	'./GroupHeaderListItem',
 	'sap/ui/core/SeparatorItem',
@@ -40,6 +43,9 @@ sap.ui.define([
 function(
 	InputBase,
 	Item,
+	Core,
+	LabelEnablement,
+	AccessKeysEnablement,
 	ColumnListItem,
 	GroupHeaderListItem,
 	SeparatorItem,
@@ -149,8 +155,9 @@ function(
 	 * </ul>
 	 *
 	 * @extends sap.m.InputBase
+	 * @implements sap.ui.core.IAccessKeySupport
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -159,7 +166,9 @@ function(
 	 * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
 	 */
 	var Input = InputBase.extend("sap.m.Input", /** @lends sap.m.Input.prototype */ { metadata : {
-
+		interfaces : [
+			"sap.ui.core.IAccessKeySupport"
+		],
 		library : "sap.m",
 		properties : {
 
@@ -326,7 +335,23 @@ function(
 			 * Specifies whether to display separators in tabular suggestions.
 			 * @private
 			 */
-			separateSuggestions: { type: "boolean", defaultValue: false, visibility: "hidden" }
+			separateSuggestions: { type: "boolean", defaultValue: false, visibility: "hidden" },
+
+			/**
+			 * Indicates whether the access keys ref of the control should be highlighted.
+			 * NOTE: this property is used only when access keys feature is turned on.
+			 *
+			 * @private
+			 */
+			highlightAccKeysRef: { type: "boolean", defaultValue: false, visibility: "hidden" },
+
+			/**
+			 * Indicates which keyboard key should be pressed to focus the access key ref
+			 * NOTE: this property is used only when access keys feature is turned on.
+			 *
+			 * @private
+			 */
+			accesskey: { type: "string", defaultValue: "", visibility: "hidden" }
 		},
 		defaultAggregation : "suggestionItems",
 		aggregations : {
@@ -398,7 +423,7 @@ function(
 			/**
 			 * Fired when the value of the input is changed by user interaction - each keystroke, delete, paste, etc.
 			 *
-			 * <b>Note:</b> Browsing autocomplete suggestions does not fires the event.
+			 * <b>Note:</b> Browsing autocomplete suggestions does not fire the event.
 			 */
 			liveChange : {
 				parameters : {
@@ -588,6 +613,28 @@ function(
 		// indicates whether input's popover has finished opening
 		// we asume that after open its content has been rendered => we don't have the power user scenario
 		this._bAfterOpenFinisihed = false;
+
+		AccessKeysEnablement.registerControl(this);
+	};
+
+	var setRefLabelsHighlightAccKeysRef = function (bHighlightAccKeysRef) {
+		var aRefLabels = LabelEnablement.getReferencingLabels(this);
+
+		aRefLabels.forEach(function(sLabelId) {
+			Core.byId(sLabelId).setProperty("highlightAccKeysRef", bHighlightAccKeysRef);
+		}, this);
+	};
+
+	Input.prototype.getAccessKeysFocusTarget = function () {
+		return this.getFocusDomRef();
+	};
+
+	Input.prototype.onAccKeysHighlightStart = function () {
+		setRefLabelsHighlightAccKeysRef.call(this, true);
+	};
+
+	Input.prototype.onAccKeysHighlightEnd = function () {
+		setRefLabelsHighlightAccKeysRef.call(this, false);
 	};
 
 	/**
@@ -1327,9 +1374,6 @@ function(
 	 * @returns {this} this Input instance for chaining.
 	 */
 	Input.prototype._doSelect = function(iStart, iEnd) {
-		if (Device.support.touch) {
-			return this;
-		}
 		var oDomRef = this._$input[0];
 		if (oDomRef) {
 			// if no Dom-Ref - no selection (Maybe popup closed)

package/src/sap/m/InputBase.js

@@ -64,7 +64,7 @@ function(
 	 * @implements sap.ui.core.IFormContent
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/InputBaseRenderer.js

@@ -4,8 +4,8 @@
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
-sap.ui.define(['sap/ui/core/Renderer', 'sap/ui/core/Core', 'sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/core/LabelEnablement', 'sap/ui/Device'],
-	function(Renderer, Core, coreLibrary, ValueStateSupport, LabelEnablement, Device) {
+sap.ui.define(['sap/ui/core/Renderer', 'sap/ui/core/Core', 'sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/Device'],
+	function(Renderer, Core, coreLibrary, ValueStateSupport, Device) {
 	"use strict";
 
 	// shortcut for sap.ui.core.TextDirection

package/src/sap/m/InputListItem.js

@@ -30,7 +30,7 @@ sap.ui.define([
 	 * @extends sap.m.ListItemBase
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/InputRenderer.js

@@ -72,6 +72,10 @@ sap.ui.define(['sap/ui/core/InvisibleText', 'sap/ui/core/Renderer', './InputBase
 		}
 	};
 
+	InputRenderer.writeOuterAttributes = function (oRm, oControl) {
+		oRm.attr("data-ui5-accesskey", oControl.getProperty("accesskey"));
+	};
+
 	/**
 	 * Adds inner css classes to the input field
 	 *

package/src/sap/m/Label.js

@@ -7,6 +7,7 @@
 // Provides control sap.m.Label
 sap.ui.define([
 	'./library',
+	"sap/ui/core/Core",
 	'sap/ui/core/Control',
 	'sap/ui/core/LabelEnablement',
 	'sap/m/HyphenationSupport',
@@ -15,6 +16,7 @@ sap.ui.define([
 ],
 function(
 	library,
+	Core,
 	Control,
 	LabelEnablement,
 	HyphenationSupport,
@@ -73,10 +75,10 @@ function(
 	 * <li> It is not recommended to use labels in Bold.</li>
 	 * </ul>
 	 * @extends sap.ui.core.Control
-	 * @implements sap.ui.core.Label, sap.ui.core.IShrinkable
+	 * @implements sap.ui.core.Label, sap.ui.core.IShrinkable, sap.ui.core.IAccessKeySupport
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public
@@ -90,7 +92,8 @@ function(
 			"sap.ui.core.Label",
 			"sap.ui.core.IShrinkable",
 			"sap.m.IOverflowToolbarContent",
-			"sap.m.IHyphenation"
+			"sap.m.IHyphenation",
+			"sap.ui.core.IAccessKeySupport"
 		],
 		library : "sap.m",
 		properties : {
@@ -168,7 +171,15 @@ function(
 			 * regardless of the value of the <code>showColon</code> property.
 			 * @since 1.98
 			 */
-			showColon : {type : "boolean", group : "Appearance", defaultValue : false}
+			showColon : {type : "boolean", group : "Appearance", defaultValue : false},
+
+			/**
+			 * Indicates whether the access keys ref of the control should be highlighted.
+			 * NOTE: this property is used only when access keys feature is turned on.
+			 *
+			 * @private
+			 */
+			highlightAccKeysRef: { type: "boolean", defaultValue: false, visibility: "hidden" }
 		},
 		associations : {
 
@@ -201,6 +212,25 @@ function(
 		};
 	};
 
+	Label.prototype.onBeforeRendering = function () {
+		this._handleAccessKeysHighlighting();
+	};
+
+	Label.prototype._handleAccessKeysHighlighting = function () {
+		var sLabelForId = this.getLabelFor();
+		var sText = this.getText();
+
+		if (!sLabelForId || !sText) {
+			return;
+		}
+
+		var oLabeledControl = Core.byId(sLabelForId);
+
+		if (oLabeledControl && oLabeledControl.isA("sap.m.Input") && oLabeledControl.getProperty("highlightAccKeysRef")) {
+			Core.byId(sLabelForId).setProperty("accesskey", (sText[0].toLowerCase()), true);
+		}
+	};
+
 	/**
 	 * Enables the <code>sap.m.Label</code> to move inside the sap.m.OverflowToolbar.
 	 * Required by the {@link sap.m.IOverflowToolbarContent} interface.

package/src/sap/m/LabelRenderer.js

@@ -5,8 +5,8 @@
  */
 
 // Provides the default renderer for control sap.m.Label
-sap.ui.define(['sap/ui/core/Core', 'sap/ui/core/Renderer', 'sap/m/library', 'sap/ui/core/library', 'sap/m/HyphenationSupport', "sap/ui/core/LabelEnablement"],
-	function(Core, Renderer, library, coreLibrary, HyphenationSupport, LabelEnablement) {
+sap.ui.define(['sap/ui/core/Core', 'sap/ui/core/Renderer', 'sap/ui/core/AccessKeysEnablement', 'sap/m/library', 'sap/ui/core/library', 'sap/m/HyphenationSupport', "sap/ui/core/LabelEnablement"],
+	function(Core, Renderer, AccessKeysEnablement, library, coreLibrary, HyphenationSupport, LabelEnablement) {
 	"use strict";
 
 	// shortcut for sap.ui.core.TextDirection
@@ -123,6 +123,11 @@ sap.ui.define(['sap/ui/core/Core', 'sap/ui/core/Renderer', 'sap/m/library', 'sap
 		// wrap the label text
 		rm.openStart("span", oLabel.getId() + "-text");
 		rm.class("sapMLabelTextWrapper");
+
+		if (oLabel.getProperty("highlightAccKeysRef")) {
+			rm.class(AccessKeysEnablement.CSS_CLASS);
+		}
+
 		rm.openEnd();
 
 		// write the label text

package/src/sap/m/LightBox.js

@@ -99,7 +99,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/LightBoxItem.js

@@ -43,7 +43,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Element
 	 *
 	 * @author SAP SE
-	 * @version 1.103.0
+	 * @version 1.105.0
 	 *
 	 * @constructor
 	 * @public