@openui5/sap.f 1.120.6 → 1.121.0

package/src/sap/f/shellBar/ResponsiveHandler.js

@@ -61,7 +61,7 @@ sap.ui.define([
 	 */
 	ResponsiveHandler.prototype.onAfterRendering = function () {
 
-		var bPhoneRange = Device.media.getCurrentRange("StdExt", this._oControl.$().outerWidth(true)).name === "Phone";
+		var bPhoneRange = Device.media.getCurrentRange(this._oControl._sRangeSet, this._oControl.$().outerWidth(true)).name === "Phone";
 		this._oButton = this._oControl._oMegaMenu && this._oControl._oMegaMenu.getAggregation("_button");
 		this._oDomRef = this._oControl.getDomRef(); // Cache DOM Reference
 		this.bIsMegaMenuConfigured = this._oControl._oTitleControl &&
@@ -103,14 +103,19 @@ sap.ui.define([
 
 		var $Control = this._oControl.$(),
 			iWidth = $Control.outerWidth(),
-			oCurrentRange = Device.media.getCurrentRange("StdExt", iWidth),
+			oCurrentRange = Device.media.getCurrentRange(this._oControl._sRangeSet, iWidth),
 			bPhoneRange;
 
-		this.sCurrentRange = oCurrentRange.name;
+		if (this.sCurrentRange !== oCurrentRange.name) {
+			this._oControl._bOTBUpdateNeeded = true;
+			this.sCurrentRange = oCurrentRange.name;
+			this._oControl._oManagedSearch && this._oControl._oManagedSearch._setMedia(this.sCurrentRange);
+		}
 		// Adapt control padding's outside the managed area
 		if (oCurrentRange) {
 			bPhoneRange = this.sCurrentRange === "Phone";
 
+			$Control.toggleClass("sapFShellBarSizeExtraLargeDesktop", this.sCurrentRange === "ExtraLargeDesktop");
 			$Control.toggleClass("sapFShellBarSizeLargeDesktop", this.sCurrentRange === "LargeDesktop");
 			$Control.toggleClass("sapFShellBarSizeDesktop", this.sCurrentRange === "Desktop");
 			$Control.toggleClass("sapFShellBarSizeTablet", this.sCurrentRange === "Tablet");
@@ -120,12 +125,24 @@ sap.ui.define([
 		/**
 		 * Resize adaptation for the Search Bar UX requirements
 		 */
-		if (this._oControl._oManagedSearch && this._oControl._oManagedSearch.getIsOpen()) {
-			setTimeout(this._adaptSearch.bind(this), 100);
-		} else {
+		if (this._oControl._oManagedSearch && !this._oControl._oManagedSearch.getIsOpen()) {
 			this._oControl._bSearchPlaceHolder = false;
 		}
 
+		if (this.sCurrentRange === "ExtraLargeDesktop") {
+			this._oControl._oManagedSearch && this._oControl._oManagedSearch.setIsOpen(true);
+			setTimeout(this._adaptSearch.bind(this), 100);
+		}
+		if (this.sCurrentRange !== "ExtraLargeDesktop" && this._oControl._oManagedSearch && this._oControl._oManagedSearch.getIsOpen()) {
+			if (!this._oControl._oManagedSearch._bUserOpened) {
+				this._oControl._oManagedSearch.setIsOpen(false);
+			} else {
+				setTimeout(this._adaptSearch.bind(this), 100);
+			}
+		}
+
+		this._oControl._bOTBUpdateNeeded && this._oControl.invalidate();
+
 		if (this._iPreviousWidth === iWidth) {
 			return; // We have nothing to update
 		}

package/src/sap/f/shellBar/Search.js

@@ -36,7 +36,7 @@ sap.ui.define(['sap/ui/core/Control',
 		 * @extends sap.ui.core.Control
 		 *
 		 * @author SAP SE
-		 * @version 1.120.6
+		 * @version 1.121.0
 		 *
 		 * @constructor
 		 * @private
@@ -90,7 +90,11 @@ sap.ui.define(['sap/ui/core/Control',
 			this._layoutDataWhenClosed = new OverflowToolbarLayoutData({
 				priority: OverflowToolbarPriority.Low
 			});
+			this._layoutDataPhoneWhenClosed = new OverflowToolbarLayoutData({
+				priority: OverflowToolbarPriority.AlwaysOverflow
+			});
 			this._oAcc = new Accessibility();
+			this._bUserOpened = false;
 		};
 
 		Search.prototype.onBeforeRendering = function () {
@@ -191,8 +195,10 @@ sap.ui.define(['sap/ui/core/Control',
 
 			if (this.getIsOpen()) {
 				oLayoutData = this._layoutDataWhenOpen;
-			} else if (!this._bInOverflow) {
+			} else if (!this._bInOverflow && !this.getPhoneMode()) {
 				oLayoutData = this._layoutDataWhenClosed;
+			} else if (this.getPhoneMode()) {
+				oLayoutData = this._layoutDataPhoneWhenClosed;
 			}
 
 			if (!oLayoutData || this.getLayoutData() === oLayoutData) {
@@ -215,12 +221,22 @@ sap.ui.define(['sap/ui/core/Control',
 					query: oSearch.getValue(),
 					clearButtonPressed: false
 				});
-			} else {
-				this.toggleVisibilityOfSearchField();
 			}
+
+			if (this.sCurrentRange === "ExtraLargeDesktop") {
+				return;
+			}
+
+			this.toggleVisibilityOfSearchField();
+			this._bUserOpened = !this._bUserOpened;
+		};
+
+		Search.prototype._setMedia = function (sMediaRange) {
+			this.sCurrentRange = sMediaRange;
 		};
 
 		Search.prototype._onPressCancelButtonHandler = function () {
+			this._bUserOpened = false;
 			this.toggleVisibilityOfSearchField();
 		};
 

package/src/sap/f/themes/base/Card.less

@@ -30,7 +30,7 @@
 	width: 100%;
 	height: auto;
 	font-family: @sapUiFontFamily;
-	font-size: @sapUiFontSize;
+	font-size: @sapMFontMediumSize;
 	color: @sapUiGroupTitleTextColor;
 	outline: none;
 }
@@ -215,7 +215,7 @@ ui-integration-card.sapFCardTransparent > [data-sap-ui-area] > .sapFCard {
 				padding: 0.125rem 0;
 
 				.sapMText {
-					font-size: @sapUiFontSmallSize;
+					font-size: @sapMFontSmallSize;
 					color: @sapUiTileTitleTextColor;
 				}
 

package/src/sap/f/themes/base/CardLoading.less

@@ -3,8 +3,8 @@
 /* Base theme                         */
 /* ================================== */
 @_sap_f_Card_FocusBorderWidth: 1px;
-@sap_f_Card_Background_Placeholder_Color: @sapContent_Placeholderloading_Background;
-@sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapContent_Placeholderloading_Background 0%, @sapContent_Placeholderloading_Background 35%, darken(@sapContent_Placeholderloading_Background, 5) 50%, @sapContent_Placeholderloading_Background 65%, @sapContent_Placeholderloading_Background 100%);
+@_sap_f_Card_Background_Placeholder_Color: @sapUiContentPlaceholderloadingBackground;
+@_sap_f_Card_Placeholder_Gradient: linear-gradient(to right, @sapUiContentPlaceholderloadingBackground 0%, @sapUiContentPlaceholderloadingBackground 35%, darken(@sapUiContentPlaceholderloadingBackground, 5) 50%, @sapUiContentPlaceholderloadingBackground 65%, @sapUiContentPlaceholderloadingBackground 100%);
 
 .sapFCard {
 
@@ -18,6 +18,63 @@
 			//hide the fallback icon
 		}
 
+		.sapFCardHeaderImage .sapFCardHeaderItemBinded::after {
+			max-height: 2rem;
+			max-width: 2rem;
+			margin-top: 0.5rem;
+		}
+
+		.sapFCardHeaderText .sapFCardStatus.sapFCardHeaderItemBinded {
+			margin-top: 0;
+		}
+
+		.sapFCardHeaderTextSecondLine .sapFCardHeaderItemBinded::after {
+			margin-top: 0.2rem;
+		}
+
+		.sapFCardHeaderDetailsWrapper>.sapFCardHeaderItemBinded::after {
+			max-width: 70%;
+			margin-top: 0.2rem;
+		}
+
+		.sapFCardSubtitle .sapFCardHeaderItemBinded::after {
+			margin-top: 0.3rem;
+		}
+
+		.sapFCardHeaderTextSecondLine .sapFCardHeaderItemBinded::after,
+		.sapFCardSubtitle .sapFCardHeaderItemBinded::after,
+		.sapFCardHeaderDetailsWrapper .sapFCardHeaderItemBinded::after,
+		.sapFCardNumericIndicatorsSide .sapFCardHeaderItemBinded::after,
+		.sapFCardNumericIndicatorsSide .sapFCardHeaderItemBinded.sapMText::after {
+			max-height: 0.6rem;
+		}
+
+		.sapFCardNumericIndicatorsMain .sapFCardHeaderItemBinded::after {
+			margin-top: 0.5rem;
+			width: 80%;
+		}
+
+		.sapFCardHeaderText .sapMText.sapFCardHeaderItemBinded,
+		.sapFCardHeaderText .sapMText.sapFCardHeaderItemBinded span,
+		.sapFCardHeaderText .sapFCardStatus.sapFCardHeaderItemBinded,
+		.sapFCardSubtitle .sapMText.sapFCardHeaderItemBinded,
+		.sapFCardSubtitle .sapMText.sapFCardHeaderItemBinded + .sapFCardHeaderUnitOfMeasurement,
+		.sapFAvatar.sapFCardHeaderItemBinded span::before,
+		.sapFAvatar.sapFCardHeaderItemBinded .sapFAvatarImageHolder,
+		.sapFCardAvatarAndIndicatorsLine .sapMNC.sapFCardHeaderItemBinded span,
+		.sapFCardAvatarAndIndicatorsLine .sapMNC.sapFCardHeaderItemBinded div.sapMNCScale,
+		.sapFCardHeaderSideIndicator.sapFCardHeaderItemBinded span,
+		.sapFCardHeaderDetailsWrapper .sapMObjStatus.sapFCardHeaderItemBinded span {
+			visibility: hidden; // hide the loaded elements (texts, icons, etc.) behind the loading indicators
+		}
+
+		.sapFCardHeaderText .sapMText.sapFCardHeaderItemBinded::after,
+		.sapFCardHeaderText .sapFCardStatus.sapFCardHeaderItemBinded::after,
+		.sapFCardSubtitle .sapMText.sapFCardHeaderItemBinded::after,
+		.sapFCardSubtitle .sapFCardHeaderUnitOfMeasurement.sapMText.sapFCardHeaderItemBinded::after {
+			visibility: visible; // ... but show the loading indicator
+		}
+
 		.sapFCardHeaderText .sapFCardHeaderTextFirstLine {
 
 			.sapFCardTitle.sapFCardHeaderItemBinded {
@@ -37,11 +94,43 @@
 			position: absolute;
 			width: 100%;
 			height: 100%;
+			max-height: 1rem;
 			top: 0;
 			left: 0;
 		}
 	}
 
+	&.sapUiIntCardTileFlat,
+	&.sapUiIntCardTileFlatWide {
+		.sapFCardHeader.sapFCardHeaderLoading,
+		&.sapFCardPreview .sapFCardHeader {
+			.sapFAvatar.sapFCardHeaderItemBinded::after,
+			.sapFAvatar.sapFCardHeaderItemBinded::after {
+				margin-top: 0;
+				margin-left: 0;
+			}
+
+			.sapFCardAvatarAndIndicatorsLine .sapFCardIcon.sapFAvatar.sapFCardHeaderItemBinded,
+			.sapFCardAvatarAndIndicatorsLine .sapFCardIcon.sapFAvatar.sapFCardHeaderItemBinded {
+				margin-right: 0.5rem;
+			}
+
+			.sapFCardNumericIndicatorsMain .sapFCardHeaderItemBinded::after {
+				margin-top: -2px;
+			}
+		}
+	}
+
+	// no sapFCardHeaderItemBinded class present for the filter?
+	.sapFCardFilterLoading::after {
+		height: 2rem;
+		margin-top: 0.25rem;
+	}
+
+	.sapFCardFilterLoading .sapMSlt {
+		visibility: hidden; // hide the loaded Select behind the loading indicator
+	}
+
 	&.sapFCardPreview .sapFCardFilter,
 	.sapFCardFilterLoading {
 		position: relative;
@@ -83,7 +172,7 @@
 
 		.sapFCardHeaderDetails.sapFCardHeaderItemBinded {
 			flex: 1 0;
-			min-height: 0.5rem;
+			min-height: 1rem;
 			width: 100%;
 		}
 	}
@@ -145,8 +234,8 @@
 	}
 
 	.sapFCardLoadingShimmerMixin() {
-		background-color: @sap_f_Card_Background_Placeholder_Color;
-		background-image: @sap_f_Card_Placeholder_Gradient;
+		background-color: @_sap_f_Card_Background_Placeholder_Color;
+		background-image: @_sap_f_Card_Placeholder_Gradient;
 		background-repeat: no-repeat;
 		background-size: 800px 100%;
 		position: relative;

package/src/sap/f/themes/base/DynamicPage.less

@@ -40,7 +40,7 @@
 	top: 0;
 	right: 0;
 	left: 0;
-	z-index: 2;
+	z-index: 3;
 }
 
 html[data-sap-ui-browser^="ff"].sap-desktop .sapFDynamicPage.sapFDynamicPageWithScroll {

package/src/sap/f/themes/base/DynamicPageHeader.less

@@ -10,7 +10,7 @@
 @_sap_f_DynamicPageHeader_PinButton_Icon: pushpin-off;
 
 .sapFDynamicPageHeader {
-	z-index: 2;
+	z-index: 3;
 	position: relative;
 
 	-webkit-flex-shrink: 0;

package/src/sap/f/themes/base/DynamicPageTitle.less

@@ -20,7 +20,7 @@
 }
 
 .sapFDynamicPageTitle {
-	z-index: 3;
+	z-index: 4;
 	position: relative;
 	min-height: 3rem;
 	padding: 0.5rem 2rem 0.5rem 3rem;

package/src/sap/f/themes/base/GridContainer.less

@@ -6,6 +6,12 @@
 @_sap_f_GridContainer_FocusBorderOffset: 0;
 
 .sapFGridContainer {
+	.sapFGridContainerDummyArea {
+		position: fixed;
+	}
+}
+
+.sapFGridContainerListUl {
 	position: relative;
 	display: grid;
 	outline: none;
@@ -48,10 +54,6 @@
 		position: relative;
 	}
 
-  	.sapFGridContainerDummyArea {
-	  	position: fixed;
-	}
-
 	.sapUiIntCard.sapUiIntCardAnalytical {
 		min-height: 100%;
 	}

package/src/sap/f/themes/base/ShellBar.less

@@ -3,6 +3,7 @@
 @_sap_f_ShellBar_PaddingPhone: 1rem;
 @_sap_f_ShellBar_CoPilotWidth: 3rem;
 @_sap_f_ShellBar_CoPilotHalfWidth: 1.5rem;
+@_sap_f_ShellBar_SearchHalfMaxWidth: 17.5rem;
 
 @_sap_f_ShellBar_PrimaryTitle_FontSize: @sapMFontMediumSize;
 @_sap_f_ShellBar_SecondTitle_FontSize: @sapMFontSmallSize;
@@ -16,18 +17,6 @@
 	padding: 0 @_sap_f_ShellBar_PaddingDesktop;
 	display: flex;
 	align-items: center;
-	.sapFShellBarCopilot& {
-		.sapFShellBarORHB {
-			width: 50%;
-			padding-left: ~"calc(@{_sap_f_ShellBar_CoPilotHalfWidth} + 0.5rem)";
-		}
-		.sapFShellBarOLHB {
-			width: 50%;
-			padding-right: ~"calc(@{_sap_f_ShellBar_CoPilotHalfWidth} + 0.5rem)";
-
-		}
-
-	}
 
 	.sapFShellBarOLHB,
 	.sapFShellBarORHB {
@@ -385,11 +374,13 @@
 		}
 		.sapFShellBarSearchWrap {
 			 box-sizing: border-box;
-			 width: 100%;
 			 padding: 0 1.25rem;
 			 position: absolute;
+			 align-items: center;
+			 right: 0;
 			 left: 0;
 			 top: 0;
+			 bottom: 0;
 		 }
 		.sapMSF,
 		.sapFShellBarSearch {
@@ -405,6 +396,34 @@
 	}
 }
 
+.sapFShellBar.sapFShellBarSizeExtraLargeDesktop {
+	.sapFShellBarSearch {
+		max-width: 35rem; // max width of searchField + button width
+		width: 100%;
+		flex-grow: 1;
+		flex-shrink: 1;
+		box-sizing: border-box;
+		position: absolute;
+		left: ~"calc(50% - @{_sap_f_ShellBar_SearchHalfMaxWidth})";
+
+		.sapMSF {
+			max-width: 35rem;
+			min-width: auto;
+		}
+	}
+
+	&.sapFShellBarWithSearch {
+		.sapFShellBarORHB {
+			width: 50%;
+			padding-left: ~"calc(@{_sap_f_ShellBar_SearchHalfMaxWidth} + 0.5rem)";
+		}
+		.sapFShellBarOLHB {
+			width: 50%;
+			padding-right: ~"calc(@{_sap_f_ShellBar_SearchHalfMaxWidth} + 0.5rem)";
+
+		}
+	}
+}
 .sapFButtonNotifications[data-notifications],
 .sapFShellBarOverflowButton[data-notifications] {
 	overflow: visible;

package/LICENSES/BSD-2-Clause.txt

@@ -1,22 +0,0 @@
-Copyright (c) <year> <owner>. All rights reserved.
-
-Redistribution and use in source and binary forms, with or without modification,
-are permitted provided that the following conditions are met:
-
-1. Redistributions of source code must retain the above copyright notice,
-this list of conditions and the following disclaimer.
-
-2. Redistributions in binary form must reproduce the above copyright notice,
-this list of conditions and the following disclaimer in the documentation
-and/or other materials provided with the distribution.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
-AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
-IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
-ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
-LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
-DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
-SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
-CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
-OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE
-USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.