@openui5/sap.f 1.127.0 → 1.128.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.f",
-  "version": "1.127.0",
+  "version": "1.128.0",
   "description": "OpenUI5 UI Library sap.f",
   "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.m": "1.127.0",
-    "@openui5/sap.ui.core": "1.127.0",
-    "@openui5/sap.ui.layout": "1.127.0"
+    "@openui5/sap.m": "1.128.0",
+    "@openui5/sap.ui.core": "1.128.0",
+    "@openui5/sap.ui.layout": "1.128.0"
   }
 }

package/src/sap/f/.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.127.0</version>
+  <version>1.128.0</version>
 
   <documentation>SAPUI5 library with Fiori controls.</documentation>
 

package/src/sap/f/Avatar.js

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * @extends sap.m.Avatar
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/f/AvatarGroup.js

@@ -100,7 +100,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/f/AvatarGroupItem.js

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

package/src/sap/f/CalendarAppointmentInCard.js

@@ -21,7 +21,7 @@ sap.ui.define([
 	 * This calendar appointment is used in card content of type Calendar.
 	 *
 	 * @extends sap.ui.unified.CalendarAppointment
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/f/CalendarInCard.js

@@ -45,7 +45,7 @@ sap.ui.define([
 	 * <code>sap.m.Toolbar</code> with <code>sap.m.Buttons</code>.
 	 *
 	 * @extends sap.ui.unified.Calendar
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @private

package/src/sap/f/Card.js

@@ -71,7 +71,7 @@ sap.ui.define([
 	 * @extends sap.f.CardBase
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/f/CardBase.js

@@ -5,24 +5,19 @@
  */
 sap.ui.define([
 	"sap/ui/core/Control",
-	"sap/f/library",
-	"sap/m/library",
 	"sap/ui/core/InvisibleText",
-	"sap/m/BadgeEnabler",
 	"sap/f/CardRenderer",
-	"sap/ui/core/Lib"
+	"sap/ui/core/Lib",
+	"sap/f/cards/util/CardBadgeEnabler"
 ], function (
 	Control,
-	library,
-	mLibrary,
 	InvisibleText,
-	BadgeEnabler,
 	CardRenderer,
-	Library
+	Library,
+	CardBadgeEnabler
 ) {
 	"use strict";
 
-	var BadgeState = mLibrary.BadgeState;
 	var BADGE_AUTOHIDE_TIME = 3000;
 
 	/**
@@ -37,7 +32,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public
@@ -62,12 +57,22 @@ sap.ui.define([
 				 */
 				height: {type: "sap.ui.core.CSSSize", group: "Appearance", defaultValue: "auto"}
 			},
-			aggregations: {}
+			aggregations: {
+
+				/**
+				 * Defines the internally used <code>sap.m.ObjectStatus</code>.
+				 */
+				_cardBadges: {
+					type: "sap.m.ObjectStatus",
+					multiple: true,
+					visibility: "hidden"
+				}
+			}
 		},
 		renderer: CardRenderer
 	});
 
-	BadgeEnabler.call(CardBase.prototype);
+	CardBadgeEnabler.call(CardBase.prototype);
 
 	/**
 	 * Initialization hook.
@@ -83,8 +88,7 @@ sap.ui.define([
 
 		this._ariaText = new InvisibleText({id: this.getId() + "-ariaText"});
 		this._ariaText.setText(this._oRb.getText("ARIA_ROLEDESCRIPTION_CARD"));
-
-		this.initBadgeEnablement();
+		this.initCardBadgeEnablement();
 	};
 
 	CardBase.prototype.exit = function () {
@@ -193,49 +197,15 @@ sap.ui.define([
 	};
 
 	CardBase.prototype._hideBadge = function () {
+		const oCardBadgeCustomData = this._getCardBadgeCustomData();
 
-		var oBadgeCustomData = this.getBadgeCustomData();
-		if (oBadgeCustomData) {
-			oBadgeCustomData.setVisible(false);
+		if (oCardBadgeCustomData?.length > 0) {
+			this._hideBadges();
 		}
 
 		this._iHideBadgeTimeout = null;
 	};
 
-	CardBase.prototype.onBadgeUpdate = function (sValue, sState, sBadgeId) {
-
-		var oHeader = this.getCardHeader(),
-			oDomRef,
-			sAriaLabelledBy;
-
-		if (oHeader) {
-			oDomRef = oHeader.getFocusDomRef();
-		} else {
-			oDomRef = this.getDomRef("contentSection");
-		}
-
-		if (!oDomRef) {
-			return;
-		}
-
-		sAriaLabelledBy = oDomRef.getAttribute("aria-labelledby") || "";
-
-		switch (sState) {
-			case BadgeState.Appear:
-				sAriaLabelledBy = sBadgeId + " " + sAriaLabelledBy;
-				oDomRef.setAttribute("aria-labelledby", sAriaLabelledBy);
-				break;
-			case BadgeState.Disappear:
-				sAriaLabelledBy = sAriaLabelledBy.replace(sBadgeId, "").trim();
-				oDomRef.setAttribute("aria-labelledby", sAriaLabelledBy);
-				break;
-		}
-	};
-
-	CardBase.prototype.getAriaLabelBadgeText = function () {
-		return this.getBadgeCustomData().getValue();
-	};
-
 	/**
 	 * Gets the ids of the elements labelling the Card container.
 	 *

package/src/sap/f/CardRenderer.js

@@ -32,12 +32,17 @@ sap.ui.define([
 	 */
 	CardRenderer.render = function (oRm, oCard) {
 		var oHeader = oCard.getCardHeader(),
-			bHeaderTop = oHeader && oCard.getCardHeaderPosition() === HeaderPosition.Top;
+			bHeaderTop = oHeader && oCard.getCardHeaderPosition() === HeaderPosition.Top,
+			bHasCardBadgeCustomData = oCard._getCardBadgeCustomData().length > 0;
 
 		oRm.openStart("div", oCard);
 		this.renderContainerAttributes(oRm, oCard);
 		oRm.openEnd();
 
+		 if (bHasCardBadgeCustomData) {
+			this.renderCardBadge(oRm, oCard);
+		}
+
 		// header at the top
 		if (bHeaderTop) {
 			oRm.renderControl(oHeader);
@@ -56,6 +61,9 @@ sap.ui.define([
 
 		oRm.renderControl(oCard._ariaText);
 		oRm.renderControl(oCard._ariaContentText);
+		if (bHasCardBadgeCustomData) {
+			oRm.renderControl(oCard._getInvisibleCardBadgeText());
+		}
 
 		oRm.close("div");
 	};
@@ -72,7 +80,8 @@ sap.ui.define([
 			bHasHeader = !!(oHeader && oHeader.getVisible()),
 			bHasContent = !!oContent,
 			bCardHeaderBottom = bHasHeader && oCard.getCardHeaderPosition() === HeaderPosition.Bottom,
-			sTooltip = oCard.getTooltip_AsString();
+			sTooltip = oCard.getTooltip_AsString(),
+			bHasCardBadgeCustomData = oCard._getCardBadgeCustomData().length > 0;
 
 		oRm.class("sapFCard")
 			.style("width", oCard.getWidth());
@@ -105,7 +114,8 @@ sap.ui.define([
 		//Accessibility state
 		oRm.accessibilityState(oCard, {
 			role: "region",
-			labelledby: { value: oCard._getAriaLabelledIds(), append: true }
+			labelledby: { value: oCard._getAriaLabelledIds(), append: true },
+			describedby: {value: bHasCardBadgeCustomData ? oCard._getInvisibleCardBadgeText().getId() : undefined}
 		});
 	};
 
@@ -147,5 +157,22 @@ sap.ui.define([
 
 	};
 
+	/**
+	 * Render card badge section.
+	 *
+	 * @protected
+	 * @param {sap.ui.core.RenderManager} oRm The RenderManager that can be used for writing to the render output buffer.
+	 * @param {sap.f.Card} oCard An object representation of the control that should be rendered.
+	 */
+	CardRenderer.renderCardBadge = function (oRm, oCard) {
+		oRm.openStart("div", oCard.getId() + "-cardBadgeSection")
+			.class("sapFCardBadgePlaceholder")
+			.openEnd();
+				oCard._getCardBadges()?.forEach((oCardBadge) => {
+					oRm.renderControl(oCardBadge);
+				});
+		oRm.close("div");
+	};
+
 	return CardRenderer;
 });

package/src/sap/f/DynamicPage.js

@@ -118,7 +118,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public
@@ -454,7 +454,8 @@ sap.ui.define([
 	DynamicPage.prototype.onAfterRendering = function () {
 
 		var bShouldSnapWithScroll,
-			iCurrentScrollPosition;
+			iCurrentScrollPosition,
+			oHeader = this.getHeader();
 
 		if (this.getPreserveHeaderStateOnScroll()) {
 			// Ensure that in this tick DP and it's aggregations are rendered
@@ -486,6 +487,10 @@ sap.ui.define([
 
 		this._updateToggleHeaderVisualIndicators();
 		this._updateTitleVisualState();
+
+		if (exists(oHeader) && oHeader._setLandmarkInfo) {
+			oHeader._setLandmarkInfo(this.getLandmarkInfo());
+		}
 	};
 
 	DynamicPage.prototype.exit = function () {

package/src/sap/f/DynamicPageAccessibleLandmarkInfo.js

@@ -23,7 +23,7 @@ sap.ui.define(['sap/ui/core/Element', './library'],
 	 * @extends sap.ui.core.Element
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public
@@ -88,7 +88,16 @@ sap.ui.define(['sap/ui/core/Element', './library'],
 			 *
 			 * If not set (and a landmark different than <code>sap.ui.core.AccessibleLandmarkRole.None</code> is defined), no label is set.
 			 */
-			footerLabel : {type : "string", defaultValue : null}
+			footerLabel : {type : "string", defaultValue : null},
+
+			/**
+			* Texts which describe the landmark of the section inside the header container of the corresponding <code>sap.f.DynamicPage</code> control.
+			*
+			* If not set, default "Expanded header" aria-label is set.
+			* @public
+			* @since 1.127.0
+			*/
+			headerContentLabel: {type : "string", defaultValue : null}
 		}
 	}});
 

package/src/sap/f/DynamicPageHeader.js

@@ -64,7 +64,7 @@ sap.ui.define([
 		 * @extends sap.ui.core.Control
 		 *
 		 * @author SAP SE
-		 * @version 1.127.0
+		 * @version 1.128.0
 		 *
 		 * @constructor
 		 * @public
@@ -141,10 +141,10 @@ sap.ui.define([
 		DynamicPageHeader.prototype.init = function() {
 			this._bShowCollapseButton = true;
 			this._oInvisibleMessage = null;
+			this._oLandmarkInfo = null;
 		};
 
 		DynamicPageHeader.prototype.onAfterRendering = function () {
-			this._initARIAState();
 			this._initPinButtonARIAState();
 
 			if (!this._oInvisibleMessage) {
@@ -155,6 +155,8 @@ sap.ui.define([
 			if (this.getPinnable()) {
 				this._setPressedStatePinIcon();
 			}
+
+			this._applyAriaAttributes();
 		};
 
 		/*************************************** Private members ******************************************/
@@ -212,13 +214,25 @@ sap.ui.define([
 		};
 
 		/**
-		 * Initializes the <code>DynamicPageHeader</code> ARIA State.
+		 * Applies the <code>DynamicPageHeader</code> ARIA attributes.
 		 * @private
 		 */
-		DynamicPageHeader.prototype._initARIAState = function () {
-			var $header = this.$();
+		DynamicPageHeader.prototype._applyAriaAttributes = function () {
+			var $header = this.$(),
+				bHasHeaderContentLabel = this._oLandmarkInfo && this._oLandmarkInfo.getHeaderContentLabel();
+
+			if (bHasHeaderContentLabel) {
+				var sHeaderContentLabel = this._oLandmarkInfo.getHeaderContentLabel();
+				$header.attr(DynamicPageHeader.ARIA.ARIA_LABEL, sHeaderContentLabel);
+			} else {
+				$header.attr(DynamicPageHeader.ARIA.ARIA_LABEL, DynamicPageHeader.ARIA.LABEL_EXPANDED);
+			}
+		};
+
+		DynamicPageHeader.prototype._setLandmarkInfo = function (oLandmarkInfo) {
+			this._oLandmarkInfo = oLandmarkInfo;
 
-			$header.attr(DynamicPageHeader.ARIA.ARIA_LABEL, DynamicPageHeader.ARIA.LABEL_EXPANDED);
+			this._applyAriaAttributes();
 		};
 
 		/**

package/src/sap/f/DynamicPageTitle.js

@@ -95,7 +95,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/f/FlexibleColumnLayout.js

@@ -108,7 +108,7 @@ sap.ui.define([
 	 *
 	 * @extends sap.ui.core.Control
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public
@@ -650,6 +650,27 @@ sap.ui.define([
 						 */
 						endColumn : {type : "boolean"}
 					}
+				},
+
+				/**
+				 * Fired when user resize columns.
+				 * @since 1.128
+				 */
+				columnsDistributionChange : {
+					parameters : {
+						/**
+						 * The current <code>media</code> - dekstop or tablet.
+						 */
+						media: { type: "string" },
+						/**
+						 * The value of the <code>layout</code> property.
+						 */
+						layout: { type: "string" },
+						/**
+						 * Sizes of all columns in percentages, separated by '/'.
+						 */
+						columnsSizes : {type : "string"}
+					}
 				}
 			}
 		},
@@ -713,20 +734,11 @@ sap.ui.define([
 		this._boundColumnSeparatorMoveEnd = this._onColumnSeparatorMoveEnd.bind(this);
 		this._oLocalStorage = {};
 		this._bNeverRendered = true;
-	};
 
-	FlexibleColumnLayout.prototype._getLocalStorage = function (iMaxColumnsCount) {
-		if (!iMaxColumnsCount) {
-			iMaxColumnsCount = this.getMaxColumnsCount();
-		}
-		var sKey = (iMaxColumnsCount === 3) ? "desktop" : "tablet";
-		if (!this._oLocalStorage[sKey]) {
-			var sPrefix = sKey === 'desktop' ?
-				FlexibleColumnLayout.STORAGE_PREFIX_DESKTOP :
-				FlexibleColumnLayout.STORAGE_PREFIX_TABLET;
-			this._oLocalStorage[sKey] = new Storage(Storage.Type.local, sPrefix);
-		}
-		return this._oLocalStorage[sKey];
+		this._oBeginColumnWidth =  {
+			tablet: 0,
+			desktop: 0
+		};
 	};
 
 	FlexibleColumnLayout.prototype._announceMessage = function (sResourceBundleKey) {
@@ -765,6 +777,7 @@ sap.ui.define([
 
 		if (this._hasAnyColumnPagesRendered() !== bHadAnyColumnPagesRendered) {
 			this._hideShowColumnSeparators();
+			this._updateSeparatorsAriaPositionInfo();
 		}
 	};
 
@@ -1323,6 +1336,12 @@ sap.ui.define([
 		if (oOptions.updateDetailedActiveClasses) {
 			this._addDetailedActiveClasses(sLayout);
 		}
+
+		if (bHasAnimations) {
+			this._attachAfterAllColumnsResizedOnce(this._updateSeparatorsAriaPositionInfo.bind(this));
+		} else {
+			this._updateSeparatorsAriaPositionInfo();
+		}
 	};
 
 	/**
@@ -1675,6 +1694,7 @@ sap.ui.define([
 		this.toggleStyleClass("sapFFLActiveResize", false);
 		this._oMoveInfo.separator.style.visibility = "";
 		this._oMoveInfo.separator.focus();
+		this._updateAriaPositionInfo(this._oMoveInfo.separator);
 		this._ignoreMouse = false;
 		this._ignoreTouch = false;
 		this._oMoveInfo = null;
@@ -2024,14 +2044,32 @@ sap.ui.define([
 	FlexibleColumnLayout.prototype._saveResizedColumWidths = function() {
 		var sNewLayout = this._oMoveInfo.layout,
 			oColumnPercentWidths = this._convertColumnPxWidthToPercent(this._oMoveInfo.columnWidths, sNewLayout),
-			sNewWidthsDistribution = Object.values(oColumnPercentWidths).join("/");
+			sNewWidthsDistribution = Object.values(oColumnPercentWidths).join("/"),
+			sMediaKey;
 
 		if (this._isValidWidthDistributionForLayout(sNewWidthsDistribution, sNewLayout)) {
-			this._getLocalStorage().put(sNewLayout, sNewWidthsDistribution);
-			this._getLocalStorage().put("begin", oColumnPercentWidths.begin);
+			sMediaKey = this._getMediaKey();
+			this.fireColumnsDistributionChange({
+				media: sMediaKey,
+				layout: sNewLayout,
+				columnsSizes: sNewWidthsDistribution
+			});
+
+			this._oBeginColumnWidth[sMediaKey] = oColumnPercentWidths.begin;
 		}
 	};
 
+	FlexibleColumnLayout.prototype._getMediaKey = function (iMaxColumnsCount) {
+		var sKey;
+
+		if (!iMaxColumnsCount) {
+			iMaxColumnsCount = this.getMaxColumnsCount();
+		}
+		sKey = (iMaxColumnsCount === 3) ? "desktop" : "tablet";
+
+		return sKey;
+	};
+
 	FlexibleColumnLayout.prototype._getNextLayoutOnResizeByDrag = function (oColumnWidths,
 		sPreviousLayout, sSeparator, bForwardDirection, bResizeEnd) {
 			function dragged(oOptions) {
@@ -2168,6 +2206,78 @@ sap.ui.define([
 		return oLayoutMatchers[sLayout]();
 	};
 
+	/**
+	 * Obtains the range of the possible possitions along the X-axis of this separator (allowed by the current layout)
+	 * where the start of the axis is the edge of the FlexibleColumnLayout closest to the begin column.
+	 * @param {object} oSeparator the separator HTML element
+	 * @returns {object} the start and end positions
+	 */
+	FlexibleColumnLayout.prototype._getSeparatorMovementRange = function (oSeparator) {
+		var sSeparator = getSeparatorName(oSeparator),
+			sLayout = this.getLayout(),
+			iMaxColumnsForWidth = this.getMaxColumnsCount(),
+			iMaxColumnsForLayoutType = this._getMaxColumnsCountForLayout(sLayout, FlexibleColumnLayout.DESKTOP_BREAKPOINT),
+			bDesktop = iMaxColumnsForWidth === 3,
+			bTablet = iMaxColumnsForWidth === 2,
+			bIsThreeColumnLayout = iMaxColumnsForLayoutType === 3,
+			iTotalSpace = this._iWidth,
+			iSpaceBeforeRange = FlexibleColumnLayout.COLUMN_MIN_WIDTH, // space for the preceding column
+			iSpaceAfterRange = FlexibleColumnLayout.COLUMN_MIN_WIDTH, // space for the suceeding column
+			iRangeLength;
+
+		if (bDesktop && sSeparator === "end") {
+			// (the width of the 'begin' column is fixed, as the user cannot resize it by moving the 'end' separator)
+			iSpaceBeforeRange = this._$columns["begin"].get(0).offsetWidth + FlexibleColumnLayout.COLUMN_MIN_WIDTH; // space for the preceding columns
+			if (sLayout === LT.ThreeColumnsMidExpandedEndHidden) {
+				iSpaceAfterRange = 0; // the 'end' separator is adjacent to the FCL edge, nothing follows it
+			}
+		}
+
+		if (bTablet) {
+			if (sSeparator === "begin" & bIsThreeColumnLayout) {
+				iSpaceBeforeRange = 0; // the 'begin' separator is adjacent to the FCL edge, nothing precedes it
+			}
+			if (sSeparator === "end" && sLayout === LT.ThreeColumnsMidExpandedEndHidden) {
+				iSpaceAfterRange = 0; // the 'end' separator is adjacent to the FCL edge, nothing follows it
+			}
+		}
+
+		// provision space to render the separator itself
+		iSpaceAfterRange += FlexibleColumnLayout.COLUMN_SEPARATOR_WIDTH;
+
+		iRangeLength = iTotalSpace - iSpaceBeforeRange - iSpaceAfterRange;
+
+		return {
+			from: iSpaceBeforeRange,
+			to: iSpaceBeforeRange + iRangeLength
+		};
+	};
+
+	FlexibleColumnLayout.prototype._updateAriaPositionInfo = function (oSeparator) {
+		// obtain the range [fromX ... toX] of the possible positions along the X-axis
+		// of this separator (as allowed by the current layout)
+		var oRange = this._getSeparatorMovementRange(oSeparator),
+			iRangeLength = oRange.to - oRange.from,
+			iSeparatorEarliestPossibleX = oRange.from,
+			iSeparatorCurrentX = oSeparator.offsetLeft,
+			iSeparatorAdvanceInsideRange = iSeparatorCurrentX - iSeparatorEarliestPossibleX,
+			 // convert to value inside [0, ..., 100] interval
+			iSeparatorRelativePositionInsideRange = iSeparatorAdvanceInsideRange / iRangeLength * 100,
+			sSeparatorRelativePositionInsideRange = iSeparatorRelativePositionInsideRange.toFixed(2);
+		oSeparator.setAttribute("aria-valuenow", sSeparatorRelativePositionInsideRange);
+	};
+
+	FlexibleColumnLayout.prototype._updateSeparatorsAriaPositionInfo = function () {
+		if (!this._oColumnSeparators) {
+			return;
+		}
+		Object.values(this._oColumnSeparators).forEach(function($separator) {
+			if ($separator.get(0).style.display !== "none") {
+				this._updateAriaPositionInfo($separator.get(0));
+			}
+		}, this);
+	};
+
 	/**
 	 * Obtains the current width of a column
 	 *
@@ -3006,8 +3116,14 @@ sap.ui.define([
 	 * @ui5-restricted sap.f.FlexibleColumnLayoutSemanticHelper
 	 */
 	FlexibleColumnLayout.prototype._getColumnWidthDistributionForLayout = function (sLayout, bAsIntArray, iMaxColumnsCount) {
-		var sColumnWidthDistribution = this._getLocalStorage(iMaxColumnsCount).get(sLayout),
-			iBeginWidth = this._getLocalStorage(iMaxColumnsCount).get("begin"),
+		var oLayoutData = this.getLayoutData(),
+			sMediaKey = this._getMediaKey(iMaxColumnsCount),
+			oLayoutDataPerMedia = oLayoutData?.isA("sap.f.FlexibleColumnLayoutData")
+				&& (sMediaKey === "desktop" ? oLayoutData.getDesktopLayoutData() : oLayoutData.getTabletLayoutData()),
+			sGetterNameLayout = "get" + sLayout,
+			sColumnWidthDistribution = oLayoutDataPerMedia?.[sGetterNameLayout]?.(),
+			bIsValidDistribution = sColumnWidthDistribution && this._isValidWidthDistributionForLayout(sColumnWidthDistribution, sLayout),
+			iBeginWidth = this._oBeginColumnWidth[sMediaKey],
 			vResult,
 			vResultAsArray;
 
@@ -3017,8 +3133,7 @@ sap.ui.define([
 
 			vResult = "0/0/0";
 
-		} else if (iMaxColumnsCount > 1
-			&& sColumnWidthDistribution) {
+		} else if (iMaxColumnsCount > 1 && sColumnWidthDistribution && bIsValidDistribution) {
 			vResult = sColumnWidthDistribution;
 		} else {
 			vResult = this._getDefaultColumnWidthDistributionForLayout(sLayout, iMaxColumnsCount);

package/src/sap/f/FlexibleColumnLayoutAccessibleLandmarkInfo.js

@@ -22,7 +22,7 @@ sap.ui.define(['sap/ui/core/Element', './library'],
 	 * @extends sap.ui.core.Element
 	 *
 	 * @author SAP SE
-	 * @version 1.127.0
+	 * @version 1.128.0
 	 * @since 1.95
 	 *
 	 * @constructor