@sapui5/sap.suite.ui.commons 1.146.0 → 1.147.0

package/src/sap/suite/ui/commons/messagebundle.properties

@@ -532,10 +532,10 @@ NETWORKGRAPH_CANCEL_BUTTON=Cancel
 #XBUT: Cancel button text
 NETWORKGRAPH_CREATE_BUTTON=Create
 #XTXT: Connection type display texts
-NETWORKGRAPH_CONNECTION_TYPE_LEFT_TO_LEFT=Left to Left
-NETWORKGRAPH_CONNECTION_TYPE_LEFT_TO_RIGHT=Left to Right
-NETWORKGRAPH_CONNECTION_TYPE_RIGHT_TO_LEFT=Right to Left
-NETWORKGRAPH_CONNECTION_TYPE_RIGHT_TO_RIGHT=Right to Right
+NETWORKGRAPH_CONNECTION_TYPE_LEFT_TO_LEFT=Start to Start
+NETWORKGRAPH_CONNECTION_TYPE_LEFT_TO_RIGHT=Start to Finish
+NETWORKGRAPH_CONNECTION_TYPE_RIGHT_TO_LEFT=Finish to Start
+NETWORKGRAPH_CONNECTION_TYPE_RIGHT_TO_RIGHT=Finish to Finish
 NETWORKGRAPH_CONNECTION_TYPE_TOP_TO_TOP=Top to Top
 NETWORKGRAPH_CONNECTION_TYPE_TOP_TO_BOTTOM=Top to Bottom
 NETWORKGRAPH_CONNECTION_TYPE_BOTTOM_TO_TOP=Bottom to Top
@@ -553,13 +553,13 @@ NETWORK_GRAPH_NODE_ATTRIBUTES=Attributes are
 #XACT: Text for node status accessibility label
 NETWORK_GRAPH_NODE_ACCESSIBILITY_STATUS=Status is
 #XACT: Text for incoming connectors accessibility label (singular)
-NETWORK_GRAPH_INCOMING_CONNECTOR_SINGULAR=There is {0} incoming connector
+NETWORK_GRAPH_INCOMING_CONNECTOR_SINGULAR={0} incoming connector
 #XACT: Text for incoming connectors accessibility label (plural)
-NETWORK_GRAPH_INCOMING_CONNECTORS_PLURAL=There are {0} incoming connectors
+NETWORK_GRAPH_INCOMING_CONNECTORS_PLURAL={0} incoming connectors
 #XACT: Text for outgoing connectors accessibility label (singular)
-NETWORK_GRAPH_OUTGOING_CONNECTOR_SINGULAR=There is {0} outgoing connector
+NETWORK_GRAPH_OUTGOING_CONNECTOR_SINGULAR={0} outgoing connector
 #XACT: Text for outgoing connectors accessibility label (plural)
-NETWORK_GRAPH_OUTGOING_CONNECTORS_PLURAL=There are {0} outgoing connectors
+NETWORK_GRAPH_OUTGOING_CONNECTORS_PLURAL={0} outgoing connectors
 #XACT: Text for keyboard navigation to outgoing connector
 NETWORK_GRAPH_NAVIGATION_TAB_TO_OUTGOING=To navigate to the outgoing connector, press Tab
 #XACT: Text for keyboard navigation to incoming connector
@@ -570,6 +570,10 @@ NETWORK_GRAPH_LINE_NAVIGATION_TAB_TO_TARGET=To navigate to {0}, press Tab
 NETWORK_GRAPH_LINE_NAVIGATION_SHIFT_TAB_TO_SOURCE=To navigate back to {0}, press Shift + Tab
 #XACT: Text for keyboard navigation between connectors
 NETWORK_GRAPH_LINE_NAVIGATION_ARROW_KEYS=To navigate to other connectors from {0}, Use arrow keys
+#XACT: Text hint to hear individual connector navigation options via Alt+
+NETWORK_GRAPH_NAVIGATION_ALT_CONNECTORS=To hear possible connectors, press ALT +
+#XACT: Text for individual connector announcement when Alt+ is pressed. {0}=type, {1}=direction, {2}=connection type, {3}=from node, {4}=to node, {5}=number
+NETWORK_GRAPH_NAVIGATION_ALT_CONNECTOR_ANNOUNCE=Navigate to {0} connector on {1}, {2} connector connecting {3} to {4}, press ALT + {5}
 #XACT: Text for line status accessibility label
 NETWORK_GRAPH_LINE_ACCESSIBILITY_STATUS=Status is
 #XACT: Text for line accessibility - connection going from source to destination

package/src/sap/suite/ui/commons/messagebundle_mk.properties

@@ -297,7 +297,7 @@ NETWORK_GRAPH_OUTGOING_CONNECTORS_PLURAL=\u041F\u043E\u0441\u0442\u043E\u0458\u0
 NETWORK_GRAPH_NAVIGATION_TAB_TO_OUTGOING=\u0417\u0430 \u043D\u0430\u0432\u0438\u0433\u0438\u0440\u0430\u045A\u0435 \u043A\u043E\u043D \u0438\u0437\u043B\u0435\u0437\u043D\u0438\u043E\u0442 \u043A\u043E\u043D\u0435\u043A\u0442\u043E\u0440, \u043F\u0440\u0438\u0442\u0438\u0441\u043D\u0435\u0442\u0435 Tab
 NETWORK_GRAPH_NAVIGATION_SHIFT_TAB_TO_INCOMING=\u0417\u0430 \u043D\u0430\u0432\u0438\u0433\u0438\u0440\u0430\u045A\u0435 \u043A\u043E\u043D \u0432\u043B\u0435\u0437\u043D\u0438\u043E\u0442 \u043A\u043E\u043D\u0435\u043A\u0442\u043E\u0440, \u043F\u0440\u0438\u0442\u0438\u0441\u043D\u0435\u0442\u0435 Shift + Tab
 NETWORK_GRAPH_LINE_NAVIGATION_TAB_TO_TARGET=\u041F\u0440\u0438\u0442\u0438\u0441\u043D\u0435\u0442\u0435 \u043D\u0430 \u043A\u043E\u043F\u0447\u0435\u0442\u043E Tab \u0437\u0430 \u0434\u0430 \u043F\u043E\u0458\u0434\u0435\u0442\u0435 \u043D\u0430 {0}
-NETWORK_GRAPH_LINE_NAVIGATION_SHIFT_TAB_TO_SOURCE=\u041F\u0440\u0438\u0442\u0438\u0441\u043D\u0435\u0442\u0435 \u043D\u0430 \u043A\u043E\u043F\u0447\u0438\u045A\u0430\u0442\u0430 Shift+Tab \u0437\u0430 \u0434\u0430 \u0441\u0435 \u0432\u0440\u0430\u0442\u0438\u0442\u0435 \u043D\u0430 {0}
+NETWORK_GRAPH_LINE_NAVIGATION_SHIFT_TAB_TO_SOURCE=\u041F\u0440\u0438\u0442\u0438\u0441\u043D\u0435\u0442\u0435 \u043D\u0430 \u043A\u043E\u043F\u0447\u0438\u045A\u0430\u0442\u0430 Shift+Tab \u0437\u0430 \u0434\u0430 \u0441\u0435 \u0432\u0440\u0430\u0442\u0438\u0442\u0435 \u043D\u0430\u0437\u0430\u0434 \u043D\u0430 {0}
 NETWORK_GRAPH_LINE_NAVIGATION_ARROW_KEYS=\u0417\u0430 \u0434\u0430 \u043D\u0430\u0432\u0438\u0433\u0438\u0440\u0430\u0442\u0435 \u043A\u043E\u043D \u0434\u0440\u0443\u0433\u0438 \u043A\u043E\u043D\u0435\u043A\u0442\u043E\u0440\u0438 \u043E\u0434 {0}, \u043A\u043E\u0440\u0438\u0441\u0442\u0435\u0442\u0435 \u0433\u0438 \u043A\u043E\u043F\u0447\u0438\u045A\u0430\u0442\u0430 \u0441\u043E \u0441\u0442\u0440\u0435\u043B\u043A\u0438
 NETWORK_GRAPH_LINE_ACCESSIBILITY_STATUS=\u0421\u0442\u0430\u0442\u0443\u0441\u043E\u0442 \u0435
 NETWORK_GRAPH_LINE_ACCESSIBILITY_CONNECTION_FROM_TO=\u0412\u0440\u0441\u043A\u0430\u0442\u0430 \u043E\u0434\u0438 \u043E\u0434 {0} \u0434\u043E {1}

package/src/sap/suite/ui/commons/networkgraph/Graph.js

@@ -291,10 +291,10 @@ sap.ui.define([
 				 */
 				connectionTypeMapping: {
 					type: "object", group: "Behavior", defaultValue: {
-						"LeftToLeft": "Left to Left",
-						"LeftToRight": "Left to Right",
-						"RightToLeft": "Right to Left",
-						"RightToRight": "Right to Right"
+						"LeftToLeft": "Start to Start",
+						"LeftToRight": "Start to Finish",
+						"RightToLeft": "Finish to Start",
+						"RightToRight": "Finish to Finish"
 					}
 				}
 			},
@@ -480,7 +480,14 @@ sap.ui.define([
 						 */
 						item: { type: "sap.suite.ui.commons.networkgraph.ElementBase" }
 					}
-				}
+				},
+				/**
+				 * Fired when the user requests to add a node via INSERT or Ctrl+Alt+N.
+				 * Only available when NoopLayout is used and enableDragAndDrop is <code>true</code>.
+				 * @public
+				 * @since 1.148
+				 */
+				nodeAdded: {}
 			}
 		}
 	});
@@ -579,13 +586,66 @@ sap.ui.define([
 		}
 		// Initialize PortManager with this graph instance
 		PortManager.setGraphInstance(this);
+		Core.ready(this._handleCoreInitialized.bind(this));
+
+	};
+
+	/**
+	 * Handler for the core's init event. Attaches listener for localization changes.
+	 * @private
+	 */
+	Graph.prototype._handleCoreInitialized = function () {
+		Localization.attachChange(this._handleLocalizationChanged.bind(this));
+	};
+
+	/**
+	 * Handler for localization changes. Sets a pending flag when RTL mode changes so that
+	 * node dimensions are re-measured after RTL CSS files finish loading.
+	 * UI5 automatically re-renders all UIAreas on RTL change; the flag prevents premature
+	 * layout calculation in onAfterRendering before CSS dimensions are stable.
+	 * @private
+	 */
+	Graph.prototype._handleLocalizationChanged = function () {
+		const bNewRtl = Localization.getRTL();
+		if (this._bIsRtl !== bNewRtl) {
+			this._bIsRtl = bNewRtl;
+			this._bRtlMeasurementPending = true;
+
+			const fnOnApplied = function () {
+				Theming.detachApplied(fnOnApplied);
+				if (this._bRtlMeasurementPending) {
+					this._bRtlMeasurementPending = false;
+					this._measureAndLayout();
+				}
+			}.bind(this);
+			Theming.attachApplied(fnOnApplied);
+		}
+	};
 
+	Graph.prototype._measureAndLayout = function () {
+		var aNodes = this.getNodes();
+		aNodes.forEach(function (oNode) {
+			if (this._isUseNodeHtml()) {
+				oNode._setupDivDimensions();
+			} else {
+				oNode.calculateSizes();
+				oNode._setupWidthAndHeight();
+			}
+		}.bind(this));
+		this._bTriggerLayoutCalculation = true;
+		this._preprocessData();
 	};
 
 	Graph.prototype.onBeforeRendering = function () {
 		// indicates RTL
 		this._bIsRtl = Localization.getRTL();
 
+		// Check if the currently focused item has been destroyed and clear it
+		if (this._oFocus && this._oFocus.item && (this._oFocus.item.bIsDestroyed || this._oFocus.item.isDestroyed?.())) {
+			Log.info("NetworkGraph: Focused item was destroyed before rendering, clearing focus");
+			this._oFocus = null;
+		}
+
 		this.setBusy(false);
 		this.setBusyIndicatorDelay(0);
 
@@ -633,7 +693,6 @@ sap.ui.define([
 			this.$().addClass("sapSuiteUiCommonsNetworkGraphFullScreen");
 		}
 
-
 		if (aNodes.length === 0 || this._bIsInvalid || this.getNoData()) {
 			if (this._bIsInvalid) {
 				oRm.openStart("span");
@@ -695,29 +754,18 @@ sap.ui.define([
 					oRm.flush(this._$innerscroller[0], true, this._$innerscroller.children().length);
 				}
 
-				// make sure everything is rendered
-				aNodes.forEach(function (oNode) {
-					if (this._isUseNodeHtml()) {
-						// call after rendering before layouter starts - can be handy when user custom renders
-						oNode._setupDivDimensions();
-					} else {
-						oNode.calculateSizes();
-						oNode._setupWidthAndHeight();
-					}
-				}.bind(this));
-
-				this._preprocessData();
-				Theming.detachApplied(fnProcess);
+				if (!this._bRtlMeasurementPending) {
+					this._measureAndLayout();
+				}
 			}.bind(this);
 
-			// In case theme is applied fnProcess will be called immediately,
-			// else it will be called once theme is applied.
-			Theming.attachApplied(fnProcess);
+			fnProcess();
 		}
 		this.oInvisibleMessage = InvisibleMessage.getInstance();
 		oRm.destroy();
 
 	};
+
 	Graph.prototype.exit = function () {
 		// if (this.oHashChanger) {
 		// 	this.oHashChanger.destroy();
@@ -1025,6 +1073,21 @@ sap.ui.define([
 		this._oZoomLevelInvisibleText.setText(oResourceBundle.getText("NETWORK_GRAPH_ZOOM_LEVEL") + ": " + this._getZoomText());
 	};
 
+	/**
+	 * Restores keyboard focus to the last focused item in the graph, or falls back to the graph wrapper.
+	 * @private
+	 */
+	Graph.prototype._restoreFocusToGraph = function () {
+		if (this._oFocus) {
+			const oFocusToRestore = this._oFocus;
+			// Force setFocus to re-apply even if the item hasn't changed.
+			this._oFocus = null;
+			this.setFocus(oFocusToRestore);
+		} else {
+			this.getFocusDomRef().focus();
+		}
+	};
+
 	/**
 	 * Gets the associated control linked to this graph instance using the 'associatedControl' association.
 	 * This can be any UI5 control that is related to the graph.
@@ -1086,7 +1149,14 @@ sap.ui.define([
 		oTooltip.attachEvent("afterClose", function () {
 			var oFocus = this.getFocus();
 
-			if (oFocus) {
+			if (oFocus && oFocus.item) {
+				// Check if the focused item is destroyed before trying to restore focus
+				if (oFocus.item.bIsDestroyed || oFocus.item.isDestroyed?.()) {
+					Log.info("NetworkGraph: Cannot restore focus on destroyed control after tooltip close");
+					this._oFocus = null;
+					return;
+				}
+
 				this.setFocus(oFocus);
 
 				if (oFocus.button == "menu") {
@@ -1192,6 +1262,13 @@ sap.ui.define([
 	 * @private
 	 */
 	Graph.prototype.setFocus = function (oFocus, bIsClickOrEnter) {
+		// Check if the focused item has been destroyed and clear it
+		if (oFocus && oFocus.item && (oFocus.item.bIsDestroyed || oFocus.item.isDestroyed?.())) {
+			Log.info("NetworkGraph: Cannot set focus on destroyed control, clearing focus");
+			this._oFocus = null;
+			return;
+		}
+
 		// Identity redundant
 		if (!oFocus && !this._oFocus ||
 			oFocus && this._oFocus && oFocus.item === this._oFocus.item && oFocus.button === this._oFocus.button  && oFocus.groupInFocused === this._oFocus.groupInFocused) {
@@ -1406,12 +1483,25 @@ sap.ui.define([
 
 		// While Expand/Collapse, focus will still remain to the button
 		if (this._oFocus && this._oFocus.button === Group.BUTTONS.COLLAPSE) {
-			this._oFocus.item._setCollapseButtonFocus(true);
+			// Check if the focused item still exists and is not destroyed
+			if (this._oFocus.item && !this._oFocus.item.bIsDestroyed && !this._oFocus.item.isDestroyed?.()) {
+				this._oFocus.item._setCollapseButtonFocus(true);
+			} else {
+				Log.info("NetworkGraph: Focused item was destroyed, clearing focus");
+				this._oFocus = null;
+			}
 		}
 		this._bIsLayedOut = true;
 		this._setupEvents();
 		this._setupKeyboardNavigation();
-		this.setFocus(this.getFocus());
+		// Only restore focus if the focused item still exists and is not destroyed
+		var oCurrentFocus = this.getFocus();
+		if (oCurrentFocus && oCurrentFocus.item && (oCurrentFocus.item.bIsDestroyed || oCurrentFocus.item.isDestroyed?.())) {
+			Log.info("NetworkGraph: Cannot restore focus on destroyed control, clearing focus");
+			this._oFocus = null;
+		} else {
+			this.setFocus(oCurrentFocus);
+		}
 
 		// when there is background image, busy is set false after image is loaded (own event)
 		// in case image was already loaded continue as usual
@@ -2876,7 +2966,13 @@ sap.ui.define([
 			fHeight = oItem._iHeight;
 		}
 
-		this.$scroller.get(0).scrollLeft = ((fX + (fWidth ? fWidth : 0) / 2) * this._fZoomLevel) - (this.$scroller.width() / 2);
+		const fScrollLeft = ((fX + (fWidth ? fWidth : 0) / 2) * this._fZoomLevel) - (this.$scroller.width() / 2);
+
+		if (this._bIsRtl) {
+			this.$scroller.get(0).scrollLeft = -fScrollLeft;
+		} else {
+			this.$scroller.get(0).scrollLeft = fScrollLeft;
+		}
 		this.$scroller.get(0).scrollTop = ((fY + (fHeight ? fHeight : 0) / 2) * this._fZoomLevel) - (this.$scroller.height() / 2);
 	};
 
@@ -2897,6 +2993,14 @@ sap.ui.define([
 			iRight = iLeft + this.$scroller.width() / this._fZoomLevel,
 			iBottom = iTop + this.$scroller.height() / this._fZoomLevel;
 
+		if (this._bIsRtl) {
+			const iGraphWidth = this.$svg.width() / this._fZoomLevel;
+			const iViewportWidth = this.$scroller.width() / this._fZoomLevel;
+			const iScrollPosAbs = Math.abs(iLeft);
+			iLeft = iGraphWidth - iScrollPosAbs - iViewportWidth;
+			iRight = iLeft + iViewportWidth;
+		}
+
 		if (!oItem._isOnScreen(iLeft, iRight, iTop, iBottom)) {
 			if (oItem instanceof Node) {
 				iCenterX = oItem.getX() + oItem._iWidth / 2;
@@ -2911,7 +3015,14 @@ sap.ui.define([
 			}
 
 			if (iCenterX < iLeft || iCenterX > iRight) {
-				oScroller.scrollLeft = iCenterX * this._fZoomLevel - this.$scroller.width() / 2;
+				let iTargetScrollLeft = iCenterX * this._fZoomLevel - this.$scroller.width() / 2;
+
+				if (this._bIsRtl) {
+					const iScrollRange = oScroller.scrollWidth - oScroller.clientWidth;
+					iTargetScrollLeft = -(iScrollRange - iTargetScrollLeft);
+				}
+
+				oScroller.scrollLeft = iTargetScrollLeft;
 			}
 			if (iCenterY < iTop || iCenterY > iBottom) {
 				oScroller.scrollTop = iCenterY * this._fZoomLevel - this.$scroller.height() / 2;

package/src/sap/suite/ui/commons/networkgraph/GraphMap.js

@@ -367,12 +367,28 @@ sap.ui.define([
 		}
 	};
 
+	/**
+	 * Returns the horizontal scroll position in graph coordinates, accounting for RTL.
+	 */
+	GraphMap.prototype._getScrollLeftForMap = function (oGraph) {
+		const fScrollLeft = oGraph.$scroller[0].scrollLeft;
+
+		if (oGraph._bIsRtl) {
+			const iGraphWidth = oGraph.$svg.width() / oGraph._fZoomLevel;
+			const iViewportWidth = oGraph.$scroller.width() / oGraph._fZoomLevel;
+			const iScrollPosAbs = Math.abs(fScrollLeft) / oGraph._fZoomLevel;
+			return iGraphWidth - iScrollPosAbs - iViewportWidth;
+		}
+
+		return fScrollLeft / oGraph._fZoomLevel;
+	};
+
 	GraphMap.prototype._resize = function () {
 		var oGraph = this.getGraph(),
 			$scroller = oGraph.$scroller,
 			$mapNavigator = this.$("mapNavigator");
 
-		$mapNavigator.attr("x", Math.max(NAVIGATORLINESIZE / 2, $scroller[0].scrollLeft / oGraph._fZoomLevel));
+		$mapNavigator.attr("x", Math.max(NAVIGATORLINESIZE / 2, this._getScrollLeftForMap(oGraph)));
 		$mapNavigator.attr("y", Math.max(NAVIGATORLINESIZE / 2, $scroller[0].scrollTop / oGraph._fZoomLevel));
 
 		$mapNavigator.attr("width", $scroller.width() / oGraph._fZoomLevel);
@@ -403,7 +419,7 @@ sap.ui.define([
 			$mapNavigator = this.$("mapNavigator");
 
 		if (oGraph && $scroller[0]) {
-			$mapNavigator.attr("x", Math.max(NAVIGATORLINESIZE / 2, $scroller[0].scrollLeft / oGraph._fZoomLevel));
+			$mapNavigator.attr("x", Math.max(NAVIGATORLINESIZE / 2, this._getScrollLeftForMap(oGraph)));
 			$mapNavigator.attr("y", Math.max(NAVIGATORLINESIZE / 2, $scroller[0].scrollTop / oGraph._fZoomLevel));
 
 			this._correctMapNavigator();
@@ -424,7 +440,13 @@ sap.ui.define([
 				fRealStartX = $border.offset().left,
 				fRealStartY = $border.offset().top;
 
-			oScroller.scrollLeft = (oScrollData.pageX - fRealStartX) * iRatio - ($scroller.width() / 2);
+			const fTargetScrollLeft = (oScrollData.pageX - fRealStartX) * iRatio - ($scroller.width() / 2);
+			if (oGraph._bIsRtl) {
+				const iScrollRange = oScroller.scrollWidth - oScroller.clientWidth;
+				oScroller.scrollLeft = -(iScrollRange - fTargetScrollLeft);
+			} else {
+				oScroller.scrollLeft = fTargetScrollLeft;
+			}
 			oScroller.scrollTop = (oScrollData.pageY - fRealStartY) * iRatio - ($scroller.height() / 2);
 		};