@openui5/sap.m 1.120.6 → 1.121.0

package/src/sap/m/Carousel.js

@@ -7,11 +7,12 @@
 // Provides control sap.m.Carousel.
 sap.ui.define([
 	"./library",
-	"sap/ui/core/Core",
+	"sap/base/i18n/Localization",
 	"sap/ui/core/Control",
 	"sap/ui/core/Element",
-	"sap/ui/core/Configuration",
+	"sap/ui/core/Theming",
 	"sap/ui/Device",
+	"sap/ui/core/Lib",
 	"sap/ui/core/ResizeHandler",
 	"sap/ui/core/library",
 	"sap/m/IllustratedMessage",
@@ -24,14 +25,16 @@ sap.ui.define([
 	"sap/ui/thirdparty/jquery",
 	"sap/ui/core/IconPool",
 	"./CarouselLayout",
-	"sap/ui/dom/jquery/Selectors" // provides jQuery custom selector ":sapTabbable"
-], function (
+	// provides jQuery custom selector ":sapTabbable"
+	"sap/ui/dom/jquery/Selectors"
+], function(
 	library,
-	Core,
+	Localization,
 	Control,
 	Element,
-	Configuration,
+	Theming,
 	Device,
+	Library,
 	ResizeHandler,
 	coreLibrary,
 	IllustratedMessage,
@@ -61,9 +64,12 @@ sap.ui.define([
 	//shortcut for sap.m.BorderDesign
 	var BorderDesign = library.BorderDesign;
 
+	//shortcut for sap.m.CarouselScrollMode
+	var CarouselScrollMode = library.CarouselScrollMode;
+
 	var iDragRadius = 10;
 	var iMoveRadius = 20;
-	var bRtl = Core.getConfiguration().getRTL();
+	var bRtl = Localization.getRTL();
 
 	function getCursorPosition(e) {
 		e = e.originalEvent || e;
@@ -126,7 +132,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @constructor
 	 * @public
@@ -328,10 +334,11 @@ sap.ui.define([
 		this._aAllActivePages = [];
 		this._aAllActivePagesIndexes = [];
 		this._bShouldFireEvent = true;
+		this._handleThemeAppliedBound = this._handleThemeApplied.bind(this);
 
 		this.data("sap-ui-fastnavgroup", "true", true); // Define group for F6 handling
 
-		this._oRb = Core.getLibraryResourceBundle("sap.m");
+		this._oRb = Library.getResourceBundleFor("sap.m");
 	};
 
 	/**
@@ -358,9 +365,9 @@ sap.ui.define([
 		this._aAllActivePages = null;
 		this._aAllActivePagesIndexes = null;
 
-		if (this._bThemeChangedAttached) {
-			Core.detachThemeChanged(this._handleThemeChanged, this);
-			this._bThemeChangedAttached = false;
+		if (this._bThemeAppliedAttached) {
+			Theming.detachApplied(this._handleThemeAppliedBound);
+			this._bThemeAppliedAttached = false;
 		}
 	};
 
@@ -452,11 +459,9 @@ sap.ui.define([
 			this.setAssociation("activePage", this.getPages()[iActivePageIndex].getId(), true);
 		}
 
-		if (Core.isThemeApplied()) {
-			this._initialize();
-		} else if (!this._bThemeChangedAttached) {
-			this._bThemeChangedAttached = true;
-			Core.attachThemeChanged(this._handleThemeChanged, this);
+		if (!this._bThemeAppliedAttached) {
+			this._bThemeAppliedAttached = true;
+			Theming.attachApplied(this._handleThemeAppliedBound);
 		}
 
 		this._sResizeListenerId = ResizeHandler.register($innerDiv, this._resize.bind(this));
@@ -471,10 +476,10 @@ sap.ui.define([
 	 *
 	 * @private
 	 */
-	Carousel.prototype._handleThemeChanged = function () {
+	Carousel.prototype._handleThemeApplied = function () {
 		this._initialize();
-		Core.detachThemeChanged(this._handleThemeChanged, this);
-		this._bThemeChangedAttached = false;
+		Theming.detachApplied(this._handleThemeAppliedBound);
+		this._bThemeAppliedAttached = false;
 	};
 
 	/**
@@ -517,9 +522,9 @@ sap.ui.define([
 				iNewActivePageIndex = iOldActivePageIndex;
 			} else {
 				if (bForward) {
-					iNewActivePageIndex = iOldActivePageIndex + 1;
+					iNewActivePageIndex = this._iCurrSlideIndex;
 				} else {
-					iNewActivePageIndex = iOldActivePageIndex - 1;
+					iNewActivePageIndex = this._iCurrSlideIndex + this._getNumberOfItemsToShow() - 1;
 				}
 
 				// loop happened
@@ -814,6 +819,27 @@ sap.ui.define([
 		return this.getAggregation("_emptyPage");
 	};
 
+	/**
+	 * Returns the index of the slide that should be shown
+	 * @private
+	 * @param {int} iCurrentSlideIndex Current slide index
+	 * @param {int} iDefaultIndexStep Index that shows if previous or next arrow is pressed
+	 * @returns {int} Index of the slide
+	 */
+	Carousel.prototype._calculateSlideIndex = function (iCurrentSlideIndex, iDefaultIndexStep) {
+		const oCarouselLayout = this.getCustomLayout();
+		let iSlideIndex;
+
+		if (oCarouselLayout && oCarouselLayout.getScrollMode() === CarouselScrollMode.VisiblePages) {
+			const iNumberOfItemsOnPage =  this._getNumberOfItemsToShow();
+			iSlideIndex = iDefaultIndexStep > 0 ? iCurrentSlideIndex + iNumberOfItemsOnPage : Math.max(0, iCurrentSlideIndex - iNumberOfItemsOnPage);
+		} else {
+			iSlideIndex = iDefaultIndexStep > 0 ? iCurrentSlideIndex + 1 : iCurrentSlideIndex - 1;
+		}
+
+		return iSlideIndex;
+	};
+
 	/**
 	 * Call this method to display the previous page (corresponds to a swipe left).
 	 *
@@ -821,7 +847,8 @@ sap.ui.define([
 	 * @public
 	 */
 	Carousel.prototype.previous = function () {
-		this._moveToPage(this._iCurrSlideIndex - 1);
+		const iSlideIndex = this._calculateSlideIndex(this._iCurrSlideIndex, -1);
+		this._moveToPage(iSlideIndex);
 		return this;
 	};
 
@@ -832,7 +859,8 @@ sap.ui.define([
 	 * @public
 	 */
 	Carousel.prototype.next = function () {
-		this._moveToPage(this._iCurrSlideIndex + 1);
+		const iSlideIndex = this._calculateSlideIndex(this._iCurrSlideIndex, 1);
+		this._moveToPage(iSlideIndex);
 		return this;
 	};
 
@@ -1451,7 +1479,7 @@ sap.ui.define([
 	 * @returns {sap.ui.core.Control} The page
 	 */
 	Carousel.prototype._getClosestPage = function (oElement) {
-		return Element.closestTo(jQuery(oElement).closest(".sapMCrsPage")[0]);
+		return Element.closestTo(oElement.closest(".sapMCrsPage"));
 	};
 
 	//================================================================================

package/src/sap/m/CarouselLayout.js

@@ -4,9 +4,11 @@
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
-sap.ui.define(["sap/ui/base/ManagedObject"], function (ManagedObject) {
+sap.ui.define(["sap/ui/base/ManagedObject", "./library"], function (ManagedObject, library) {
 	"use strict";
 
+	//shortcut for sap.m.CarouselScrollMode
+	var CarouselScrollMode = library.CarouselScrollMode;
 	/**
 	 * @param {string} [sId] ID for the new control, generated automatically if no ID is given
 	 * @param {object} [mSettings] Initial settings for the new control
@@ -15,7 +17,7 @@ sap.ui.define(["sap/ui/base/ManagedObject"], function (ManagedObject) {
 	 * Applies a <code>sap.m.CarouselLayout</code> to a provided DOM element or Control.
 	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @extends sap.ui.base.ManagedObject
 	 *
@@ -35,7 +37,16 @@ sap.ui.define(["sap/ui/base/ManagedObject"], function (ManagedObject) {
 				 * <b>Note:</b> When this property is set to something different than the default value,
 				 * the <code>loop</code> property of <code>Carousel</code> is ignored.
 				 */
-				visiblePagesCount: {type: "int", group: "Misc", defaultValue: 1}
+				visiblePagesCount: {type: "int", group: "Misc", defaultValue: 1},
+
+				/**
+				 * Defines how the items will be scrolled through in <code>Carousel</code> control.
+				 * One at a time or depending on the <code>visiblePagesCount</code>
+				 *
+				 * NOTE: <code>visiblePagesCount</code> must be set a value larger than 1, to be able to use <code>scrollMode</code> with value "VisiblePages"
+				 * @since 1.121
+				 */
+				scrollMode: {type : "sap.m.CarouselScrollMode", group : "Appearance", defaultValue : CarouselScrollMode.SinglePage}
 			}
 		}
 	});

package/src/sap/m/CarouselRenderer.js

@@ -7,9 +7,9 @@
 sap.ui.define([
 	"sap/m/library",
 	"sap/base/strings/capitalize",
-	"sap/ui/core/Core",
-	"sap/ui/Device"
-], function (library, capitalize, Core, Device) {
+	"sap/ui/Device",
+	"sap/ui/core/Lib"
+], function (library, capitalize, Device, Library) {
 	"use strict";
 
 	// shortcut for sap.m.CarouselArrowsPlacement
@@ -18,7 +18,7 @@ sap.ui.define([
 	// shortcut for sap.m.PlacementType
 	var PlacementType = library.PlacementType;
 
-	var oResourceBundle = Core.getLibraryResourceBundle("sap.m");
+	var oResourceBundle = Library.getResourceBundleFor("sap.m");
 
 	/**
 	 * Carousel renderer.

package/src/sap/m/CheckBox.js

@@ -89,8 +89,13 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 * @implements sap.ui.core.IFormContent, sap.ui.core.ISemanticFormContent, sap.ui.core.IAccessKeySupport
 	 *
+	 * @borrows sap.ui.core.ISemanticFormContent.getFormFormattedValue as #getFormFormattedValue
+	 * @borrows sap.ui.core.ISemanticFormContent.getFormValueProperty as #getFormValueProperty
+	 * @borrows sap.ui.core.ISemanticFormContent.getFormObservingProperties as #getFormObservingProperties
+	 * @borrows sap.ui.core.ISemanticFormContent.getFormRenderAsControl as #getFormRenderAsControl
+	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @constructor
 	 * @public
@@ -143,6 +148,20 @@ sap.ui.define([
 				 */
 				enabled : {type : "boolean", group : "Behavior", defaultValue : true},
 
+				/**
+				 * Sets the <code>required</code> state of the <code>CheckBox</code>.
+				 *
+				 * <b>Note:</b> Use this property only when a single relationship between this field and a Label cannot be established.
+				 * For example, with the assistance of the <code>labelFor</code> property of <code>sap.m.Label</code>.
+				 *
+				 * <b>Note:</b> This property won't work as expected without setting a value to the <code>text</code> property of the <code>CheckBox</code>.
+ 				 * The <code>text</code> property acts as a label for the <code>CheckBox</code> and is crucial for assistive technologies,
+ 				 * like screen readers, to provide a meaningful context.
+				 *
+				 * @since 1.121
+				 */
+				required: {type: "boolean", group: "Misc", defaultValue: false},
+
 				/**
 				 * The 'name' property to be used in the HTML code, for example for HTML forms that send data to the server via submit.
 				 */
@@ -383,6 +402,14 @@ sap.ui.define([
 		return "selected";
 	};
 
+	CheckBox.prototype.getFormObservingProperties = function() {
+		return ["selected", "displayOnly"]; // as displayOnly changes the rendering mode
+	};
+
+	CheckBox.prototype.getFormRenderAsControl = function () {
+		return this.getDisplayOnly(); // for displayOnly CheckBox, show the control
+	};
+
 	/**
 	 * Event handler called when the CheckBox is touched.
 	 *
@@ -478,7 +505,7 @@ sap.ui.define([
 	/**
 	 * Lazy loads the CheckBox`s label
 	 *
-	 * @return {sap.m.Label}
+	 * @return {sap.m.Label} The label control
 	 * @private
 	 */
 	CheckBox.prototype._getLabel = function() {
@@ -558,7 +585,7 @@ sap.ui.define([
 
 		if (aLabelIds.length > 0) {
 			aLabelIds.forEach(function (sLabelId) {
-				Element.registry.get(sLabelId).addEventDelegate({
+				Element.getElementById(sLabelId).addEventDelegate({
 					ontap: function () {
 						that._fnLabelTapHandler();
 					}
@@ -582,7 +609,8 @@ sap.ui.define([
 			description: (sText ? sText + " " : "") + this.getFormattedState(),
 			focusable: this.getEnabled() && !this.getDisplayOnly(),
 			enabled: this.getEnabled(),
-			editable: this.getEditable()
+			editable: this.getEditable(),
+			required: this._isRequired()
 		};
 	};
 
@@ -599,13 +627,26 @@ sap.ui.define([
 		return true;
 	};
 
-	/*
+	/**
 	 * Checkbox without label must not be stretched in Form.
+	 * @returns {boolean} If the width of the control should not be adjusted
 	 */
 	CheckBox.prototype.getFormDoNotAdjustWidth = function() {
 		return this.getText() ? false : true;
 	};
 
+	/**
+	 * Determines if the CheckBox is required.
+	 * A CheckBox is considered required if it has been explicitly set as required,
+	 * or if it is required by LabelEnablement.
+	 *
+	 * @returns {boolean} True if the CheckBox is required, false otherwise.
+	 * @private
+	 */
+	CheckBox.prototype._isRequired = function () {
+		return this.getRequired() || LabelEnablement.isRequired(this);
+	};
+
 	return CheckBox;
 
 });

package/src/sap/m/CheckBoxRenderer.js

@@ -4,8 +4,8 @@
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
-sap.ui.define(['sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/Device', "sap/ui/core/Configuration"],
-	function(coreLibrary, ValueStateSupport, Device, Configuration) {
+sap.ui.define(["sap/ui/core/ControlBehavior", 'sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/Device'],
+	function(ControlBehavior, coreLibrary, ValueStateSupport, Device) {
 	"use strict";
 
 
@@ -34,6 +34,7 @@ sap.ui.define(['sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/D
 			bEnabled = oCheckBox.getEnabled(),
 			bDisplayOnly = oCheckBox.getDisplayOnly(),
 			bEditable = oCheckBox.getEditable(),
+			bRequired = oCheckBox.getRequired(),
 			bInteractive = bEnabled && !bDisplayOnly,
 			bDisplayOnlyApplied = bEnabled && bDisplayOnly,
 			oCbLabel = oCheckBox.getAggregation("_label"),
@@ -100,6 +101,7 @@ sap.ui.define(['sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/D
 		oRm.accessibilityState(oCheckBox, {
 			role: "checkbox",
 			selected: null,
+			required: oCheckBox._isRequired() || undefined,
 			checked: oCheckBox._getAriaChecked(),
 			describedby: sTooltip && bEditableAndEnabled ? sId + "-Descr" : undefined,
 			labelledby: { value: oCbLabel ? oCbLabel.getId() : undefined, append: true }
@@ -158,9 +160,14 @@ sap.ui.define(['sap/ui/core/library', 'sap/ui/core/ValueStateSupport', 'sap/ui/D
 
 		oRm.voidEnd();
 		oRm.close("div");
+
+		if (oCbLabel) {
+			oCbLabel.setRequired(bRequired);
+		}
+
 		oRm.renderControl(oCbLabel);
 
-		if (sTooltip && Configuration.getAccessibility() && bEditableAndEnabled) {
+		if (sTooltip && ControlBehavior.isAccessibilityEnabled() && bEditableAndEnabled) {
 			// for ARIA, the tooltip must be in a separate SPAN and assigned via aria-describedby.
 			// otherwise, JAWS does not read it.
 			oRm.openStart("span", sId + "-Descr");

package/src/sap/m/ColorPalette.js

@@ -9,6 +9,7 @@ sap.ui.define([
 	'sap/ui/core/Control',
 	'sap/ui/Device',
 	'sap/ui/base/DataType',
+	"sap/ui/core/Lib",
 	'sap/ui/core/library',
 	'sap/ui/core/delegate/ItemNavigation',
 	'./Button',
@@ -25,6 +26,7 @@ sap.ui.define([
 	Control,
 	Device,
 	DataType,
+	Library,
 	coreLibrary,
 	ItemNavigation,
 	Button,
@@ -65,7 +67,7 @@ sap.ui.define([
 		var MAX_COLORS = 15;
 
 		// get resource translation bundle;
-		var oLibraryResourceBundle = sap.ui.getCore().getLibraryResourceBundle("sap.m");
+		var oLibraryResourceBundle = Library.getResourceBundleFor("sap.m");
 
 		/**
 		 * Constructor for a new <code>ColorPalette</code>.
@@ -104,7 +106,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.120.6
+		 * @version 1.121.0
 		 *
 		 * @constructor
 		 * @public

package/src/sap/m/ColorPalettePopover.js

@@ -8,14 +8,16 @@
 sap.ui.define([
 	'sap/ui/core/Control',
 	'sap/ui/Device',
+	"sap/ui/core/Lib",
 	'sap/ui/unified/ColorPickerDisplayMode',
 	'./Button',
 	'./ResponsivePopover',
 	'./ColorPalette',
 	'./library'
-], function (
+], function(
 	Control,
 	Device,
+	Library,
 	ColorPickerDisplayMode,
 	Button,
 	ResponsivePopover,
@@ -37,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.120.6
+		 * @version 1.121.0
 		 *
 		 * @public
 		 * @since 1.54
@@ -181,7 +183,7 @@ sap.ui.define([
 		});
 
 		// get resource translation bundle;
-		var oLibraryResourceBundle = sap.ui.getCore().getLibraryResourceBundle("sap.m");
+		var oLibraryResourceBundle = Library.getResourceBundleFor("sap.m");
 
 		/**
 		 * Keeps reference to all API properties and/or methods that are about to be forwarded to either a

package/src/sap/m/ColorPaletteRenderer.js

@@ -4,8 +4,8 @@
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  */
 
-sap.ui.define(['sap/ui/Device'],
-	function (Device) {
+sap.ui.define(['sap/ui/Device', "sap/ui/core/Lib"],
+	function(Device, Library) {
 		"use strict";
 
 		/**
@@ -18,7 +18,7 @@ sap.ui.define(['sap/ui/Device'],
 
 
 		// reference to the message bundle
-		var oLibraryResourceBundle = sap.ui.getCore().getLibraryResourceBundle("sap.m");
+		var oLibraryResourceBundle = Library.getResourceBundleFor("sap.m");
 
 		/**
 		 * Renders the HTML for the given control, using the provided {@link sap.ui.core.RenderManager}.

package/src/sap/m/Column.js

@@ -7,14 +7,13 @@
 // Provides control sap.m.Column.
 sap.ui.define([
 	"./library",
-	"sap/ui/core/Core",
 	"sap/ui/core/Element",
 	"sap/ui/core/Renderer",
 	"sap/ui/core/library",
 	"sap/ui/Device",
 	"sap/ui/core/InvisibleText"
 ],
-	function(library, Core, Element, Renderer, coreLibrary, Device, InvisibleText) {
+	function(library, Element, Renderer, coreLibrary, Device, InvisibleText) {
 	"use strict";
 
 
@@ -46,7 +45,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Element
 	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @constructor
 	 * @public
@@ -584,7 +583,7 @@ sap.ui.define([
 	 * @private
 	 */
 	Column.prototype.getHeaderMenuInstance = function () {
-		return Core.byId(this.getHeaderMenu());
+		return Element.getElementById(this.getHeaderMenu());
 	};
 
 	Column.prototype.setHeader = function (oControl) {

package/src/sap/m/ColumnHeaderPopover.js

@@ -32,7 +32,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @constructor
 	 * @since 1.63

package/src/sap/m/ColumnListItem.js

@@ -43,7 +43,7 @@ sap.ui.define([
 	 * @implements sap.m.ITableItem
 	 *
 	 * @author SAP SE
-	 * @version 1.120.6
+	 * @version 1.121.0
 	 *
 	 * @constructor
 	 * @public
@@ -172,7 +172,9 @@ sap.ui.define([
 				onsapup: this.onsapup,
 				onsapdown: this.onsapdown,
 				oncontextmenu: this.oncontextmenu,
-				onkeydown: this.onkeydown
+				onkeydown: this.onkeydown,
+				onfocusin: this.onfocusin,
+				onfocusout: this.onfocusout
 			}, this).setParent(this, null, true);
 		}
 
@@ -241,28 +243,41 @@ sap.ui.define([
 		return oBundle.getText("ACC_CTR_TYPE_ROW");
 	};
 
-	ColumnListItem.prototype.getContentAnnouncement = function(oBundle) {
-		var oTable = this.getTable();
-		if (!oTable) {
-			return;
-		}
-
-		var aOutput = [],
-			aCells = this.getCells(),
-			aColumns = oTable.getRenderedColumns();
+	ColumnListItem.prototype.getContentAnnouncementOfCell = function(oColumn) {
+		return getAnnouncementForColumn(oColumn, this.getCells(), false);
+	};
 
-		aColumns.forEach(function(oColumn) {
-			var oCell = aCells[oColumn.getInitialOrder()];
-			if (!oCell) {
-				return;
-			}
+	function getAnnouncementForColumn(oColumn, aCells, bIncludeHeader) {
+		const oCell = aCells[oColumn.getInitialOrder()];
+		let sOutput = ListItemBase.getAccessibilityText(oCell, true);
 
-			var oHeader = oColumn.getHeader();
+		if (bIncludeHeader) {
+			const oHeader = oColumn.getHeader();
 			if (oHeader && oHeader.getVisible()) {
-				aOutput.push(ListItemBase.getAccessibilityText(oHeader) + " " + ListItemBase.getAccessibilityText(oCell, true));
-			} else {
-				aOutput.push(ListItemBase.getAccessibilityText(oCell, true));
+				sOutput = ListItemBase.getAccessibilityText(oHeader) + " " + sOutput;
 			}
+		}
+		return sOutput;
+	}
+
+	ColumnListItem.prototype.getContentAnnouncementOfPopin = function() {
+		const aCells = this.getCells();
+		const aOutput = this.getTable()._getVisiblePopin().map(function(oColumn) {
+			return getAnnouncementForColumn(oColumn, aCells, true);
+		});
+
+		return aOutput.filter(Boolean).join(" . ").trim();
+	};
+
+	ColumnListItem.prototype.getContentAnnouncement = function() {
+		const oTable = this.getTable();
+		if (!oTable) {
+			return;
+		}
+
+		const aCells = this.getCells();
+		const aOutput = oTable.getRenderedColumns().map(function(oColumn) {
+			return getAnnouncementForColumn(oColumn, aCells, true);
 		});
 
 		return aOutput.filter(Boolean).join(" . ").trim();
@@ -287,9 +302,33 @@ sap.ui.define([
 			this.$().children(".sapMListTblCellDup").find(":sapTabbable").attr("tabindex", -1);
 		}
 
+		const oTable = this.getTable();
+		const oTarget = oEvent.target;
+		if (oTarget.classList.contains("sapMListTblCell")) {
+			const oColumn = Element.getElementById(oTarget.getAttribute("data-sap-ui-column"));
+			oTable.updateInvisibleText(this.getContentAnnouncementOfCell(oColumn));
+			oEvent.setMarked("contentAnnouncementGenerated");
+		} else if (oTarget.classList.contains("sapMListTblSubCnt")) {
+			oTable.updateInvisibleText(this.getContentAnnouncementOfPopin());
+			oEvent.setMarked("contentAnnouncementGenerated");
+		}
+
 		ListItemBase.prototype.onfocusin.apply(this, arguments);
 	};
 
+	ColumnListItem.prototype.onfocusout = function(oEvent) {
+		if (oEvent.isMarked()) {
+			return;
+		}
+
+		const oTarget = oEvent.target;
+		if (oTarget.matches(".sapMListTblCell") || oTarget.matches(".sapMListTblSubCnt")) {
+			this.getTable().removeInvisibleTextAssociation(oTarget);
+		}
+
+		ListItemBase.prototype.onfocusout.apply(this, arguments);
+	};
+
 	ColumnListItem.prototype.onsapenter = ColumnListItem.prototype.onsapspace = function(oEvent) {
 		if (oEvent.isMarked()) {
 			return;