@openui5/sap.ui.unified 1.126.1 → 1.128.0

package/THIRDPARTY.txt

@@ -468,7 +468,7 @@ License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: lib/jsdoc/ui5/plugin.js
 
-Component: SAP Theming Base Content, version: 11.12.0
+Component: SAP Theming Base Content, version: 11.16.1
 Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.ui.unified",
-  "version": "1.126.1",
+  "version": "1.128.0",
   "description": "OpenUI5 UI Library sap.ui.unified",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -14,6 +14,6 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.ui.core": "1.126.1"
+    "@openui5/sap.ui.core": "1.128.0"
   }
 }

package/src/sap/ui/unified/.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.126.1</version>
+  <version>1.128.0</version>
 
   <documentation>Unified controls intended for both, mobile and desktop scenarios</documentation>
 

package/src/sap/ui/unified/Calendar.js

@@ -78,7 +78,7 @@ sap.ui.define([
 	 * Basic Calendar.
 	 * This calendar is used for DatePickers
 	 * @extends sap.ui.core.Control
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarAppointment.js

@@ -43,7 +43,7 @@ sap.ui.define([
 	 *
 	 * Applications could inherit from this element to add own fields.
 	 * @extends sap.ui.unified.DateTypeRange
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarDateInterval.js

@@ -59,7 +59,7 @@ sap.ui.define([
 	 * @class
 	 * <code>CalendarDateInterval</code> only visualizes the dates in a one-line interval and allows the selection of a single day.
 	 * @extends sap.ui.unified.Calendar
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarLegend.js

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

package/src/sap/ui/unified/CalendarLegendItem.js

@@ -21,7 +21,7 @@ sap.ui.define(['sap/ui/core/Element', './library'],
 	 * @class
 	 * Item to be displayed in a CalendarLegend.
 	 * @extends sap.ui.core.Element
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarMonthInterval.js

@@ -65,7 +65,7 @@ sap.ui.define([
 	 * <b>Note:</b> UI5Date or JavaScript Date objects are used to set and return the months, mark them as selected or as a special type.
 	 * But the date part of the Date object is not used. If a Date object is returned the date will be set to the 1st of the corresponding month.
 	 * @extends sap.ui.core.Control
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarOneMonthInterval.js

@@ -57,7 +57,7 @@ sap.ui.define([
 		 * Navigation via year picker switches to the corresponding year and the same month as before the navigation.
 		 *
 		 * @extends sap.ui.unified.CalendarDateInterval
-		 * @version 1.126.1
+		 * @version 1.128.0
 		 *
 		 * @constructor
 		 * @private

package/src/sap/ui/unified/CalendarRow.js

@@ -23,7 +23,6 @@ sap.ui.define([
 	"sap/ui/dom/containsOrEquals",
 	"sap/ui/thirdparty/jquery",
 	"sap/ui/unified/CalendarAppointment",
-	'sap/ui/core/InvisibleMessage',
 	'sap/ui/core/library',
 	"sap/ui/core/date/UI5Date"
 ], function(
@@ -44,7 +43,6 @@ sap.ui.define([
 	containsOrEquals,
 	jQuery,
 	CalendarAppointment,
-	InvisibleMessage,
 	corelibrary,
 	UI5Date
 ) {
@@ -68,8 +66,6 @@ sap.ui.define([
 	// shortcut for sap.ui.unified.CalendarAppointmentRoundWidth
 	var CalendarAppointmentRoundWidth = library.CalendarAppointmentRoundWidth;
 
-	var InvisibleMessageMode = corelibrary.InvisibleMessageMode;
-
 	/*
 	 * <code>UniversalDate</code> objects are used inside the <code>CalendarRow</code>, whereas UI5Date or JavaScript dates are used in the API.
 	 * So conversion must be done on API functions.
@@ -88,7 +84,7 @@ sap.ui.define([
 	 * @class
 	 * A calendar row with a header and appointments. The Appointments will be placed in the defined interval.
 	 * @extends sap.ui.core.Control
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public
@@ -253,6 +249,12 @@ sap.ui.define([
 			 */
 			appointments : {type : "sap.ui.unified.CalendarAppointment", defaultClass: CalendarAppointment, multiple : true, singularName : "appointment"},
 
+			/**
+			 * Sets the provided period to be displayed as a non-working.
+			 * @since 1.128
+			 */
+			nonWorkingPeriods: {type: "sap.ui.unified.NonWorkingPeriod", multiple: true},
+
 			/**
 			 * Appointments to be displayed in the top of the intervals. The <code>intervalHeaders</code> are used to visualize
 			 * public holidays and similar things.
@@ -362,9 +364,10 @@ sap.ui.define([
 
 		this._bRTL  = Localization.getRTL();
 		this._oRb = Library.getResourceBundleFor("sap.ui.unified");
+		var pattern = this._oRb.getText("APPOINTMENT_DATE_TIME_DESCRIPTION", [_getLocaleData.call(this).getDatePattern("long"), _getLocaleData.call(this).getTimePattern("medium")]);
 
 		this._oFormatAria = DateFormat.getDateTimeInstance({
-			pattern: "EEEE dd/MM/YYYY 'at' " + _getLocaleData.call(this).getTimePattern("medium")
+			pattern: "EEEE " + pattern
 		});
 
 		this._aVisibleAppointments = [];
@@ -414,8 +417,6 @@ sap.ui.define([
 				this._updateSelectedAppointmentsArray(oApp);
 			}.bind(this));
 		}
-
-		this._oInvisibleMessage = InvisibleMessage.getInstance();
 	};
 
 	CalendarRow.prototype.onAfterRendering = function(){
@@ -619,7 +620,7 @@ sap.ui.define([
 	CalendarRow.prototype.onsapselect = function(oEvent){
 		// focused appointment must be selected
 		var aVisibleAppointments = this._getVisibleAppointments(),
-			oAppointment, sBundleKey;
+			oAppointment;
 
 
 		for (var i = 0; i < aVisibleAppointments.length; i++) {
@@ -631,9 +632,6 @@ sap.ui.define([
 			}
 		}
 
-		sBundleKey = oAppointment.getSelected() ? "APPOINTMENT_SELECTED" : "APPOINTMENT_UNSELECTED";
-		this._oInvisibleMessage.announce(this._oRb.getText(sBundleKey), InvisibleMessageMode.Polite);
-
 		//To prevent bubbling into PlanningCalendar.
 		//For appointments, this will prevent tap event on ColumnListItem, which in turn fires rowSelectionChange.
 		oEvent.stopPropagation();
@@ -1686,11 +1684,12 @@ sap.ui.define([
 
 		var i = 0;
 		var oApp;
-		var sAriaLabel;
-		var sAriaLabelNotSelected;
-		var sAriaLabelSelected;
+		var sAriaDescribedBy;
+		var sAriaDescribedByNotSelected;
+		var sCurrentAriaDescribedBy;
+		var sCurrentAriaDescribedBySelected;
+		var sCurrentAriaDescribedByNotSelected;
 		var sSelectedTextId = InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT_SELECTED");
-		var sUnselectedTextId = InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT_UNSELECTED");
 		var bSelect = !oAppointment.getSelected();
 
 		if (bRemoveOldSelection) {
@@ -1709,25 +1708,30 @@ sap.ui.define([
 							this.aSelectedAppointments.splice(j);
 						}
 					}
-					sAriaLabel = oApp.$().attr("aria-labelledby");
-					sAriaLabelNotSelected = sAriaLabel ? sAriaLabel.replace(sSelectedTextId, sUnselectedTextId) : "";
-					oApp.$().attr("aria-labelledby", sAriaLabelNotSelected);
+					sAriaDescribedBy = oApp.$().attr("aria-describedby");
+					sAriaDescribedByNotSelected = sAriaDescribedBy ? sAriaDescribedBy.replace(sSelectedTextId, "") : "";
+					oApp.$().attr("aria-describedby", sAriaDescribedByNotSelected);
 				}
 			}
 		}
 
-		sAriaLabelSelected = oAppointment.$().attr("aria-labelledby").replace(sUnselectedTextId, sSelectedTextId).trim();
-		sAriaLabelNotSelected = oAppointment.$().attr("aria-labelledby").replace(sSelectedTextId, sUnselectedTextId).trim();
+		sCurrentAriaDescribedBy = oAppointment.$().attr("aria-describedby");
+		sCurrentAriaDescribedByNotSelected = (sCurrentAriaDescribedBy ? sCurrentAriaDescribedBy.replace(sSelectedTextId, "") : "").trim();
+		sCurrentAriaDescribedBySelected = (sCurrentAriaDescribedByNotSelected + " " + sSelectedTextId).trim();
 
 		if (oAppointment.getSelected()) {
 			oAppointment.setProperty("selected", false, true); // do not invalidate CalendarRow
 			oAppointment.$().removeClass("sapUiCalendarAppSel");
-			oAppointment.$().attr("aria-labelledby", sAriaLabelNotSelected);
+			if (sCurrentAriaDescribedByNotSelected) {
+				oAppointment.$().attr("aria-describedby", sCurrentAriaDescribedByNotSelected);
+			} else {
+				oAppointment.$().removeAttr("aria-describedby");
+			}
 			_removeAllAppointmentSelections(this, bRemoveOldSelection);
 		} else {
 			oAppointment.setProperty("selected", true, true); // do not invalidate CalendarRow
 			oAppointment.$().addClass("sapUiCalendarAppSel");
-			oAppointment.$().attr("aria-labelledby", sAriaLabelSelected);
+			oAppointment.$().attr("aria-describedby", sCurrentAriaDescribedBySelected);
 			_removeAllAppointmentSelections(this, bRemoveOldSelection);
 		}
 		// removes or adds the selected appointments from this.aSelectedAppointments

package/src/sap/ui/unified/CalendarRowRenderer.js

@@ -13,7 +13,8 @@ sap.ui.define([
 	'sap/ui/Device',
 	'sap/ui/unified/library',
 	'sap/ui/core/InvisibleText',
-	"sap/ui/core/date/UI5Date",
+	'sap/ui/core/date/UI5Date',
+	'sap/ui/unified/calendar/RecurrenceUtils',
 	'sap/base/Log',
 	// side effect: required by RenderManager#icon
 	'sap/ui/core/IconPool'
@@ -28,6 +29,7 @@ sap.ui.define([
 		library,
 		InvisibleText,
 		UI5Date,
+		RecurrenceUtils,
 		Log
 	) {
 		"use strict";
@@ -264,6 +266,11 @@ sap.ui.define([
 	};
 
 	CalendarRowRenderer.renderInterval = function(oRm, oRow, iInterval, iWidth,  aIntervalHeaders, aNonWorkingItems, iStartOffset, iNonWorkingMax, aNonWorkingSubItems, iSubStartOffset, iNonWorkingSubMax, bFirstOfType, bLastOfType){
+		const oStartDateInterval = oRow.getStartDate();
+		const oEndDate = UI5Date.getInstance(oRow.getStartDate());
+		oEndDate.setDate(oEndDate.getDate() + 1);
+		const oCellStartDate = UI5Date.getInstance(oStartDateInterval);
+		oCellStartDate.setHours(iInterval + iStartOffset);
 
 		var sId = oRow.getId() + "-AppsInt" + iInterval;
 		var i;
@@ -271,6 +278,17 @@ sap.ui.define([
 		var iMonth = oRow.getStartDate().getMonth();
 		var iDaysLength = UI5Date.getInstance(oRow.getStartDate().getFullYear(), iMonth + 1, 0).getDate();
 
+		const aFilteredNonWorkingRange = oRow.getIntervalType() !== CalendarIntervalType.Hour ?
+			[] :
+			oRow.getNonWorkingPeriods().filter((oPeriod) => {
+				const hasOccurrenceOnDate = RecurrenceUtils.hasOccurrenceOnDate.bind(oPeriod);
+				return hasOccurrenceOnDate(oStartDateInterval);
+			});
+
+		const aFilteredItemsForCurrentHours = aFilteredNonWorkingRange.filter((oPeriod) => {
+			return oPeriod.hasNonWorkingAtHour(oCellStartDate);
+		});
+
 		oRm.openStart("div", sId);
 		oRm.class("sapUiCalendarRowAppsInt");
 		oRm.style("width", iWidth + "%");
@@ -298,6 +316,16 @@ sap.ui.define([
 		this.writeCustomAttributes(oRm, oRow);
 		oRm.openEnd(); // div element
 
+		if (aFilteredItemsForCurrentHours.length) {
+			RecurrenceUtils.getWorkingAndNonWorkingSegments(oCellStartDate, aFilteredItemsForCurrentHours).forEach((oHourParts) => {
+				if (oHourParts.type === "working") {
+					this.renderWorkingParts(oRm, oHourParts.duration);
+				} else {
+					this.renderNonWorkingParts(oRm, oHourParts.duration);
+				}
+			});
+		}
+
 		if (bShowIntervalHeaders) {
 			oRm.openStart("div");
 			oRm.class("sapUiCalendarRowAppsIntHead");
@@ -508,9 +536,14 @@ sap.ui.define([
 		var sIcon = oAppointment.getIcon();
 		var sId = oAppointment.getId();
 		var bReducedHeight = oRow._getAppointmentReducedHeight(oAppointmentInfo);
+		var bAppointmentSelected = oAppointment.getSelected();
 		var mAccProps = {
 			role: "listitem",
-			labelledby: {value: InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT") + " " + sId + "-Descr", append: true},
+			labelledby: {
+				value: `${InvisibleText.getStaticId("sap.m", "ACC_CTR_TYPE_LISTITEM")} ${InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT")} ${sId.concat("-Descr")}`,
+				append: true
+			},
+			describedby: {value: bAppointmentSelected ? InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT_SELECTED") : "", append: true},
 			selected: null
 		};
 		var iRowCount = oRow._getAppointmentRowCount(oAppointmentInfo, bReducedHeight);
@@ -532,11 +565,9 @@ sap.ui.define([
 		oRm.openStart("div", oAppointment);
 		oRm.class("sapUiCalendarApp");
 		oRm.class("sapUiCalendarAppHeight" + iRowCount);
-		if (oAppointment.getSelected()) {
+
+		if (bAppointmentSelected) {
 			oRm.class("sapUiCalendarAppSel");
-			mAccProps["labelledby"].value = InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT_SELECTED") + " " + mAccProps["labelledby"].value;
-		} else {
-			mAccProps["labelledby"].value = InvisibleText.getStaticId("sap.ui.unified", "APPOINTMENT_UNSELECTED") + " " + mAccProps["labelledby"].value;
 		}
 
 		if (oAppointment.getTentative()) {
@@ -878,6 +909,29 @@ sap.ui.define([
 		return aResult;
 	};
 
+	CalendarRowRenderer.renderWorkingParts = function (oRm, iDuration){
+		const iWidth = iDuration / 60 * 100;
+
+		oRm.openStart("div");
+		oRm.style("width", `${iWidth}%`);
+		oRm.style("height", "inherit" );
+		oRm.style("display","inline-block");
+		oRm.openEnd();
+		oRm.close("div");
+	};
+
+	CalendarRowRenderer.renderNonWorkingParts = function (oRm, iDuration){
+		const iWidth = iDuration / 60 * 100;
+
+		oRm.openStart("div");
+		oRm.style("width", `${iWidth}%`);
+		oRm.class("sapUiCalendarRowAppsNoWork");
+		oRm.style("height", "inherit" );
+		oRm.style("display","inline-block");
+		oRm.openEnd();
+		oRm.close("div");
+	};
+
 	/**
 	 * Retrieves text for given CalendarDayType based on given type and legend items.
 	 * @param {sap.ui.unified.CalendarDayType} sType the type to obtain information about

package/src/sap/ui/unified/CalendarTimeInterval.js

@@ -72,7 +72,7 @@ sap.ui.define([
 	 * @class
 	 * Calendar with granularity of time items displayed in one line.
 	 * @extends sap.ui.core.Control
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/CalendarWeekInterval.js

@@ -39,7 +39,7 @@ sap.ui.define(['sap/ui/unified/calendar/CalendarUtils', 'sap/ui/unified/calendar
 		 * its start date to the first date of the same week as the date the user chose.
 		 *
 		 * @extends sap.ui.unified.CalendarDateInterval
-		 * @version 1.126.1
+		 * @version 1.128.0
 		 *
 		 * @constructor
 		 * @private

package/src/sap/ui/unified/ColorPicker.js

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

package/src/sap/ui/unified/ColorPickerPopover.js

@@ -49,7 +49,7 @@ sap.ui.define([
 		 * A thin wrapper over {@link sap.ui.unified.ColorPicker} allowing the latter to be used in a popover.
 		 *
 		 * @extends sap.ui.core.Control
-		 * @version 1.126.1
+		 * @version 1.128.0
 		 *
 		 * @constructor
 		 * @public

package/src/sap/ui/unified/ContentSwitcher.js

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

package/src/sap/ui/unified/Currency.js

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

package/src/sap/ui/unified/CurrencyRenderer.js

@@ -14,7 +14,7 @@ sap.ui.define(["sap/m/library", "sap/ui/core/Lib"],
 	/**
 	 * Currency renderer.
 	 *
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 * @namespace
 	 */
 	var CurrencyRenderer = {

package/src/sap/ui/unified/DateRange.js

@@ -20,7 +20,7 @@ sap.ui.define(['sap/ui/core/Element', './library', 'sap/ui/unified/calendar/Cale
 	 * @class
 	 * Date range for use in DatePicker
 	 * @extends sap.ui.core.Element
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/DateTypeRange.js

@@ -25,7 +25,7 @@ sap.ui.define(['./DateRange', './library'],
 	 * @class
 	 * Date range with calendar day type information. Used to visualize special days in the Calendar.
 	 * @extends sap.ui.unified.DateRange
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/FileUploader.js

@@ -73,7 +73,7 @@ sap.ui.define([
 	 * @implements sap.ui.core.IFormContent, sap.ui.unified.IProcessableBlobs
 	 *
 	 * @author SAP SE
-	 * @version 1.126.1
+	 * @version 1.128.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/ui/unified/FileUploaderParameter.js

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

package/src/sap/ui/unified/FileUploaderXHRSettings.js

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