@sapui5/sap.suite.ui.commons 1.143.0 → 1.145.0

package/src/sap/suite/ui/commons/statusindicator/SimpleShape.js

@@ -30,7 +30,7 @@ sap.ui.define([
 	 * @extends sap.suite.ui.commons.statusindicator.Shape
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.50
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/statusindicator/StatusIndicator.js

@@ -49,7 +49,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.50
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/taccount/TAccount.js

@@ -56,7 +56,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.58.0
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/taccount/TAccountGroup.js

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.58.0
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/taccount/TAccountItem.js

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.58.0
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/taccount/TAccountItemProperty.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.58.0
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/taccount/TAccountPanel.js

@@ -65,7 +65,7 @@ sap.ui.define([
 	 * @extends sap.m.Panel
 	 *
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.145.0
 	 * @since 1.58.0
 	 *
 	 * @constructor

package/src/sap/suite/ui/commons/themes/base/NetworkGraph.less

@@ -58,7 +58,8 @@
 
 .sapSuiteUiCommonsNetworkGraphInnerScrollerCenter.sapSuiteUiCommonsNetworkGraphInnerScrollerNoMargin {
 	margin: 0;
-	width: 100%;
+	height:fit-content;
+	min-height: 0;
 }
 
 .sapSuiteUiCommonsNetworkGraphSearchField {
@@ -404,24 +405,23 @@ html[dir=rtl] .sapSuiteUiCommonsNetworkGraphMapDivGroups {
 .sapSuiteUiCommonsNetworkGraphNoDataWrapper {
 	margin-left: auto;
 	margin-right: auto;
-	margin-top: 40px;
+	margin-top: auto;
+	margin-bottom: auto;
 
 	display: flex;
-	flex-direction: column;
+	flex-direction: unset;
 	align-items: center;
 }
 
-.sapSuiteUiCommonsNetworkGraphNoDataWrapper:focus {
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
-	outline-offset: -1px;
-}
-
-.sapSuiteUiCommonsNetworkGraphNoDataIcon {
-	font-size: 4rem;
-}
+.sapSuiteUiCommonsNetworkGraphLoadingWrapper {
+	margin-left: auto;
+	margin-right: auto;
+	margin-top: auto;
+	margin-bottom: auto;
 
-.sapSuiteUiCommonsNetworkGraphNoDataLabel{
-	font-size: @sapMFontHeader3Size;
+	display: flex;
+	flex-direction: unset;
+	align-items: center;
 }
 
 .sapSuiteNetworkGraphSvgMargin {

package/src/sap/suite/ui/commons/themes/base/NetworkGroup.less

@@ -187,7 +187,7 @@
 
 .sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupTopBottom {
 	border-left-style: solid;
-	border-right: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapUiListBorderColor;
+	border-right: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapNeutralBorderColor;
 }
 
 .sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupTopBottom {
@@ -204,7 +204,39 @@
 }
 
 .sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupTopBottom:last-of-type {
-	border-bottom: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapUiListBorderColor;
+	border-bottom: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapNeutralBorderColor;
+}
+
+.sapSuiteUiCommonsNetworkGroupVerticalSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop .sapSuiteUiCommonsNetworkGroupHeader {
+	border: @sapUiFieldBorderStyle;
+	border-right: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapUiListBorderColor;
+	height: 99%;
+}
+
+.sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop {
+	border-left-style: solid;
+	border-right: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapNeutralBorderColor;
+}
+
+.sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop {
+	border-bottom: none;
+	border-top-style: dashed;
+}
+
+.sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop.sapSuiteUiCommonsNetworkGroupCollapsed .sapSuiteUiCommonsNetworkGroupHeader {
+	border: @sapUiFieldBorderStyle;
+}
+
+.sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop:first-of-type {
+	border-bottom: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapNeutralBorderColor;
+
+	.sapSuiteUiCommonsNetworkGroupHeader {
+		height: 100%;
+	}
+}
+
+.sapSuiteUiCommonsNetworkGroup.sapSuiteUiCommonsNetworkGroupSwimLane.sapSuiteUiCommonsNetworkGroupBottomTop:last-of-type {
+	border-top: @sapUiElementBorderWidth @sapUiContentFocusStyle @sapNeutralBorderColor;
 }
 
 // status

package/src/sap/suite/ui/commons/themes/base/NetworkLine.less

@@ -13,19 +13,15 @@
 
 .sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLinePath,
 .sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineArrow,
-.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineNipple {
+.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineNipple,
+.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke-width: 2;
 }
-// .sapSuiteUiCommonsNetworkElementSelected.sapSuiteUiCommonsNetworkElementFocus {
-// 	.sapSuiteUiCommonsNetworkCircleFocus, 
-// 	.sapSuiteUiCommonsNetworkGroupButton,
-// 	.sapSuiteUiCommonsNetworkBoxFocus {
-// 		stroke: none;
-// 	}
-// }
 
 .sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementSelected .sapSuiteUiCommonsNetworkLinePath,
-.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementSelected .sapSuiteUiCommonsNetworkLineArrow {
+.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementSelected .sapSuiteUiCommonsNetworkLineArrow,
+.sapSuiteUiCommonsNetworkLines .sapSuiteUiCommonsNetworkElementSelected .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke-width: 2;
 	stroke: @sapUiContentDragAndDropActiveColor;
 }
@@ -52,7 +48,11 @@
 	shape-rendering: auto !important;
 }
 .sapSuiteUiCommonsNetworkElementWarning.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLinePath,
-.sapSuiteUiCommonsNetworkElementWarning .sapSuiteUiCommonsNetworkLinePath {
+.sapSuiteUiCommonsNetworkElementWarning .sapSuiteUiCommonsNetworkLinePath,
+.sapSuiteUiCommonsNetworkElementWarning.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkElementWarning .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementWarning.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementWarning .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke: @sapWarningBorderColor;
 }
 
@@ -64,7 +64,11 @@
 }
 
 .sapSuiteUiCommonsNetworkElementError.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLinePath,
-.sapSuiteUiCommonsNetworkElementError .sapSuiteUiCommonsNetworkLinePath {
+.sapSuiteUiCommonsNetworkElementError .sapSuiteUiCommonsNetworkLinePath,
+.sapSuiteUiCommonsNetworkElementError.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkElementError .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementError.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementError .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke: @sapErrorBorderColor;
 }
 
@@ -76,7 +80,11 @@
 }
 
 .sapSuiteUiCommonsNetworkElementSuccess.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLinePath,
-.sapSuiteUiCommonsNetworkElementSuccess .sapSuiteUiCommonsNetworkLinePath {
+.sapSuiteUiCommonsNetworkElementSuccess .sapSuiteUiCommonsNetworkLinePath,
+.sapSuiteUiCommonsNetworkElementSuccess.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkElementSuccess .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementSuccess.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementSuccess .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke: @sapSuccessBorderColor;
 }
 
@@ -89,7 +97,11 @@
 
 
 .sapSuiteUiCommonsNetworkElementInformation.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLinePath,
-.sapSuiteUiCommonsNetworkElementInformation .sapSuiteUiCommonsNetworkLinePath {
+.sapSuiteUiCommonsNetworkElementInformation .sapSuiteUiCommonsNetworkLinePath,
+.sapSuiteUiCommonsNetworkElementInformation.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkElementInformation .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementInformation.sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineTextBoxBackground,
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementInformation .sapSuiteUiCommonsNetworkLineTextBoxBackground {
 	stroke: @sapInformationBorderColor;
 }
 
@@ -242,3 +254,36 @@
 	display: none;
 }
 
+.sapSuiteUiCommonsNetworkLineText {
+	font-size: 12px;
+	font-family: @sapUiFontFamily;
+	fill: @sapTextColor;
+	text-shadow: @sapContent_TextShadow;
+	pointer-events: all;
+	text-anchor: middle;
+	dominant-baseline: central;
+}
+
+.sapSuiteUiCommonsNetworkLineTextBox {
+	pointer-events: all;
+}
+
+.sapSuiteUiCommonsNetworkLineTextBoxBackground {
+	fill: @sapNeutralBackground;
+	stroke: @sapNeutralBorderColor;
+	stroke-width: 1;
+	pointer-events: all;
+}
+
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementFocus .sapSuiteUiCommonsNetworkLineTextBoxBackground {
+	stroke: @sapContent_FocusColor !important;
+	stroke-width: 2;
+}
+
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementFocus .sapSuiteUiCommonsNetworkLineText {
+    font-weight: bold;
+}
+
+.sapSuiteUiCommonsNetworkLineTexts .sapSuiteUiCommonsNetworkElementHighlight .sapSuiteUiCommonsNetworkLineText {
+    font-weight: bold;
+}

package/src/sap/suite/ui/commons/themes/base/NetworkNode.less

@@ -264,6 +264,25 @@
 	display: block;
 }
 
+.sapSuiteUiCommonsNetworkNodeActionButtonsVisible.sapSuiteUiCommonsNetworkGraphDivActionButtonsTop {
+	display: flex;
+	flex-direction: row;
+	gap: 4px;
+	width: auto;
+}
+
+.sapSuiteUiCommonsNetworkGraphDivActionButtonsTop {
+	top: -2.25rem;
+	right: 0;
+	width: auto;
+	display: none;
+}
+
+/* Remove vertical spacing for buttons in the top container */
+.sapSuiteUiCommonsNetworkGraphDivActionButtonsTop .sapSuiteUiCommonsNetworkGraphDivActionButtonBackground {
+	margin-bottom: 0;
+}
+
 .sapSuiteUiCommonsNetworkNodeActionButton {
 	font-size: @sapMFontLargeSize;
 	cursor: pointer;
@@ -880,4 +899,190 @@
 .sapSuiteStrokeSemanticColor(strokeSemanticColor);
 
 // auto-create border-color class with all different semantic colors
-.sapSuiteFillSemanticColor(fillSemanticColor);
+.sapSuiteFillSemanticColor(fillSemanticColor);
+
+/* ============================================= */
+/* Port Styles */
+/* ============================================= */
+.sapSuiteUiCommonsNetworkNodePort {
+    position: absolute;
+    width: 1.5rem; /* 24px including border */
+    height: 1.5rem; /* 24px including border */
+    background-color: transparent;
+    border: 0.125rem dashed @sapContent_DragAndDropActiveColor; /* 2px dashed */
+    border-radius: 50%;
+    cursor: default;
+    pointer-events: auto;
+    z-index: 10;
+    opacity: 1;
+    transition: all 0.2s ease;
+    box-sizing: border-box; /* Include border in width/height */
+}
+
+/* Position-specific styles for trigger ports */
+.sapSuiteUiLeftTriggerPort {
+    top: 50%;
+    left: -2rem;
+    transform: translateY(-50%);
+}
+
+.sapSuiteUiRightTriggerPort {
+    top: 50%;
+    right: -2rem;
+    transform: translateY(-50%);
+}
+
+.sapSuiteUiTopTriggerPort {
+    left: 50%;
+    top: -1rem;
+    transform: translateX(-50%);
+}
+
+.sapSuiteUiBottomTriggerPort {
+    left: 50%;
+    bottom: -1rem;
+    transform: translateX(-50%);
+}
+
+/* Position-specific styles for inlet ports */
+.sapSuiteUiLeftInletPort {
+    top: 50%;
+    left: -2rem;
+    transform: translateY(-50%);
+}
+
+.sapSuiteUiRightInletPort {
+    top: 50%;
+    right: -2rem;
+    transform: translateY(-50%);
+}
+
+.sapSuiteUiTopInletPort {
+    left: 50%;
+    top: -1rem;
+    transform: translateX(-50%);
+}
+
+.sapSuiteUiBottomInletPort {
+    left: 50%;
+    bottom: -1rem;
+    transform: translateX(-50%);
+}
+
+/* Position-specific styles for circle nodes (closer positioning) */
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiLeftTriggerPort,
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiLeftInletPort {
+    left: 1.25rem;
+}
+
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiRightTriggerPort,
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiRightInletPort {
+    right: 1.25rem;
+}
+
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiTopTriggerPort,
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiTopInletPort {
+    top: 1.25rem;
+}
+
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiBottomTriggerPort,
+.sapSuiteUiCommonsNetworkNodeCircle .sapSuiteUiBottomInletPort {
+    bottom: 1.25rem;
+}
+
+.sapSuiteUiCommonsNetworkNodeTriggerPort {
+    background: @sapButton_Background;
+    border: 0.125rem dashed @sapContent_DragAndDropActiveColor; /* 2px dashed */
+    cursor: pointer;
+}
+/* Active/dragging state for trigger ports */
+.sapSuiteUiCommonsNetworkNodeTriggerPort.sapSuiteUiCommonsNetworkNodePortActive,
+.sapSuiteUiCommonsNetworkNodeTriggerPort:active,
+.sapSuiteUiCommonsNetworkNodeTriggerPort.sapSuiteUiCommonsNetworkNodePortDragging {
+    background-color: @sapButton_Emphasized_Background;
+    border: 0.125rem solid @sapContent_DragAndDropActiveColor; /* 2px solid when active */
+}
+.sapSuiteUiCommonsNetworkNodeTriggerPort:hover,
+.sapSuiteUiLeftTriggerPort:hover,
+.sapSuiteUiRightTriggerPort:hover,
+.sapSuiteUiTopTriggerPort:hover,
+.sapSuiteUiBottomTriggerPort:hover {
+    background-color: @sapContent_DragAndDropActiveColor;
+    border-color: @sapContent_DragAndDropActiveColor;
+}
+
+.sapSuiteUiCommonsNetworkNodePortFocused {
+    outline: 2px solid @sapUiContentFocusColor;
+    outline-offset: 2px;
+    box-shadow: 0 0 0 1px @sapUiContentFocusColor;
+}
+
+.sapSuiteUiCommonsNetworkNodeTriggerPort.sapSuiteUiCommonsNetworkNodePortFocused {
+    background-color: @sapButton_Emphasized_Background;
+    border: 0.125rem solid @sapContent_DragAndDropActiveColor;
+}
+
+.sapSuiteUiCommonsNetworkNodeInletPort {
+    background: @sapButton_Background;
+    border: 0.125rem dashed @sapContent_DragAndDropActiveColor;
+}
+
+.sapSuiteUiCommonsNetworkNodeInletPort:hover,
+.sapSuiteUiLeftInletPort:hover,
+.sapSuiteUiRightInletPort:hover,
+.sapSuiteUiTopInletPort:hover,
+.sapSuiteUiBottomInletPort:hover {
+    opacity: 1;
+    background-color: @sapContent_DragAndDropActiveColor;
+    border: 0.125rem solid @sapContent_DragAndDropActiveColor; /* 2px solid on hover */
+}
+
+/* Active drop zone styling for inlet ports */
+.sapSuiteUiCommonsNetworkNodeInletPort.sapSuiteUiCommonsNetworkNodePortDropZone,
+.sapSuiteUiCommonsNetworkNodeInletPort.sapSuiteUiCommonsNetworkNodePortActive {
+    opacity: 1;
+    background-color: @sapButton_Emphasized_Background;
+    border: 0.125rem solid @sapContent_DragAndDropActiveColor; /* 2px solid when active drop zone */
+}
+
+.sapSuiteUiCommonsNetworkNodeGhostPort {
+    width: 1rem; /* 24px to match other ports */
+    height: 1rem; /* 24px to match other ports */
+    background-color: @sapContent_DragAndDropActiveColor;
+    border: 0.125rem dashed @sapContent_DragAndDropActiveColor; /* 2px dashed to match */
+    border-radius: 50%;
+    pointer-events: none;
+    z-index: 999;
+    opacity: 0.7;
+    box-sizing: border-box; /* Include border in width/height */
+}
+
+.sapSuiteUiCommonsNetworkNodeGhostLine {
+    position: absolute;
+    border-top: 0.0625rem dashed @sapUiContentForegroundBorderColor;
+    pointer-events: none;
+    z-index: 998;
+}
+
+.sapSuiteUiCommonsNetworkNodeGhostArrow {
+    width: 13px;
+    height: 19px;
+    pointer-events: none;
+    z-index: 999;
+    opacity: 0.8;
+    box-sizing: border-box;
+    
+    /* Create arrow shape using borders */
+    &:after {
+        content: '';
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        width: 0;
+        height: 0;
+        border-left: 7px solid @sapContent_DragAndDropActiveColor;
+        border-top: 6px solid transparent;
+        border-bottom: 6px solid transparent;
+    }
+}