@openui5/sap.m 1.138.0 → 1.139.0

package/src/sap/m/PlanningCalendar.js

@@ -208,7 +208,7 @@ sap.ui.define([
 	 * {@link sap.m.PlanningCalendarView PlanningCalendarView}'s properties.
 	 *
 	 * @extends sap.ui.core.Control
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @public
@@ -983,10 +983,50 @@ sap.ui.define([
 
 		updateSelectedRows.call(this);
 
-		var bMultiSelect = this.getMultipleAppointmentsSelection();
+		this._setProperties();
+	};
+
+	PlanningCalendar.prototype._setProperties = function() {
+		//overriden setters
+		const bMultiSelect = this.getMultipleAppointmentsSelection(),
+			sIconShape = this.getIconShape(),
+			oStartDate = this.getStartDate(),
+			sAppointmentHeight = this.getAppointmentHeight(),
+			sAppointmentRoundWidth = this.getAppointmentRoundWidth(),
+			bShowIntervalHeaders = this.getShowIntervalHeaders(),
+			bShowEmptyIntervalHeaders = this.getShowEmptyIntervalHeaders(),
+			sAppointmentsVisualization = this.getAppointmentsVisualization(),
+			oGroupAppointmentsMode = this.getGroupAppointmentsMode(),
+			bAppointmentsReducedHeight = this.getAppointmentsReducedHeight(),
+			vLegend = this.getLegend();
 		this.getRows().forEach(function (oRow) {
-			getRowTimeline(oRow).setMultipleAppointmentsSelection(bMultiSelect);
+			const oCurrentRowHeader = getRowHeader(oRow),
+				oRowTimeline = getRowTimeline(oRow);
+			if (oCurrentRowHeader.getAvatar) {
+				oCurrentRowHeader.getAvatar().setDisplayShape(sIconShape);
+			}
+			oRowTimeline.setMultipleAppointmentsSelection(bMultiSelect);
+			oRowTimeline.setStartDate(oStartDate);
+			oRowTimeline.setAppointmentHeight(sAppointmentHeight);
+			oRowTimeline.setAppointmentRoundWidth(sAppointmentRoundWidth);
+			oRowTimeline.setShowIntervalHeaders(bShowIntervalHeaders);
+			oRowTimeline.setShowEmptyIntervalHeaders(bShowEmptyIntervalHeaders);
+			oRowTimeline.setAppointmentsVisualization(sAppointmentsVisualization);
+			oRowTimeline.setGroupAppointmentsMode(oGroupAppointmentsMode);
+			oRowTimeline.setAppointmentsReducedHeight(bAppointmentsReducedHeight);
+			oRowTimeline.setLegend(vLegend);
 		});
+
+		this._setPrimaryCalendarType();
+		this._setSecondaryCalendarType();
+		this._setFirstDayOfWeek();
+		this._setCalendarWeekNumbering();
+		this._setShowWeekNumbers();
+		this._setShowRowHeaders();
+		this._setShowDayNamesLine();
+		this._setStickyHeader();
+		this._setNoDataText();
+		this._setLegend(vLegend);
 	};
 
 	PlanningCalendar.prototype._bindAggregation = function(sName, oBindingInfo) {
@@ -1030,19 +1070,6 @@ sap.ui.define([
 		return this;
 	};
 
-	PlanningCalendar.prototype.setIconShape = function (sIconShape) {
-		this.setProperty("iconShape", sIconShape);
-
-		this.getRows().forEach(function (oRow) {
-			var oCurrentRowHeader = getRowHeader(oRow);
-			if (oCurrentRowHeader.getAvatar) {
-				oCurrentRowHeader.getAvatar().setDisplayShape(sIconShape);
-			}
-		});
-
-		return this;
-	};
-
 	PlanningCalendar.prototype.detachEvent = function (eventId, functionToCall, listener) {
 		Control.prototype.detachEvent.call(this, eventId, functionToCall, listener);
 		if (!this.hasListeners("intervalSelect")) {
@@ -1371,6 +1398,7 @@ sap.ui.define([
 		if (this.hasListeners("intervalSelect")) {
 			oInterval._setAriaRole("columnheader"); // set new aria role
 		} else {
+			oInterval.setProperty("selectableAccessibilitySemantics", false);
 			oInterval._setAriaRole("gridcell"); // set new aria role
 		}
 	};
@@ -1471,24 +1499,14 @@ sap.ui.define([
 	};
 
 	PlanningCalendar.prototype.addToolbarContent = function(oContent) {
-		if (oContent && oContent.isA("sap.m.Title")) {
-			this._observeHeaderTitleText(oContent);
-			this._getHeader().setTitle(oContent.getText());
-			oContent.setVisible(false);
-			this.addAriaLabelledBy(oContent.getId());
-		}
+		this._prepareHeaderTitle(oContent);
 		this.addAggregation("toolbarContent", oContent);
 
 		return this;
 	 };
 
 	PlanningCalendar.prototype.insertToolbarContent = function(oContent, iIndex) {
-		if (oContent && oContent.isA("sap.m.Title")) {
-			this._observeHeaderTitleText(oContent);
-			this._getHeader().setTitle(oContent.getText());
-			oContent.setVisible(false);
-			this.addAriaLabelledBy(oContent.getId());
-		}
+		this._prepareHeaderTitle(oContent);
 		this.insertAggregation("toolbarContent", oContent, iIndex);
 
 		return this;
@@ -1546,6 +1564,21 @@ sap.ui.define([
 		});
 	};
 
+	PlanningCalendar.prototype._prepareHeaderTitle = function (oTitle) {
+		if (oTitle && oTitle.isA("sap.m.Title")) {
+			this._observeHeaderTitleText(oTitle);
+			const oHeader = this._getHeader(),
+				sLabel = `${this._getHeader().getId()}-Title`,
+				oLevel = oTitle.getLevel(),
+				oTitleStyle = oTitle.getTitleStyle();
+			oHeader.setTitle(oTitle.getText());
+			oHeader.setLevel(oLevel);
+			oHeader.setTitleStyle(oTitleStyle);
+			oTitle.setVisible(false);
+			this.addAriaLabelledBy(sLabel);
+		}
+	};
+
 	 PlanningCalendar.prototype._handleTitleTextChange = function (oChanges) {
 		this._getHeader().setTitle(oChanges.current);
 	};
@@ -1684,12 +1717,11 @@ sap.ui.define([
 
 	/**
 	 * Sets the primaryCalendarType. If not set, the calendar type of the global configuration is used.
-	 * @param {module:sap/base/i18n/date/CalendarType} sPrimaryCalendarType the <code>CalendarType</code> to set as <code>sap.m.PlanningCalendar</code> <code>primaryCalendarType</code>.
-	 * @returns {this} <code>this</code> to allow method chaining
-	 * @public
+	 * @returns {void}
+	 * @private
 	 */
-	 PlanningCalendar.prototype.setPrimaryCalendarType = function(sPrimaryCalendarType) {
-		this.setProperty("primaryCalendarType", sPrimaryCalendarType);
+	 PlanningCalendar.prototype._setPrimaryCalendarType = function() {
+		var sPrimaryCalendarType = this._getPrimaryCalendarType();
 
 		if (this._getHeader()) {
 			this._getHeader().setProperty("_primaryCalendarType", sPrimaryCalendarType);
@@ -1709,8 +1741,6 @@ sap.ui.define([
 		if (this._oOneMonthsRow) {
 			this._oOneMonthsRow.setPrimaryCalendarType(sPrimaryCalendarType);
 		}
-
-		return this;
 	};
 
 	PlanningCalendar.prototype._getSecondaryCalendarType = function() {
@@ -1725,12 +1755,11 @@ sap.ui.define([
 
 	/**
 	 * Sets the secondaryCalendarType.
-	 * @param {module:sap/base/i18n/date/CalendarType} sSecondaryCalendarType the <code>CalendarType</code> to set as <code>sap.m.PlanningCalendar</code> <code>secondaryCalendarType</code>.
-	 * @returns {this} <code>this</code> to allow method chaining
-	 * @public
+	 * @returns {void}
+	 * @private
 	 */
-	PlanningCalendar.prototype.setSecondaryCalendarType = function (sSecondaryCalendarType) {
-		this.setProperty("secondaryCalendarType", sSecondaryCalendarType);
+	PlanningCalendar.prototype._setSecondaryCalendarType = function () {
+		var sSecondaryCalendarType = this._getSecondaryCalendarType();
 
 		if (this._getHeader()) {
 			this._getHeader().setProperty("_secondaryCalendarType", sSecondaryCalendarType);
@@ -1750,8 +1779,6 @@ sap.ui.define([
 		if (this._oOneMonthsRow) {
 			this._oOneMonthsRow.setSecondaryCalendarType(sSecondaryCalendarType);
 		}
-
-		return this;
 	};
 
 	/**
@@ -1936,22 +1963,18 @@ sap.ui.define([
 
 	};
 
-	PlanningCalendar.prototype.setCalendarWeekNumbering = function(sCalendarWeekNumbering) {
-		var oHeader = this._getHeader(),
+	PlanningCalendar.prototype._setCalendarWeekNumbering = function() {
+		var sCalendarWeekNumbering = this.getCalendarWeekNumbering(),
+			oHeader = this._getHeader(),
 			oCalendarPicker = oHeader._oPopup && oHeader._oPopup.getContent()[0],
 			key;
 
-		this.setProperty("calendarWeekNumbering", sCalendarWeekNumbering);
-
 		this._updateWeekConfiguration();
 		oHeader.setCalendarWeekNumbering(sCalendarWeekNumbering);
 		oCalendarPicker && oCalendarPicker.setCalendarWeekNumbering(sCalendarWeekNumbering);
 		for (key in INTERVAL_METADATA) {
 			this[INTERVAL_METADATA[key].sInstanceName] && this[INTERVAL_METADATA[key].sInstanceName].setCalendarWeekNumbering(sCalendarWeekNumbering);
 		}
-		this.setStartDate(this.getStartDate());
-
-		return this;
 	};
 
 	PlanningCalendar.prototype.removeIntervalInstanceFromInfoToolbar = function () {
@@ -2249,22 +2272,25 @@ sap.ui.define([
 
 	};
 
-	PlanningCalendar.prototype.setFirstDayOfWeek = function (iFirstDayOfWeek) {
+	PlanningCalendar.prototype._setFirstDayOfWeek = function () {
+		const iFirstDayOfWeek = this.getFirstDayOfWeek();
 		if (iFirstDayOfWeek < -1 || iFirstDayOfWeek > 6) {
 			Log.error("" + iFirstDayOfWeek + " is not a valid value to the property firstDayOfWeek. Valid values are from -1 to 6.");
 			return;
 		}
-		var sCurrentPickerId = this._getHeader().getAssociation("currentPicker"),
+		const sCurrentPickerId = this._getHeader().getAssociation("currentPicker"),
 			oPicker = Element.getElementById(sCurrentPickerId),
 			sViewKey = this.getViewKey(),
 			oDateNav = this._dateNav,
 			oPCStart = oDateNav.getStart(),
 			iOldFirstDayOfWeek = this.getStartDate().getDay(),
-			bOneMonthViewOnSmallScreen = sViewKey === PlanningCalendarBuiltInView.OneMonth && this._iSize < 2,
-			iResultFirstDayOfWeek = iFirstDayOfWeek,
+			bOneMonthViewOnSmallScreen = sViewKey === PlanningCalendarBuiltInView.OneMonth && this._iSize < 2;
+		let	iResultFirstDayOfWeek = iFirstDayOfWeek,
 			oRow, oFirstUTCDateOfWeek, oFirstLocalDateOfWeek;
 
-		oPicker.setFirstDayOfWeek(iFirstDayOfWeek);
+		if (oPicker.setFirstDayOfWeek) {
+			oPicker.setFirstDayOfWeek(iFirstDayOfWeek);
+		}
 
 		if (sViewKey === PlanningCalendarBuiltInView.Week || bOneMonthViewOnSmallScreen) {
 			oRow = this.getAggregation("table").getInfoToolbar().getContent()[1];
@@ -2285,10 +2311,7 @@ sap.ui.define([
 			}.bind(this));
 		}
 
-		this.setProperty("firstDayOfWeek", iFirstDayOfWeek);
 		this._updateWeekConfiguration();
-
-		return this;
 	};
 
 	PlanningCalendar.prototype._updateWeekConfiguration = function() {
@@ -2526,8 +2549,8 @@ sap.ui.define([
 		return oInterval;
 	};
 
-	PlanningCalendar.prototype.setShowWeekNumbers = function (bValue) {
-		this.setProperty("showWeekNumbers", bValue, true);
+	PlanningCalendar.prototype._setShowWeekNumbers = function () {
+		const bShowWeekNumbers = this.getShowWeekNumbers();
 
 		this._getViews().forEach(function(oView) {
 			var sViewKey = oView.getKey(),
@@ -2535,131 +2558,22 @@ sap.ui.define([
 				oInterval = this._getRowInstanceByViewKey(sViewKey);
 
 			if (oInterval && bViewAllowsWeekNumbers) {
-				oInterval.setShowWeekNumbers(bValue);
+				oInterval.setShowWeekNumbers(bShowWeekNumbers);
 			}
 
 			//update the pc header classes if needed
 			if (this.getDomRef() && this.getViewKey() === sViewKey) {
-				adaptCalHeaderForWeekNumbers.call(this, bValue, bViewAllowsWeekNumbers);
+				adaptCalHeaderForWeekNumbers.call(this, bShowWeekNumbers, bViewAllowsWeekNumbers);
 			}
 		}, this);
-
-		return this;
 	};
 
-	PlanningCalendar.prototype.setShowIntervalHeaders = function(bShowIntervalHeaders){
-
-		this.setProperty("showIntervalHeaders", bShowIntervalHeaders, true);
-
-		var aRows = this.getRows();
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setShowIntervalHeaders(bShowIntervalHeaders);
-		}
-
-		return this;
-
-	};
-
-	PlanningCalendar.prototype.setShowEmptyIntervalHeaders = function(bShowEmptyIntervalHeaders){
-
-		this.setProperty("showEmptyIntervalHeaders", bShowEmptyIntervalHeaders, true);
-
-		var aRows = this.getRows();
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setShowEmptyIntervalHeaders(bShowEmptyIntervalHeaders);
-		}
-
-		return this;
-
-	};
-
-	PlanningCalendar.prototype.setGroupAppointmentsMode = function (bGroupAppointmentsMode) {
-
-		this.setProperty("groupAppointmentsMode", bGroupAppointmentsMode, true);
-
-		var aRows = this.getRows();
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setGroupAppointmentsMode(bGroupAppointmentsMode);
-		}
-
-		return this;
-	};
-
-
-	/**
-	 * Set the appointment reduced height property to the appointments in the calendar
-	 * @param {boolean} bAppointmentsReducedHeight - if set to true, the appointments will have a reduced height
-	 * @returns {this} Reference to <code>this</code> for method chaining
-	 * @public
-	 * @deprecated Since version 1.119. Please use the <code>appointmentHeight</code> with value "Automatic" property instead.
-	 */
-	PlanningCalendar.prototype.setAppointmentsReducedHeight = function(bAppointmentsReducedHeight){
-
-		this.setProperty("appointmentsReducedHeight", bAppointmentsReducedHeight, true);
-
-		var aRows = this.getRows();
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setAppointmentsReducedHeight(bAppointmentsReducedHeight);
-		}
-
-		return this;
-
-	};
-
-	PlanningCalendar.prototype.setAppointmentHeight = function(sAppointmentHeight) {
-		var aRows = this.getRows(),
-			i;
-
-		this.setProperty("appointmentHeight", sAppointmentHeight);
-		for (i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setAppointmentHeight(sAppointmentHeight);
-		}
-
-		return this;
-	};
-
-	PlanningCalendar.prototype.setAppointmentRoundWidth = function(sAppointmentRoundWidth) {
-		var aRows = this.getRows(),
-			i;
-		this.setProperty("appointmentRoundWidth", sAppointmentRoundWidth);
-		for (i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setAppointmentRoundWidth(sAppointmentRoundWidth);
-		}
-
-		return this;
-	};
-
-	PlanningCalendar.prototype.setAppointmentsVisualization = function(sAppointmentsVisualization){
-
-		this.setProperty("appointmentsVisualization", sAppointmentsVisualization, true);
-
-		var aRows = this.getRows();
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setAppointmentsVisualization(sAppointmentsVisualization);
-		}
-
-		return this;
-
-	};
-
-	PlanningCalendar.prototype.setShowRowHeaders = function(bShowRowHeaders){
-
-		if (this.getShowRowHeaders() === bShowRowHeaders) {
-			return this;
-		}
+	PlanningCalendar.prototype._setShowRowHeaders = function(){
+		const bShowRowHeaders = this.getShowRowHeaders();
 
 		// set header column to invisible as each row is a ColumnListItem with two columns
 		// removing the column would need to change every row
 
-		this.setProperty("showRowHeaders", bShowRowHeaders, true);
-
 		var oTable = this.getAggregation("table"),
 			oRowHeader, oRowTimeline;
 
@@ -2685,13 +2599,14 @@ sap.ui.define([
 
 	};
 
-	PlanningCalendar.prototype.setShowDayNamesLine = function(bShowDayNamesLine){
+	PlanningCalendar.prototype._setShowDayNamesLine = function(){
 
 		var intervalMetadata,
 			sInstanceName,
 			oCalDateInterval,
 			bRendered = !!this.getDomRef(),
-			sCurrentViewKey = this.getViewKey();
+			sCurrentViewKey = this.getViewKey(),
+			bShowDayNamesLine = this.getShowDayNamesLine();
 
 		for (intervalMetadata in  INTERVAL_METADATA) {
 			sInstanceName = INTERVAL_METADATA[intervalMetadata].sInstanceName;
@@ -2704,24 +2619,16 @@ sap.ui.define([
 				}
 			}
 		}
-
-		return this.setProperty("showDayNamesLine", bShowDayNamesLine, false);
-
 	};
 
 	/**
 	 * Sets the stickyHeader property.
-	 * @override
-	 * @public
-	 * @param {boolean} bStick Whether the header area will remain visible (fixed on top)
+	 * @private
 	 * @returns {this} this pointer for chaining
 	 */
-	PlanningCalendar.prototype.setStickyHeader = function(bStick) {
-		if (this.getStickyHeader() === bStick) {
-			return this;
-		}
+	PlanningCalendar.prototype._setStickyHeader = function() {
+		const bStick = this.getStickyHeader();
 
-		this.setProperty("stickyHeader", bStick, true);
 		if (Device.system.phone) {
 			if (bStick) {
 				Device.orientation.attachHandler(this._updateStickyHeader, this);
@@ -2730,8 +2637,6 @@ sap.ui.define([
 			}
 		}
 		this._updateStickyHeader();
-
-		return this;
 	};
 
 	PlanningCalendar.prototype._updateStickyHeader = function() {
@@ -2850,7 +2755,6 @@ sap.ui.define([
 
 	};
 
-
 	PlanningCalendar.prototype.setSingleSelection = function(bSingleSelection) {
 
 		this.setProperty("singleSelection", bSingleSelection, true);
@@ -2870,29 +2774,15 @@ sap.ui.define([
 
 	};
 
-	PlanningCalendar.prototype.setNoDataText = function(sNoDataText) {
-
-		this.setProperty("noDataText", sNoDataText, true);
-
-		var oTable = this.getAggregation("table");
+	PlanningCalendar.prototype._setNoDataText = function() {
+		const sNoDataText = this.getNoDataText(),
+			oTable = this.getAggregation("table");
 		oTable.setNoDataText(sNoDataText);
-
-		return this;
-
 	};
 
-	PlanningCalendar.prototype.setLegend = function(vLegend){
-
-		this.setAssociation("legend", vLegend, true);
-
-		var aRows = this.getRows(),
-			oLegend = this.getLegend() && Element.getElementById(this.getLegend()),
-			oLegendDestroyObserver;
-
-		for (var i = 0; i < aRows.length; i++) {
-			var oRow = aRows[i];
-			getRowTimeline(oRow).setLegend(vLegend);
-		}
+	PlanningCalendar.prototype._setLegend = function(vLegend){
+		const oLegendAssociation = vLegend && Element.getElementById(vLegend);
+		let oLegendDestroyObserver;
 
 		INTERVAL_CTR_REFERENCES.forEach(function (sControlRef) {
 			if (this[sControlRef]) {
@@ -2900,16 +2790,14 @@ sap.ui.define([
 			}
 		}, this);
 
-		if (oLegend) { //destroy of the associated legend should rerender the PlanningCalendar
+		if (oLegendAssociation) { //destroy of the associated legend should rerender the PlanningCalendar
 			oLegendDestroyObserver = new ManagedObjectObserver(function(oChanges) {
 				this.invalidate();
 			}.bind(this));
-			oLegendDestroyObserver.observe(oLegend, {
+			oLegendDestroyObserver.observe(oLegendAssociation, {
 				destroy: true
 			});
 		}
-
-		return this;
 	};
 
 	PlanningCalendar.prototype.addAriaLabelledBy = function(sId) {
@@ -3848,23 +3736,6 @@ sap.ui.define([
 		return this;
 	};
 
-	/**
-	 * Sets the width property and ensures that the start date is in sync with each row timeline.
-	 *
-	 * @param {sap.ui.core.CSSSize} sWidth the width to be set to the PlanningCalendar
-	 * @returns {this} this for method chaining
-	 * @public
-	 */
-	PlanningCalendar.prototype.setWidth = function (sWidth) {
-		var oStartDate = this.getStartDate();
-
-		this.getRows().forEach(function (oRow) {
-			getRowTimeline(oRow).setStartDate(oStartDate);
-		});
-
-		return this.setProperty("width", sWidth);
-	};
-
 	/**
 	 * Getter for custom appointments sorter (if any).
 	 * @since 1.54

package/src/sap/m/PlanningCalendarHeader.js

@@ -64,6 +64,10 @@ function(
 	// shortcut for sap.m.ToolbarDesign
 	var ToolbarDesign = library.ToolbarDesign;
 
+	// shortcut for sap.ui.core.TitleLevel
+	var TitleLevel = coreLibrary.TitleLevel;
+
+
 	/**
 	 * Constructor for a new <code>PlanningCalendarHeader</code>.
 	 *
@@ -102,7 +106,7 @@ function(
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @private
@@ -146,6 +150,24 @@ function(
 				 */
 				calendarWeekNumbering : { type : "sap.base.i18n.date.CalendarWeekNumbering", group : "Appearance", defaultValue: null},
 
+				/**
+				 * Defines the semantic level of the title.
+				 * This information is e.g. used by assistive technologies like screenreaders to create a hierarchical site map for faster navigation.
+				 * Depending on this setting either an HTML h1-h6 element is used or when using level <code>Auto</code> no explicit level information is written (HTML5 header element).
+				 * This property does not influence the style of the control. Use the property <code>titleStyle</code> for this purpose instead.
+				 *
+				 * <b>Note:</b> this property will be overridden if there is title element associated and it has <code>level</code> property set.
+				 */
+				level : {type : "sap.ui.core.TitleLevel", group : "Appearance", defaultValue : TitleLevel.Auto},
+
+				/**
+				 * Defines the style of the title.
+				 * When using the <code>Auto</code> styling, the appearance of the title depends on the current position of the title (e.g. inside a <code>Toolbar</code>).
+				 * This default behavior can be overridden by setting a different style explicitly.
+				 * The actual appearance of the title and the different styles always depends on the theme being used.
+				 */
+				titleStyle : {type : "sap.ui.core.TitleLevel", group : "Appearance", defaultValue : TitleLevel.Auto},
+
 				/**
 				 * If set, the calendar type is used for display.
 				 * If not set, the calendar type of the global configuration is used.
@@ -405,9 +427,6 @@ function(
 	PlanningCalendarHeader.prototype.exit = function () {
 		this._getActionsToolbar().removeAllContent();
 		if (this._oTitle) {
-			if (this._oToolbarAfterRenderingDelegate) {
-				this._oTitle.removeDelegate(this._oToolbarAfterRenderingDelegate);
-			}
 			this._oTitle.destroy();
 			this._oTitle = null;
 		}
@@ -450,23 +469,24 @@ function(
 	PlanningCalendarHeader.prototype.setTitle = function (sTitle) {
 		const oInnerTitle = this._getOrCreateTitleControl();
 		oInnerTitle.setText(sTitle).setVisible(!!sTitle);
-		if (this._oToolbarAfterRenderingDelegate) {
-			oInnerTitle.removeDelegate(this._oToolbarAfterRenderingDelegate);
-		}
-		this._oToolbarAfterRenderingDelegate = {
-			onAfterRendering: function () {
-				const oTitle = this.getActions().find((oAction) => oAction.isA("sap.m.Title"));
-				const oTitleDomRef = this.getDomRef().querySelector(`[data-sap-ui='${oInnerTitle.getId()}']`);
-				if (oTitle && oTitleDomRef) {
-					oTitleDomRef.setAttribute("id", oTitle.getId());
-				}
-			}
-		};
 
-		oInnerTitle.addDelegate(this._oToolbarAfterRenderingDelegate, this);
 		return this.setProperty("title", sTitle);
 	};
 
+	PlanningCalendarHeader.prototype.setLevel = function (eLevel) {
+		const oInnerTitle = this._getOrCreateTitleControl();
+		oInnerTitle.setLevel(eLevel);
+
+		return this.setProperty("level", eLevel);
+	};
+
+	PlanningCalendarHeader.prototype.setTitleStyle = function (eTitleStyle) {
+		const oInnerTitle = this._getOrCreateTitleControl();
+		oInnerTitle.setTitleStyle(eTitleStyle);
+
+		return this.setProperty("titleStyle", eTitleStyle);
+	};
+
 	PlanningCalendarHeader.prototype.addAction = function (oAction) {
 		if (!oAction) {
 			return this;

package/src/sap/m/PlanningCalendarLegend.js

@@ -23,7 +23,7 @@ sap.ui.define(["sap/ui/core/Lib", 'sap/ui/unified/CalendarLegend', 'sap/ui/unifi
 		 * @extends sap.ui.unified.CalendarLegend
 		 *
 		 * @author SAP SE
-		 * @version 1.138.0
+		 * @version 1.139.0
 		 *
 		 * @constructor
 		 * @public

package/src/sap/m/PlanningCalendarRow.js

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * The <code>sap.m.PlanningCalendarRow</code> allows you to modify appointments at row level.
 	 *
 	 * @extends sap.ui.core.Element
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/PlanningCalendarView.js

@@ -25,7 +25,7 @@ sap.ui.define(['sap/ui/core/Element', './library', 'sap/ui/unified/library'],
 	 * The <code>PlanningCalendarView</code> defines the type of the intervals (hours, days, months)
 	 * and how many intervals are displayed.
 	 * @extends sap.ui.core.Element
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/Popover.js

@@ -121,7 +121,7 @@ sap.ui.define([
 		* @extends sap.ui.core.Control
 		* @implements sap.ui.core.PopupInterface
 		* @author SAP SE
-		* @version 1.138.0
+		* @version 1.139.0
 		*
 		* @public
 		* @alias sap.m.Popover

package/src/sap/m/ProgressIndicator.js

@@ -61,7 +61,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @public

package/src/sap/m/PullToRefresh.js

@@ -37,7 +37,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.138.0
+	 * @version 1.139.0
 	 *
 	 * @constructor
 	 * @public