@openui5/sap.ui.integration 1.113.0 → 1.115.0

package/src/sap/ui/integration/designtime/cardEditor/i18n/i18n_uk.properties

@@ -225,6 +225,8 @@ CARD_EDITOR.PARAMETERS.EDITABLE=\u0417 \u043C\u043E\u0436\u043B\u0438\u0432\u045
 
 CARD_EDITOR.PARAMETERS.EDITABLETOUSER=\u0417 \u043C\u043E\u0436\u043B\u0438\u0432\u0456\u0441\u0442\u044E \u0440\u0435\u0434\u0430\u0433\u0443\u0432\u0430\u043D\u043D\u044F \u0434\u043B\u044F \u043A\u043E\u0440\u0438\u0441\u0442\u0443\u0432\u0430\u0447\u0430
 
+CARD_EDITOR.PARAMETERS.MAXLENGTH=Max Length
+
 CARD_EDITOR.PARAMETERS.REQUIRED=\u041D\u0435\u043E\u0431\u0445\u0456\u0434\u043D\u0435
 
 CARD_EDITOR.PARAMETERS.EXPANDED=\u0420\u043E\u0437\u0433\u043E\u0440\u043D\u0443\u0442\u043E

package/src/sap/ui/integration/designtime/cardEditor/i18n/i18n_vi.properties

@@ -225,6 +225,8 @@ CARD_EDITOR.PARAMETERS.EDITABLE=Co\u0301 th\u00EA\u0309 hi\u00EA\u0323u chi\u030
 
 CARD_EDITOR.PARAMETERS.EDITABLETOUSER=Co\u0301 th\u00EA\u0309 hi\u00EA\u0323u chi\u0309nh \u0111\u00F4\u0301i v\u01A1\u0301i ng\u01B0\u01A1\u0300i du\u0300ng
 
+CARD_EDITOR.PARAMETERS.MAXLENGTH=Max Length
+
 CARD_EDITOR.PARAMETERS.REQUIRED=\u0110\u01B0\u01A1\u0323c y\u00EAu c\u00E2\u0300u
 
 CARD_EDITOR.PARAMETERS.EXPANDED=\u0110\u01B0\u01A1\u0323c m\u01A1\u0309 r\u00F4\u0323ng

package/src/sap/ui/integration/designtime/cardEditor/i18n/i18n_zh_CN.properties

@@ -225,6 +225,8 @@ CARD_EDITOR.PARAMETERS.EDITABLE=\u5BF9\u7BA1\u7406\u5458\u53EF\u7F16\u8F91
 
 CARD_EDITOR.PARAMETERS.EDITABLETOUSER=\u5BF9\u7528\u6237\u53EF\u7F16\u8F91
 
+CARD_EDITOR.PARAMETERS.MAXLENGTH=Max Length
+
 CARD_EDITOR.PARAMETERS.REQUIRED=\u5FC5\u9700
 
 CARD_EDITOR.PARAMETERS.EXPANDED=\u5DF2\u5C55\u5F00

package/src/sap/ui/integration/designtime/cardEditor/i18n/i18n_zh_TW.properties

@@ -225,6 +225,8 @@ CARD_EDITOR.PARAMETERS.EDITABLE=\u53EF\u4F9B\u7BA1\u7406\u54E1\u7DE8\u8F2F
 
 CARD_EDITOR.PARAMETERS.EDITABLETOUSER=\u53EF\u4F9B\u4F7F\u7528\u8005\u7DE8\u8F2F
 
+CARD_EDITOR.PARAMETERS.MAXLENGTH=Max Length
+
 CARD_EDITOR.PARAMETERS.REQUIRED=\u5FC5\u8981
 
 CARD_EDITOR.PARAMETERS.EXPANDED=\u5DF2\u5C55\u958B

package/src/sap/ui/integration/designtime/cardEditor/propertyEditor/complexMapEditor/ComplexMapEditor.js

@@ -55,7 +55,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.cardEditor.propertyEditor.complexMapEditor.ComplexMapEditor
 	 * @author SAP SE
 	 * @since 1.76
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @private
 	 * @experimental 1.76

package/src/sap/ui/integration/designtime/cardEditor/propertyEditor/destinationsEditor/DestinationsEditor.js

@@ -41,7 +41,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.cardEditor.propertyEditor.destinationsEditor.DestinationsEditor
 	 * @author SAP SE
 	 * @since 1.77
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @private
 	 * @experimental 1.77

package/src/sap/ui/integration/designtime/cardEditor/propertyEditor/filtersEditor/FiltersEditor.js

@@ -7,12 +7,12 @@ sap.ui.define([
 	"sap/ui/integration/designtime/baseEditor/propertyEditor/BasePropertyEditor",
 	"sap/ui/integration/designtime/cardEditor/propertyEditor/complexMapEditor/ComplexMapEditor",
 	"sap/base/util/restricted/_merge",
-	"sap/ui/integration/cards/filters/DateRangeFilter"
+	"sap/ui/integration/util/DateRangeHelper"
 ], function (
 	BasePropertyEditor,
 	ComplexMapEditor,
 	_merge,
-	DateRangeFilter
+	DateRangeHelper
 ) {
 	"use strict";
 
@@ -43,7 +43,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.cardEditor.propertyEditor.filtersEditor.FiltersEditor
 	 * @author SAP SE
 	 * @since 1.98
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @private
 	 * @experimental 1.97
@@ -208,8 +208,7 @@ sap.ui.define([
 	};
 
 	FiltersEditor.prototype.getAllDateRangeOptions = function() {
-		var dateRangeFilter = new DateRangeFilter();
-		var oOptions = dateRangeFilter.getOptions();
+		var oOptions = DateRangeHelper.getAllOptions();
 		var optionsArray = [];
 		for (var key in oOptions) {
 			if (oOptions.hasOwnProperty(key)) {

package/src/sap/ui/integration/designtime/cardEditor/propertyEditor/iconEditor/IconEditor.js

@@ -40,7 +40,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.cardEditor.propertyEditor.iconEditor.IconEditor
 	 * @author SAP SE
 	 * @since 1.81
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @private
 	 * @experimental 1.81

package/src/sap/ui/integration/designtime/cardEditor/propertyEditor/parametersEditor/ParametersEditor.js

@@ -43,7 +43,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.cardEditor.propertyEditor.parametersEditor.ParametersEditor
 	 * @author SAP SE
 	 * @since 1.70
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @private
 	 * @experimental 1.70
@@ -82,6 +82,7 @@ sap.ui.define([
 		var bVisibleToUser = this.getBoolenValue(oConfigValue.value.visibleToUser, vItemMetadata.visibleToUser, true);
 		var bEditable = this.getBoolenValue(oConfigValue.value.editable, vItemMetadata.editable, true);
 		var bEditableToUser = this.getBoolenValue(oConfigValue.value.editableToUser, vItemMetadata.editableToUser, true);
+		var iMaxLength = oConfigValue.value.maxLength || vItemMetadata.maxLength || 0;
 		var bRequired = this.getBoolenValue(oConfigValue.value.required, vItemMetadata.required, false);
 		var bExpanded = this.getBoolenValue(oConfigValue.value.expanded, vItemMetadata.expanded, true);
 		var sLevel = oConfigValue.value.level || vItemMetadata.level || "0";
@@ -234,6 +235,16 @@ sap.ui.define([
 				type: "boolean",
 				itemKey: sKey
 			},
+			{
+				label: this.getI18nProperty("CARD_EDITOR.PARAMETERS.MAXLENGTH"),
+				path: "maxLength",
+				allowBindings: true,
+				value: iMaxLength,
+				enabled: true,
+				visible: sType === "string",
+				type: "integer",
+				itemKey: sKey
+			},
 			{
 				label: this.getI18nProperty("CARD_EDITOR.PARAMETERS.REQUIRED"),
 				path: "required",

package/src/sap/ui/integration/designtime/editor/Card.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * @extends sap.ui.integration.widgets.Card
 	 *
 	 * @author SAP SE
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 * @private
 	 * @constructor
 	 * @since 1.112

package/src/sap/ui/integration/designtime/editor/CardEditor.js

@@ -50,7 +50,7 @@ sap.ui.define([
 	 * @extends sap.ui.integration.editor.Editor
 	 *
 	 * @author SAP SE
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 * @constructor
 	 * @see {@link topic:5b46b03f024542ba802d99d67bc1a3f4 Cards}
 	 * @since 1.83
@@ -142,7 +142,7 @@ sap.ui.define([
 				if (!instance) { //not a card instance, but a string
 					//could be a card dom element id
 					var element = document.getElementById(vCardIdOrSettings);
-					if (element && element.tagName && element.tagName === "ui-integration-card") {
+					if (element && element.tagName && element.tagName.toUpperCase() === "ui-integration-card".toUpperCase()) {
 						instance = element._getControl();
 					}
 				}

package/src/sap/ui/integration/designtime/editor/CardPreview.js

@@ -30,7 +30,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.designtime.editor.CardPreview
 	 * @author SAP SE
 	 * @since 1.83.0
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 * @private
 	 * @experimental since 1.83.0
 	 * @ui5-restricted
@@ -107,9 +107,9 @@ sap.ui.define([
 					oRm.renderControl(oControl._getResizeToggleButton());
 				}
 				if (sPreviewPosition === "top" || sPreviewPosition === "bottom") {
-					document.body.style.setProperty("--sapUiIntegrationEditorPreviewWidth", oControl.getParentWidth());
-					document.body.style.setProperty("--sapUiIntegrationEditorPreviewHeight", oControl.getParentHeight());
+					document.body.style.setProperty("--sapUiIntegrationEditorPreviewWidth", oControl.getEditor().getWidth());
 				}
+				document.body.style.setProperty("--sapUiIntegrationEditorPreviewHeight", oControl.getEditor().getHeight());
 				oRm.close("div");
 			}
 		}
@@ -154,6 +154,7 @@ sap.ui.define([
 		Control.prototype.destroy.apply(this, arguments);
 		document.body.style.removeProperty("--sapUiIntegrationEditorPreviewWidth");
 		document.body.style.removeProperty("--sapUiIntegrationEditorPreviewHeight");
+		document.body.style.removeProperty("--sapUiIntegrationEditorPreviewCardHeight");
 	};
 
 	CardPreview.prototype.onAfterRendering = function () {
@@ -191,17 +192,22 @@ sap.ui.define([
 		}
 		if (oPreview) {
 			this.setAggregation("cardPreview", oPreview);
+			oPreview.removeStyleClass("sapUiIntegrationDTPreviewNoScale");
+			oPreview.removeStyleClass("sapUiIntegrationDTPreviewScaleBasic");
+			oPreview.removeStyleClass("withScale");
+			oPreview.removeStyleClass("withScaleSpec");
 			if (!this.getSettings().preview || this.getSettings().preview.scaled !== false) {
-				oPreview.removeStyleClass("sapUiIntegrationDTPreviewScale");
-				oPreview.removeStyleClass("sapUiIntegrationDTPreviewScaleSpec");
 				var sLanguge = Core.getConfiguration().getLanguage().replaceAll('_', '-');
 				if (this._getCurrentSize() !== "Full") {
+					oPreview.addStyleClass("sapUiIntegrationDTPreviewScaleBasic");
 					if (sLanguge.startsWith("ar") || sLanguge.startsWith("he")) {
 						// for the languages "ar-SA"(Arabic) and "he-IL"(Hebrew) which write from right to left, use spec style
-						oPreview.addStyleClass("sapUiIntegrationDTPreviewScaleSpec");
+						oPreview.addStyleClass("withScaleSpec");
 					} else {
-						oPreview.addStyleClass("sapUiIntegrationDTPreviewScale");
+						oPreview.addStyleClass("withScale");
 					}
+				} else {
+					oPreview.addStyleClass("sapUiIntegrationDTPreviewNoScale");
 				}
 			} else {
 				oPreview.addStyleClass("sapUiIntegrationDTPreviewNoScale");
@@ -229,6 +235,7 @@ sap.ui.define([
 	 * returns the real scaled instance of the card
 	 */
 	CardPreview.prototype._getCardRealPreview = function () {
+		var that = this;
 		if (!this._oCardPreview) {
 			var bReadonly = !this.getSettings().preview.interactive;
 			this._oCardPreview = new Card({
@@ -240,6 +247,22 @@ sap.ui.define([
 			if (bReadonly) {
 				this._oCardPreview.onfocusin = this._onfocusin.bind(this);
 			}
+			// for some Cards, such as component Card, need to reset the Card height for css since the Card Content
+			// will not trigger onAfterRendering of the Card after loaded, then the height value may be wrong
+			this._oCardPreview.attachEvent("_ready", function () {
+				var oCardContent = this._oCardPreview.getCardContent();
+				if (oCardContent) {
+					oCardContent.addEventDelegate({
+						"onAfterRendering": function() {
+							this._resetHeight();
+						}
+					}, this);
+				}
+			}.bind(this));
+			this._oCardPreview.onAfterRendering = function () {
+				Card.prototype.onAfterRendering.call(this);
+				that._resetHeight();
+			};
 		}
 		if (this._currentMode === "MockData") {
 			this._oCardPreview.setProperty("useMockData", true);
@@ -260,6 +283,17 @@ sap.ui.define([
 		return this._oCardPreview;
 	};
 
+	CardPreview.prototype._resetHeight = function () {
+		var oCardDom = this._oCardPreview.getDomRef();
+		if (oCardDom && this._getCurrentSize() !== "Full" ) {
+			var sHeight = oCardDom.offsetHeight;
+			document.body.style.setProperty("--sapUiIntegrationEditorPreviewCardHeight", sHeight + "px");
+			document.body.style.setProperty("--sapUiIntegrationEditorPreviewHeight", (sHeight * 0.45 + 56)  + "px");
+		} else {
+			document.body.style.removeProperty("--sapUiIntegrationEditorPreviewCardHeight");
+		}
+	};
+
 	/**
 	 * returns the image placeholder is the preview.src is maintained
 	 */
@@ -444,11 +478,9 @@ sap.ui.define([
 		if (this._currentSize === "Normal") {
 			this.getEditor().setWidth(this.getParentWidth());
 			document.body.style.removeProperty("--sapUiIntegrationEditorPreviewWidth");
-			document.body.style.removeProperty("--sapUiIntegrationEditorPreviewHeight");
 		} else {
 			this.getEditor().setWidth("0");
 			document.body.style.setProperty("--sapUiIntegrationEditorPreviewWidth", this.getParentWidth());
-			document.body.style.setProperty("--sapUiIntegrationEditorPreviewHeight", this.getParentHeight());
 		}
 	};
 

package/src/sap/ui/integration/designtime/editor/css/CardPreview.css

@@ -53,30 +53,34 @@
 	width: var(--sapUiIntegrationEditorPreviewWidth, calc(400px + 10rem)) !important;
 }
 
-.sapUiIntegrationDTPreview .sapFCard.sapUiIntegrationDTPreviewScale {
-	transform: scale3d(0.45, 0.45, 1);
-	transform-origin: 0 0;
+.sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewScaleBasic {
 	width: calc(400px + 10rem) !important;
-	height: calc(700px - 1.5rem) !important;
+	min-height: calc(700px - 1.5rem) !important;
 	position: absolute;
 }
 
-.sapUiIntegrationDTPreview .sapFCard.sapUiIntegrationDTPreviewScaleSpec {
+.sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewScaleBasic.withScale {
+	transform: scale3d(0.45, 0.45, 1);
+	transform-origin: 0 0;
+}
+
+.sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewScaleBasic.withScaleSpec {
 	transform: scale3d(0.45, 0.45, 1);
 	transform-origin: 100% 0;
-	width: calc(400px + 10rem) !important;
-	height: calc(700px - 1.5rem) !important;
-	position: absolute
+}
+
+.sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewNoScale {
+	min-height: 350px !important;
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewModeButton {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 8rem) !important;
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 8rem) !important;
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewModeButtonSpec {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 8rem) 0 0 !important
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 8rem) 0 0 !important
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewModeButtonFull {
@@ -97,12 +101,12 @@
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButton {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 5rem) !important;
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 5rem) !important;
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButtonSpec {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 5rem) 0 0 !important
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 5rem) 0 0 !important
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButtonFull {
@@ -115,12 +119,12 @@
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButtonOnly {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 6.5rem) !important;
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) 0 0 calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 6.5rem) !important;
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButtonOnlySpec {
 	position: absolute !important;
-	margin: calc(350px - 2.8rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 6.5rem) 0 0 !important
+	margin: calc(var(--sapUiIntegrationEditorPreviewCardHeight, calc((350px - 3.3rem) / 0.45)) * 0.45 + 0.5rem) calc(var(--sapUiIntegrationEditorPreviewWidth, calc(190px + 15.5rem))/2 - 6.5rem) 0 0 !important
 }
 
 .sapUiIntegrationDTPreview .sapUiIntegrationDTPreviewResizeButtonOnlyFull {

package/src/sap/ui/integration/editor/Editor.js

@@ -122,7 +122,7 @@ sap.ui.define([
 		REGEXP_PARAMETERS = /\{\{parameters\.([^\}\}]+)/g,
 		CONTEXT_TIMEOUT = 5000,
 		oResourceBundle = Core.getLibraryResourceBundle("sap.ui.integration"),
-		MessageStripId = "__strip0",
+		MessageStripId = "_strip",
 		MODULE_PREFIX = "module:";
 
 	/**
@@ -137,7 +137,7 @@ sap.ui.define([
 	 * @extends sap.ui.core.Control
 	 *
 	 * @author SAP SE
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 * @constructor
 	 * @since 1.94
 	 * @private
@@ -620,7 +620,7 @@ sap.ui.define([
 													addColFieldsOfSubGroup();
 												}
 												if (oConfig.hint) {
-													var oHint = oControl._createHint(oConfig.hint);
+													var oHint = oControl._createHint(oConfig.hint, oItem.getParameterId());
 													var oColVBox = new VBox({
 														items: [
 															oHBox,
@@ -638,7 +638,7 @@ sap.ui.define([
 													addColFields();
 												}
 												if (oConfig.hint) {
-													var oHint = oControl._createHint(oConfig.hint);
+													var oHint = oControl._createHint(oConfig.hint, oItem.getParameterId());
 													var oColVBox = new VBox({
 														items: [
 															oHBox,
@@ -696,7 +696,7 @@ sap.ui.define([
 												]
 											});
 											if (oConfig.hint) {
-												var oHint = oControl._createHint(oConfig.hint);
+												var oHint = oControl._createHint(oConfig.hint, oItem.getParameterId());
 												oColVBox.addItem(oHint.addStyleClass("sapUiIntegrationEditorHint"));
 											}
 											oColVBox.addStyleClass("col1");
@@ -878,7 +878,7 @@ sap.ui.define([
 		this._appliedLayerManifestChanges = [];
 		this._currentLayerManifestChanges = {};
 		this._mDestinationDataProviders = {};
-		var oMessageStrip = new MessageStrip({
+		var oMessageStrip = new MessageStrip(this.getId() + MessageStripId, {
 			showIcon: false
 		});
 		oMessageStrip.addStyleClass("sapUiIntegrationEditorFieldMessageStrip");
@@ -892,7 +892,7 @@ sap.ui.define([
 		 * @experimental since 1.94
 		 * @public
 		 * @author SAP SE
-		 * @version 1.113.0
+		 * @version 1.115.0
 		 * @borrows sap.ui.integration.editor.Editor#getParameters as getParameters
 		 * @borrows sap.ui.integration.editor.Editor#resolveDestination as resolveDestination
 		 * @borrows sap.ui.integration.editor.Editor#request as request
@@ -1866,8 +1866,8 @@ sap.ui.define([
 		});
 	};
 
-	Editor.prototype._createDescription = function (oConfig) {
-		var oDescIcon = new Icon({
+	Editor.prototype._createDescription = function (oConfig, sItemId) {
+		var oDescIcon = new Icon(this.getId() + "_" + sItemId + "_description_icon", {
 			src: "sap-icon://message-information",
 			color: "Marker",
 			size: "12px",
@@ -1898,9 +1898,9 @@ sap.ui.define([
 		return oDescIcon;
 	};
 
-	Editor.prototype._createMessageIcon = function (oField) {
+	Editor.prototype._createMessageIcon = function (oField, sItemId) {
 		var oConfig = oField.getConfiguration();
-		var oMsgIcon = new Icon({
+		var oMsgIcon = new Icon(this.getId() + "_" + sItemId + "_message_icon", {
 			src: "sap-icon://message-information",
 			size: "12px",
 			visible: oConfig.visible,
@@ -1929,10 +1929,11 @@ sap.ui.define([
 
 	/**
 	 * Creates a label based on the configuration settings
-	 * @param {} oConfig
+	 * @param {object} oConfig
+	 * @param {string} sItemId
 	 */
-	Editor.prototype._createLabel = function (oConfig) {
-		var oLabel = new Label({
+	Editor.prototype._createLabel = function (oConfig, sItemId) {
+		var oLabel = new Label(this.getId() + "_" + sItemId + "_label", {
 			text: oConfig.label,
 			tooltip: oConfig.tooltip || oConfig.label,
 			//mark only fields that are required and editable,
@@ -1962,9 +1963,9 @@ sap.ui.define([
 	/**
 	 * Create the settings button
 	 */
-	 Editor.prototype._createSettingsButton = function (oField) {
+	 Editor.prototype._createSettingsButton = function (oField, sItemId) {
 		var oConfig = oField.getConfiguration();
-		var oSettingsButton = new Button({
+		var oSettingsButton = new Button(this.getId() + "_" + sItemId + "_settings_btn", {
 			icon: "{= ${currentSettings>_hasDynamicValue} ? 'sap-icon://display-more' : 'sap-icon://enter-more'}",
 			type: "Transparent",
 			tooltip: this._oResourceBundle.getText("EDITOR_FIELD_MORE_SETTINGS"),
@@ -2018,7 +2019,7 @@ sap.ui.define([
 			text: ""
 		});
 		oText.addStyleClass("sapUiTinyMargin sapUiIntegrationEditorDescriptionText");
-		this._oPopover = new RPopover({
+		this._oPopover = new RPopover(this.getId() + "_popover", {
 			showHeader: false,
 			content: [oText]
 		});
@@ -2028,13 +2029,15 @@ sap.ui.define([
 
 	/**
 	 * Creates a Field based on the configuration settings
-	 * @param {*} oConfig
+	 * @param {object} oConfig
+	 * @param {string} sItemId
 	 */
-	Editor.prototype._createField = function (oConfig) {
-		var oField = new Editor.Fields[oConfig.type]({
+	Editor.prototype._createField = function (oConfig, sItemId) {
+		var oField = new Editor.Fields[oConfig.type](this.getId() + "_" + sItemId + "_field", {
 			configuration: oConfig,
 			mode: this.getMode(),
 			host: this.getHostInstance(),
+			parameterId: this.getId() + "_" + sItemId,
 			objectBindings: {
 				currentSettings: {
 					path: "currentSettings>" + oConfig._settingspath
@@ -2059,14 +2062,14 @@ sap.ui.define([
 					|| oConfig.validation
 					|| (oConfig.validations && oConfig.validations.length > 0)
 					|| (oConfig.values && oConfig.values.data && !oConfig.values.data.json)) {
-					var oMsgIcon = this._createMessageIcon(oField);
+					var oMsgIcon = this._createMessageIcon(oField, sItemId);
 					oField.setAssociation("_messageIcon", oMsgIcon);
 				}
 				if (oConfig.description && this.getMode() !== "translation") {
-					oField._descriptionIcon = this._createDescription(oConfig);
+					oField._descriptionIcon = this._createDescription(oConfig, sItemId);
 				}
 				if (oConfig._changeDynamicValues) {
-					oField._settingsButton = this._createSettingsButton(oField);
+					oField._settingsButton = this._createSettingsButton(oField, sItemId);
 					oField._applyButtonStyles();
 				}
 			}
@@ -2583,9 +2586,10 @@ sap.ui.define([
 
 	/**
 	 * Adds an item to the _formContent aggregation based on the config settings
-	 * @param {} oConfig
+	 * @param {object} oConfig
+	 * @param {string} sItemId
 	 */
-	 Editor.prototype._addItem = function (oConfig) {
+	 Editor.prototype._addItem = function (oConfig, sItemId) {
 		var sMode = this.getMode();
 		//force to turn off features for settings and dynamic values and set the default if not configured
 		if (this.getAllowDynamicValues() === false || !oConfig.allowDynamicValues) {
@@ -2603,10 +2607,10 @@ sap.ui.define([
 		//display subPanel as iconTabBar or Panel
 		if (oConfig.type === "group") {
 			oConfig.expanded = oConfig.expanded !== false;
-			var oField = this._createField(oConfig);
+			var oField = this._createField(oConfig, sItemId);
 			this.addAggregation("_formContent", oField);
 			if (oConfig.hint) {
-				this._addHint(oConfig.hint);
+				this._addHint(oConfig.hint, this.getId() + "_" + sItemId);
 			}
 			return;
 		}
@@ -2657,11 +2661,11 @@ sap.ui.define([
 				//the original language field shows only a text control. If empty we show a dash to avoid empty text.
 				origLangFieldConfig.value = "-";
 			}
-			var oLabel = this._createLabel(origLangFieldConfig);
+			var oLabel = this._createLabel(origLangFieldConfig, sItemId);
 			this.addAggregation("_formContent",
 				oLabel
 			);
-			var oOrigLanguageField = this._createField(origLangFieldConfig);
+			var oOrigLanguageField = this._createField(origLangFieldConfig, sItemId + "_ori");
 			oOrigLanguageField.isOrigLangField = true;
 			this.addAggregation("_formContent", oOrigLanguageField);
 
@@ -2678,7 +2682,7 @@ sap.ui.define([
 			//change the label for the translation field
 			oConfig.label = oConfig._translatedLabel || "";
 			oConfig.required = false; //translation is never required
-			var oTranslateLanguageField = this._createField(oConfig);
+			var oTranslateLanguageField = this._createField(oConfig, sItemId + "_trans");
 			//accessibility set aria-label
 			var tfDelegate = {
 				onAfterRendering: function(oEvent) {
@@ -2691,7 +2695,7 @@ sap.ui.define([
 				oTranslateLanguageField
 			);
 		} else {
-			oNewLabel = this._createLabel(oConfig);
+			oNewLabel = this._createLabel(oConfig, sItemId);
 			this.addAggregation("_formContent",
 				oNewLabel
 			);
@@ -2713,7 +2717,7 @@ sap.ui.define([
 					oConfig.value = sTranslateText;
 				}
 			}
-			var oField = this._createField(oConfig);
+			var oField = this._createField(oConfig, sItemId);
 			//accessibility set aria-label
 			var fDelegate = {
 				onAfterRendering: function(oEvent) {
@@ -2728,23 +2732,23 @@ sap.ui.define([
 		}
 		//add hint in the new row.
 		if (oConfig.hint && (!oConfig.cols || oConfig.cols === 2)) {
-			this._addHint(oConfig.hint);
+			this._addHint(oConfig.hint, this.getId() + "_" + sItemId);
 		}
 		//reset the cols to original
 		oConfig.cols = oConfig.__cols;
 		delete oConfig.__cols;
 	};
 
-	Editor.prototype._createHint = function (sHint) {
+	Editor.prototype._createHint = function (sHint, sHintIdPrefix) {
 		sHint = sHint.replace(/<a href/g, "<a target='blank' href");
-		var oFormattedText = new FormattedText({
+		var oFormattedText = new FormattedText(sHintIdPrefix + "_hint", {
 			htmlText: sHint
 		});
 		return oFormattedText;
 	};
 
-	Editor.prototype._addHint = function (sHint) {
-		var oHint = this._createHint(sHint);
+	Editor.prototype._addHint = function (sHint, sHintIdPrefix) {
+		var oHint = this._createHint(sHint, sHintIdPrefix);
 		this.addAggregation("_formContent", oHint);
 	};
 	/**
@@ -2877,7 +2881,7 @@ sap.ui.define([
 					expandable: false,
 					expanded: true,
 					label: this._oResourceBundle.getText("EDITOR_ORIGINALLANG") + ": " + Editor._oLanguages[sLanguage]
-				});
+				}, "translationTopPanel");
 			}
 			for (var n in aItems) {
 				var oItem = aItems[n];
@@ -3029,7 +3033,7 @@ sap.ui.define([
 
 		for (var n in aItems) {
 			var oItem = aItems[n];
-			this._addItem(oItem);
+			this._addItem(oItem, n);
 		}
 		// customize the size of card editor, define the size in dt.js
 		var editorHeight = this._settingsModel.getProperty("/form/height") !== undefined ? this._settingsModel.getProperty("/form/height") : "350px",
@@ -3056,6 +3060,7 @@ sap.ui.define([
 		if (sValue) {
 			this.setProperty("height", sValue);
 			document.body.style.setProperty("--sapUiIntegrationEditorFormHeight", sValue);
+			document.body.style.setProperty("--sapUiIntegrationEditorPreviewHeight", sValue);
 		}
 	};
 
@@ -3256,7 +3261,7 @@ sap.ui.define([
 	};
 	/**
 	 * Adds additional settings for destinations section in admin mode
-	 * @param {} oConfiguration
+	 * @param {object} oConfiguration
 	 */
 	Editor.prototype._addDestinationSettings = function (oConfiguration) {
 		var oSettings = this._oDesigntimeInstance.getSettings(),

package/src/sap/ui/integration/editor/EditorResourceBundles.js

@@ -18,7 +18,7 @@ sap.ui.define([
 	 * @alias sap.ui.integration.editor.EditorResourceBundles
 	 * @author SAP SE
 	 * @since 1.94.0
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 * @private
 	 */
 	var EditorResourceBundles = ManagedObject.extend("sap.ui.integration.editor.EditorResourceBundles", {

package/src/sap/ui/integration/editor/Extension.js

@@ -22,7 +22,7 @@ sap.ui.define([
 	 * @extends sap.ui.integration.Extension
 	 *
 	 * @author SAP SE
-	 * @version 1.113.0
+	 * @version 1.115.0
 	 *
 	 * @constructor
 	 * @public