@openui5/sap.m 1.103.1 → 1.106.0

package/src/sap/m/InputBase.js

@@ -64,7 +64,7 @@ function(
 	 * @implements sap.ui.core.IFormContent
 	 *
 	 * @author SAP SE
-	 * @version 1.103.1
+	 * @version 1.106.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.1
+	 * @version 1.106.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/InstanceManager.js

@@ -66,7 +66,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	 *
 	 * @param {string} sCategoryId The category's id.
 	 * @param {object} oInstance The instance that will be removed from the given category.
-	 * @returns {object|null} The removed instance or <code>null</code>. If the instance isn't managed, this method returns <code>null</code> instead of the instance object.
+	 * @returns {object|null} The removed instance, or <code>null</code> if the instance isn't managed.
 	 * @protected
 	 */
 	InstanceManager.removeInstance = function(sCategoryId, oInstance) {
@@ -169,7 +169,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	/**
 	 * Adds a control to predefined lightbox category in instance manager.
 	 *
-	 * @param {sap.m.LightBox} oLightBox Dialog to be added to instance manager. Dialog which doesn't inherit from sap.m.Dialog can also be added as long as it has a close method.
+	 * @param {sap.m.LightBox} oLightBox LightBox to be added to instance manager.
 	 * @returns {this} Enable method chaining.
 	 * @protected
 	 */
@@ -186,7 +186,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	 * Removes control from predefined popover category in instance manager.
 	 *
 	 * @param {sap.ui.core.Control} oPopover to be removed from instance manager.
-	 * @returns {sap.ui.core.Control|null} The removed popover or <code>null</code>. If the popover isn't managed, this method returns <code>null</code> instead of the removed popover.
+	 * @returns {sap.ui.core.Control|null} The removed popover, or <code>null</code> if the popover isn't managed.
 	 * @protected
 	 */
 	InstanceManager.removePopoverInstance = function(oPopover){
@@ -197,7 +197,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	 * Removes control from predefined dialog category in instance manager.
 	 *
 	 * @param {sap.ui.core.Control} oDialog to be removed from instance manager.
-	 * @returns {sap.ui.core.Control} The removed popover or <code>null</code>. If the popover isn't managed, this method returns <code>null</code> instead of the removed popover.
+	 * @returns {sap.ui.core.Control|null} The removed dialog, or <code>null</code> if the dialog isn't managed.
 	 * @protected
 	 */
 	InstanceManager.removeDialogInstance = function(oDialog){
@@ -208,7 +208,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	 * Removes control from predefined lightbox category in instance manager.
 	 *
 	 * @param {sap.m.LightBox} oLightBox to be removed from instance manager.
-	 * @returns {sap.m.LightBox|null} The removed popover or <code>null</code>. If the LightBox isn't managed, this method returns <code>null</code> instead of the removed LightBox.
+	 * @returns {sap.m.LightBox|null} The removed LightBox, or <code>null</code> if the LightBox isn't managed.
 	 * @protected
 	 */
 	InstanceManager.removeLightBoxInstance = function(oLightBox){
@@ -314,7 +314,7 @@ sap.ui.define(["sap/base/assert", "sap/base/Log", "sap/ui/thirdparty/jquery"],
 	};
 
 	/**
-	 * Gets all of the open LightBoxes. If there's no dialog open, an empty array is returned.
+	 * Gets all of the open LightBoxes. If there's no LightBox open, an empty array is returned.
 	 *
 	 * @returns {sap.m.LightBox[]} The opened LightBoxes.
 	 * @public

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.1
+	 * @version 1.106.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

@@ -95,11 +95,11 @@ sap.ui.define([
 	 *
 	 * <h3>Additional Information</h3>
 	 *
-	 * Check out the <a href="/#docs/api/symbols/sap.m.LightBox.html" >API Reference</a>.
+	 * Check out the {@link sap.m.LightBoxItem API Reference}.
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.103.1
+	 * @version 1.106.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.1
+	 * @version 1.106.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/Link.js

@@ -7,28 +7,30 @@
 // Provides control sap.m.Link.
 sap.ui.define([
 	"./library",
+	"sap/ui/core/Core",
 	"sap/ui/core/Control",
 	"sap/ui/core/InvisibleText",
 	"sap/ui/core/EnabledPropagator",
+	"sap/ui/core/AccessKeysEnablement",
 	"sap/ui/core/LabelEnablement",
 	"sap/ui/core/library",
 	"sap/ui/Device",
 	"./LinkRenderer",
 	"sap/ui/events/KeyCodes",
-	"sap/base/Log",
 	"sap/base/security/URLListValidator"
 ],
 function(
 	library,
+	Core,
 	Control,
 	InvisibleText,
 	EnabledPropagator,
+	AccessKeysEnablement,
 	LabelEnablement,
 	coreLibrary,
 	Device,
 	LinkRenderer,
 	KeyCodes,
-	Log,
 	URLListValidator
 ) {
 	"use strict";
@@ -42,6 +44,9 @@ function(
 	// shortcut for sap.ui.core.aria.HasPopup
 	var AriaHasPopup = coreLibrary.aria.HasPopup;
 
+	// shortcut for sap.m.LinkAccessibleRole
+	var LinkAccessibleRole = library.LinkAccessibleRole;
+
 	// shortcut for sap.m.EmptyIndicator
 	var EmptyIndicatorMode = library.EmptyIndicatorMode;
 
@@ -78,10 +83,10 @@ function(
 	 * @see {@link fiori:https://experience.sap.com/fiori-design-web/link/ Link}
 	 *
 	 * @extends sap.ui.core.Control
-	 * @implements sap.ui.core.IShrinkable, sap.ui.core.IFormContent, sap.ui.core.ITitleContent
+	 * @implements sap.ui.core.IShrinkable, sap.ui.core.IFormContent, sap.ui.core.ITitleContent, sap.ui.core.IAccessKeySupport
 	 *
 	 * @author SAP SE
-	 * @version 1.103.1
+	 * @version 1.106.0
 	 *
 	 * @constructor
 	 * @public
@@ -94,7 +99,8 @@ function(
 		interfaces : [
 			"sap.ui.core.IShrinkable",
 			"sap.ui.core.IFormContent",
-			"sap.ui.core.ITitleContent"
+			"sap.ui.core.ITitleContent",
+			"sap.ui.core.IAccessKeySupport"
 		],
 		library : "sap.m",
 		designtime: "sap/m/designtime/Link.designtime",
@@ -135,8 +141,9 @@ function(
 			width : {type : "sap.ui.core.CSSSize", group : "Dimension", defaultValue : null},
 
 			/**
-			 * Defines the link target URI. Supports standard hyperlink behavior. If a JavaScript action should be triggered,
-			 * this should not be set, but instead an event handler for the <code>press</code> event should be registered.
+			 * Defines the link target URI. Supports standard hyperlink behavior.
+			 * <b>Note:</b> Don't set <code>href</code> property if an action should be triggered by the link. Instead set <code>accessibleRole</code>
+			 * property to <code>LinkAccessibleRole.Button</code> and register a <code>press</code> event handler.
 			 */
 			href : {type : "sap.ui.core.URI", group : "Data", defaultValue : null},
 
@@ -194,12 +201,38 @@ function(
 			 */
 			ariaHasPopup : {type : "sap.ui.core.aria.HasPopup", group : "Accessibility", defaultValue : AriaHasPopup.None},
 
+			/**
+			 * Describes the accessibility role of the link:<ul>
+			 * <li><code>LinkAccessibleRole.Default</code> - a navagation is expected to the location given in <code>href</code> property</li>
+			 * <li><code>LinkAccessibleRole.Button</code> - there will be <code>role</code> attribute with value "Button" rendered. In this scenario the <code>href</code>
+			 * property value shouldn't be set as navigation isn't expected to occur.</li></ul>
+			 *
+			 * @since 1.104.0
+			 */
+			accessibleRole : {type : "sap.m.LinkAccessibleRole", group : "Accessibility", defaultValue : LinkAccessibleRole.Default},
+
 			/**
 			 * Specifies if an empty indicator should be displayed when there is no text.
 			 *
 			 * @since 1.89
 			 */
-			emptyIndicatorMode: { type: "sap.m.EmptyIndicatorMode", group: "Appearance", defaultValue: EmptyIndicatorMode.Off }
+			emptyIndicatorMode: { type: "sap.m.EmptyIndicatorMode", group: "Appearance", defaultValue: EmptyIndicatorMode.Off },
+
+			/**
+			 * 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" }
 		},
 		associations : {
 
@@ -245,6 +278,10 @@ function(
 
 	EnabledPropagator.call(Link.prototype); // inherit "disabled" state from parent controls
 
+	Link.prototype.init = function () {
+		AccessKeysEnablement.registerControl(this);
+	};
+
 	/**
 	 * Required adaptations before rendering.
 	 *
@@ -252,6 +289,18 @@ function(
 	 */
 	Link.prototype.onBeforeRendering = function() {};
 
+	Link.prototype.getAccessKeysFocusTarget = function () {
+		return this.getFocusDomRef();
+	};
+
+	Link.prototype.onAccKeysHighlightStart = function () {
+		setRefLabelsHighlightAccKeysRef.call(this, true);
+	};
+
+	Link.prototype.onAccKeysHighlightEnd = function () {
+		setRefLabelsHighlightAccKeysRef.call(this, false);
+	};
+
 	/**
 	 * Handle the key down event for SPACE
 	 * SHIFT or ESCAPE on pressed SPACE cancels the action
@@ -405,7 +454,8 @@ function(
 			sEmphasizedInfo = this.getEmphasized() ? oResourceBundle.getText("LINK_EMPHASIZED") : "",
 			sSubtleInfo = this.getSubtle() ? oResourceBundle.getText("LINK_SUBTLE") : "",
 			sText = this.getText(),
-			sDescription = sText;
+			sDescription = sText,
+			sAccessibleRole = this.getAccessibleRole();
 
 		if (sText) {
 			sEmphasizedInfo && (sDescription += " " + sEmphasizedInfo);
@@ -413,7 +463,7 @@ function(
 		}
 
 		return {
-			role: "link",
+			role: sAccessibleRole === LinkAccessibleRole.Default ? "link" : sAccessibleRole,
 			type: sText ? oResourceBundle.getText("ACC_CTR_TYPE_LINK") : undefined,
 			description: sDescription,
 			focusable: this.getEnabled(),
@@ -454,6 +504,20 @@ function(
 		return !bAlreadyHasSelfReference && (aAriaLabelledBy.length > 0 || bHasReferencingLabels || bAllowEnhancingByParent);
 	};
 
+	var setRefLabelsHighlightAccKeysRef = function (bHighlightAccKeysRef) {
+		var aLabels = this.getAriaLabelledBy();
+
+		if (aLabels.length) {
+			var oLabel = Core.byId(aLabels[0]);
+
+			oLabel.setProperty("highlightAccKeysRef", bHighlightAccKeysRef);
+
+			if (oLabel.getText && oLabel.getText()) {
+				this.setProperty("accesskey", oLabel.getText()[0].toLowerCase());
+			}
+		}
+	};
+
 	return Link;
 
 });

package/src/sap/m/LinkRenderer.js

@@ -7,11 +7,12 @@
  sap.ui.define([
 	 "sap/ui/core/Renderer",
 	 "sap/ui/core/library",
+	 'sap/ui/core/AccessKeysEnablement',
 	 "sap/ui/util/defaultLinkTypes",
 	 './library',
 	 'sap/ui/core/Core'
 	],
-	function(Renderer, coreLibrary, defaultLinkTypes, mobileLibrary, Core) {
+	function(Renderer, coreLibrary, AccessKeysEnablement, defaultLinkTypes, mobileLibrary, Core) {
 	"use strict";
 
 	// shortcut for sap.ui.core.TextDirection
@@ -20,6 +21,9 @@
 	// shortcut for sap.ui.core.aria.HasPopup
 	var AriaHasPopup = coreLibrary.aria.HasPopup;
 
+	// shortcut for sap.m.LinkAccessibleRole
+	var LinkAccessibleRole = mobileLibrary.LinkAccessibleRole;
+
 	/**
 	 * Link renderer
 	 * @namespace
@@ -46,15 +50,16 @@
 			sTextAlign = Renderer.getTextAlign(oControl.getTextAlign(), sTextDir),
 			bShouldHaveOwnLabelledBy = oControl._determineSelfReferencePresence(),
 			sHasPopupType = oControl.getAriaHasPopup(),
-			sHref = oControl.getHref(),
 			sRel = defaultLinkTypes(oControl.getRel(), oControl.getTarget()),
+			sHref = oControl.getHref(),
+			sAccessibleRole = oControl.getAccessibleRole(),
 			oAccAttributes =  {
 				labelledby: bShouldHaveOwnLabelledBy ? {value: oControl.getId(), append: true } : undefined,
 				haspopup: (sHasPopupType === AriaHasPopup.None) ? null : sHasPopupType.toLowerCase()
 			},
-			bIsValid = sHref && oControl._isHrefValid(sHref),
 			bEnabled = oControl.getEnabled(),
-			sTypeSemanticInfo = "";
+			sTypeSemanticInfo = "",
+			sAcccessKey = oControl.getProperty("accesskey");
 
 		// Link is rendered as a "<a>" element
 		oRm.openStart("a", oControl);
@@ -70,6 +75,23 @@
 			sTypeSemanticInfo += " " + oControl._sAriaLinkEmphasizedId;
 		}
 
+		if (sAcccessKey) {
+			oRm.attr("data-ui5-accesskey", sAcccessKey);
+		}
+
+		switch (sAccessibleRole) {
+			case LinkAccessibleRole.Button:
+				oAccAttributes.role = LinkAccessibleRole.Button;
+				break;
+			default:
+				// Set a valid non empty value for the href attribute representing that there is no navigation,
+				// so we don't confuse the screen readers.
+				/*eslint-disable no-script-url */
+				sHref = sHref && oControl._isHrefValid(sHref) && oControl.getEnabled() ? sHref : "javascript:void(0)";
+		}
+
+		sHref && oRm.attr("href", sHref);
+
 		oAccAttributes.describedby = sTypeSemanticInfo ? {value: sTypeSemanticInfo.trim(), append: true} : undefined;
 
 		if (!bEnabled) {
@@ -86,14 +108,6 @@
 			oRm.attr("title", oControl.getTooltip_AsString());
 		}
 
-		/* set href only if link is enabled - BCP incident 1570020625 */
-		if (bIsValid && bEnabled) {
-			oRm.attr("href", sHref);
-		} else if (oControl.getText()) {
-			// Add href only if there's text. Otherwise virtual cursor would stop on the empty link. BCP 2070055617
-			oRm.attr("href", "");
-		}
-
 		if (oControl.getTarget()) {
 			oRm.attr("target", oControl.getTarget());
 		}

package/src/sap/m/List.js

@@ -30,7 +30,7 @@ sap.ui.define(["./library", "./ListBase", "./ListRenderer"],
 	 * @extends sap.m.ListBase
 	 *
 	 * @author SAP SE
-	 * @version 1.103.1
+	 * @version 1.106.0
 	 *
 	 * @constructor
 	 * @public
@@ -51,6 +51,43 @@ sap.ui.define(["./library", "./ListBase", "./ListRenderer"],
 		}
 	}});
 
+	List.prototype.getAriaRole = function() {
+		return this._sAriaRole || "list";
+	};
+
+	/**
+	 * Applies the aria <code>role</code> attribute to the control.
+	 *
+	 * Supported values are:
+	 * <ul>
+	 * <li><code>list</code>: This is the default since version 1.105. The rendered items will have the <code>role="listitem"</code>.</li>
+	 * <li><code>listbox</code>: Legacy support. The rendererd items will have the <code>role="option"</code>.</li>
+	 * </ul>
+	 * <b>Note:</b> This method must be called before the control renders.
+	 * @param {string} sRole role attribute for the control
+	 * @protected
+	 * @ui5-restricted
+	 * @since 1.105
+	 */
+	List.prototype.applyAriaRole = function(sRole) {
+		this._sAriaRole = sRole;
+	};
+
+	List.prototype.enhanceAccessibilityState = function(oElement, mAriaProps) {
+		ListBase.prototype.enhanceAccessibilityState.apply(this, arguments);
+
+		// update listitem Accessibility state according to the list's role attribute
+		if (this.getAriaRole() === "listbox" && oElement.isA("sap.m.ListItemBase")) {
+			mAriaProps.roledescription = null;
+			mAriaProps.role = "option";
+			mAriaProps.owns = null;
+
+			if (oElement.isSelectable()) {
+				mAriaProps.selected = oElement.getSelected();
+			}
+		}
+	};
+
 	return List;
 
 });