@sapui5/sap.cux.home 1.139.0 → 1.140.0

package/src/sap/cux/home/BaseContainer.ts

@@ -33,6 +33,7 @@ import { recycleId } from "./utils/DataFormatUtils";
 import { calculateDeviceType, DeviceType } from "./utils/Device";
 import { addFESRId, addFESRSemanticStepName, FESR_EVENTS, getFESRId } from "./utils/FESRUtil";
 import { recordElementLoadEnd, recordElementLoadStart, UIElements } from "./utils/PerformanceUtils";
+import SideBySideIconTabFilter from "./SideBySideIconTabFilter";
 
 type FullScreenElementRelation = {
 	isFullScreenEnabled: boolean;
@@ -52,8 +53,8 @@ type FullScreenElementRelation = {
  * @since 1.121
  *
  * @abstract
- * @internal
- * @public
+ * @private
+ * @ui5-restricted ux.eng.s4producthomes1
  *
  * @ui5-metamodel
  * @alias sap.cux.home.BaseContainer
@@ -90,15 +91,14 @@ export default abstract class BaseContainer extends Control {
 			/**
 			 * Title of the container.
 			 */
-			title: { type: "string", group: "Data", defaultValue: "", visibility: "hidden" },
+			title: { type: "string", group: "Data", defaultValue: "" },
 			/**
 			 * Orientation of the container.
 			 */
 			orientation: {
 				type: "sap.cux.home.OrientationType",
 				group: "Data",
-				defaultValue: OrientationType.SideBySide,
-				visibility: "hidden"
+				defaultValue: OrientationType.SideBySide
 			},
 			/**
 			 * Key of the selected panel of the container.
@@ -180,7 +180,11 @@ export default abstract class BaseContainer extends Control {
 			 *
 			 * @public
 			 */
-			menuItems: { type: "sap.cux.home.MenuItem", multiple: true, singularName: "menuItem", visibility: "public" }
+			menuItems: { type: "sap.cux.home.MenuItem", multiple: true, singularName: "menuItem", visibility: "public" },
+			/**
+			 * Hidden aggregation for placeholder.
+			 */
+			_placeholder: { type: "sap.ui.core.HTML", multiple: false, singularName: "placeholder", visibility: "hidden" }
 		},
 		associations: {
 			layout: { type: "sap.cux.home.BaseLayout", multiple: false, singularName: "layout", visibility: "hidden" },
@@ -216,6 +220,12 @@ export default abstract class BaseContainer extends Control {
 			value: {}
 		});
 		this.addCustomData(containerCustomSettings);
+
+		//create placeholder
+		const placeholderContent = this.getGenericPlaceholderContent();
+		if (placeholderContent) {
+			this.setAggregation("_placeholder", new HTML({ content: placeholderContent }), true);
+		}
 	}
 
 	/**
@@ -341,22 +351,6 @@ export default abstract class BaseContainer extends Control {
 		}
 	}
 
-	/**
-	 * Adds corresponding control to panel. The control would be added to the
-	 * corresponding target inner control based on the layout.
-	 *
-	 * @private
-	 * @param {BasePanel} panel - panel to which control must be added
-	 * @param {Control} control - control to be added
-	 */
-	public _addToPanel(panel: BasePanel, control: Control): void {
-		if (this.getProperty("orientation") === OrientationType.SideBySide) {
-			this._getIconTabFilter(panel)?.addContent(control);
-		} else {
-			(this._controlMap.get(`${panel.getId()}-contentWrapper`) as FlexBox)?.addItem(control);
-		}
-	}
-
 	/**
 	 * Creates and returns IconTabBarFilter for the specified panel to be placed
 	 * in the IconTabBar inner control in case of SideBySide layout
@@ -369,11 +363,7 @@ export default abstract class BaseContainer extends Control {
 		const id = `${panel.getId()}-tabFilter`;
 
 		if (!this._controlMap.get(id)) {
-			const iconTabFilter = new IconTabFilter(id, {
-				key: panel.getProperty("key") as string,
-				text: panel.getProperty("title") as string,
-				tooltip: panel.getProperty("tooltip") as string
-			});
+			const iconTabFilter = new SideBySideIconTabFilter(id, { panel });
 			iconTabFilter.addCustomData(
 				new CustomData(`${panel.getId()}--customFilter`, {
 					key: "sap-ui-fastnavgroup",
@@ -385,9 +375,6 @@ export default abstract class BaseContainer extends Control {
 			addFESRSemanticStepName(iconTabFilter, FESR_EVENTS.SELECT, panel.getProperty("key") as string);
 		}
 
-		//Add panel content to the created filter
-		panel._getContent()?.forEach((content) => (this._controlMap.get(id) as IconTabFilter).addContent(content));
-
 		return this._controlMap.get(id) as IconTabFilter;
 	}
 
@@ -435,6 +422,20 @@ export default abstract class BaseContainer extends Control {
 		if (this.getProperty("enableLazyLoad") as boolean) {
 			this._observeContainer();
 		}
+
+		this._hidePanelHeaderIfSinglePanel();
+	}
+
+	/**
+	 * Hides the panel header if there is only one panel in the container,
+	 * in case of side-by-side orientation.
+	 *
+	 * @private
+	 */
+	private _hidePanelHeaderIfSinglePanel(): void {
+		const isSideBySideLayout = this.getProperty("orientation") === OrientationType.SideBySide;
+		const hasOnlyOnePanel = this.getContent()?.length === 1;
+		this.toggleStyleClass("sapUiITBHide", isSideBySideLayout && hasOnlyOnePanel);
 	}
 
 	/**
@@ -809,41 +810,9 @@ export default abstract class BaseContainer extends Control {
 			this._iconTabBar.removeAllItems();
 			panels.forEach((panel) => this._iconTabBar.addItem(this._getIconTabFilter(panel)));
 			this._iconTabBar.setSelectedKey(this.getProperty("selectedKey") as string);
-		} else {
-			this._wrapper.removeAllItems();
-			panels.forEach((panel) => this._wrapper.addItem(this._getPanelContentWrapper(panel)));
 		}
 	}
 
-	/**
-	 * Creates and returns a wrapper for containing the specified panel
-	 * content in case of Horizontal and Vertical layout
-	 *
-	 * @private
-	 * @param {BasePanel} panel - panel for which wrapper has to created
-	 * @returns {FlexBox} wrapper container for the given panel
-	 */
-	protected _getPanelContentWrapper(panel: BasePanel): FlexBox {
-		const id = `${panel.getId()}-contentWrapper`;
-
-		if (!this._controlMap.get(id)) {
-			this._controlMap.set(
-				id,
-				new FlexBox(id, {
-					width: "100%",
-					direction: "Column",
-					renderType: "Bare"
-				})
-			);
-		}
-
-		//Add header as the first item in case of Horizontal and Vertical layout
-		(this._controlMap.get(id) as FlexBox).addItem(this._updatePanelHeader(panel));
-		panel._getContent()?.forEach((content) => (this._controlMap.get(id) as FlexBox).addItem(content));
-
-		return this._controlMap.get(id) as FlexBox;
-	}
-
 	/**
 	 * Returns header of the specified panel after updating it
 	 *
@@ -851,7 +820,7 @@ export default abstract class BaseContainer extends Control {
 	 * @param {BasePanel} panel - panel to be updated
 	 * @returns {HBox} header associated with the panel
 	 */
-	private _updatePanelHeader(panel: BasePanel): HBox {
+	public getPanelHeader(panel: BasePanel): HBox {
 		const header = this._createHeader(panel);
 		const isTitleVisible = (panel.getProperty("title") as string)?.trim().length > 0;
 		const hasContainerTitle = (this.getProperty("title") as string)?.trim().length > 0;
@@ -1053,7 +1022,7 @@ export default abstract class BaseContainer extends Control {
 	}
 
 	public removeContent(panel: BasePanel) {
-		if (this.getProperty("selectedKey") && this.getProperty("selectedKey") === panel.getProperty("key")) {
+		if (this.getProperty("selectedKey") && this.getProperty("selectedKey") === panel?.getProperty?.("key")) {
 			this.setProperty("selectedKey", undefined, true);
 		}
 		this.removeAggregation("content", panel);
@@ -1195,19 +1164,6 @@ export default abstract class BaseContainer extends Control {
 		this._detachResizeHandler();
 	}
 
-	/**
-	 * Returns a UI5 `HTML` control that contains the generic placeholder content.
-	 *
-	 * @returns {Control} A `sap.ui.core.HTML` control displaying the placeholder content.
-	 */
-	public getGenericPlaceholder(): Control | undefined {
-		const content = this.getGenericPlaceholderContent();
-		if (!content) {
-			return undefined;
-		}
-		return new HTML({ content });
-	}
-
 	/**
 	 * Default implementation: returns undefined.
 	 */

package/src/sap/cux/home/BaseContainerRenderer.d.ts

@@ -1,6 +1,8 @@
 declare module "sap/cux/home/BaseContainerRenderer" {
     import RenderManager from "sap/ui/core/RenderManager";
     import BaseContainer from "sap/cux/home/BaseContainer";
+    import BasePanel from "sap/cux/home/BasePanel";
+    const renderPanel: (rm: RenderManager, control: BaseContainer, panel: BasePanel) => void;
     /**
      * Renders custom loader based on container type.
      */

package/src/sap/cux/home/BaseContainerRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BaseContainerRenderer.d.ts","sourceRoot":"../../../../..","sources":["src/sap/cux/home/BaseContainerRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,oCAAoC,CAAC;IAOpD,OAAO,aAAa,MAAM,2BAA2B,CAAC;IACtD,OAAO,aAAa,MAAM,4BAA4B,CAAC;IAGvD;;OAEG;IACH,MAAM,uBAAuB,GAAI,IAAI,aAAa,EAAE,SAAS,aAAa,SAczE,CAAC;;;QAKD;;;;;;;WAOG;qBACmB,aAAa,WAAW,aAAa;QA4B3D;;;;;;WAMG;4BAC0B,aAAa,WAAW,aAAa;;IA9CnE,wBA+DE;CAED"}
+{"version":3,"file":"BaseContainerRenderer.d.ts","sourceRoot":"../../../../..","sources":["src/sap/cux/home/BaseContainerRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,oCAAoC,CAAC;IAQpD,OAAO,aAAa,MAAM,2BAA2B,CAAC;IACtD,OAAO,aAAa,MAAM,4BAA4B,CAAC;IACvD,OAAO,SAAS,MAAM,wBAAwB,CAAC;IAI/C,MAAM,WAAW,GAAI,IAAI,aAAa,EAAE,SAAS,aAAa,EAAE,OAAO,SAAS,SAqB/E,CAAC;IAEF;;OAEG;IACH,MAAM,uBAAuB,GAAI,IAAI,aAAa,EAAE,SAAS,aAAa,SAczE,CAAC;;;QAKD;;;;;;;WAOG;qBACmB,aAAa,WAAW,aAAa;QA4B3D;;;;;;WAMG;4BAC0B,aAAa,WAAW,aAAa;;IA9CnE,wBA0EE;CAED"}

package/src/sap/cux/home/BaseContainerRenderer.js

@@ -6,12 +6,31 @@ sap.ui.define(["sap/base/Log", "./library"], function (Log, ___library) {
   "use strict";
 
   const OrientationType = ___library["OrientationType"];
+  const renderPanel = (rm, control, panel) => {
+    if (!panel.getVisible()) {
+      return;
+    }
+    const orientation = control.getProperty("orientation");
+    const isSideBySide = orientation === OrientationType.SideBySide;
+    rm.openStart("div", panel.getId()).class("sapUiBasePanel").openEnd();
+    if (!isSideBySide) {
+      // render panel header
+      rm.renderControl(control.getPanelHeader(panel));
+    }
+
+    //render panel content
+    panel.getContent().forEach(content => {
+      rm.renderControl(content);
+    });
+    rm.close("div");
+  };
+
   /**
    * Renders custom loader based on container type.
    */
   const renderCustomPlaceholder = (rm, control) => {
     try {
-      const placeholder = control.getGenericPlaceholder();
+      const placeholder = control.getAggregation("_placeholder");
       if (!placeholder) {
         rm.openStart("div", control.getId() + "-placeholder").class("sapUiBaseContainerPlaceholder").openEnd().close("div");
         return;
@@ -71,9 +90,18 @@ sap.ui.define(["sap/base/Log", "./library"], function (Log, ___library) {
         rm.renderControl(control._getHeader());
         rm.close("div");
 
+        //render inner control only if orientation is SideBySide
+        const orientation = control.getProperty("orientation");
+        const isSideBySide = orientation === OrientationType.SideBySide;
+
         //render content
-        rm.openStart("div", control.getId() + "-content").class("sapUiBaseContainerContent").openEnd();
-        rm.renderControl(control._getInnerControl());
+        rm.openStart("div", control.getId() + "-content").class("sapUiBaseContainerContent").class(`sapUiOrientation${orientation}`).openEnd();
+        if (isSideBySide) {
+          rm.renderControl(control._getInnerControl());
+        } else {
+          //render individual panels
+          control.getContent().forEach(panel => renderPanel(rm, control, panel));
+        }
         rm.close("div");
       }
     }

package/src/sap/cux/home/BaseContainerRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseContainerRenderer.js","names":["sap","ui","define","Log","___library","OrientationType","renderCustomPlaceholder","rm","control","placeholder","getGenericPlaceholder","openStart","getId","class","openEnd","close","renderControl","error","__exports","apiVersion","render","getProperty","SideBySide","Horizontal","style","getWidth","getHeight","isLazyLoadEnabled","renderContent","getContent","length","_getHeader","_getInnerControl"],"sources":["BaseContainerRenderer.ts"],"sourcesContent":["/*!\n * SAP UI development toolkit for HTML5 (SAPUI5)\n *  * (c) Copyright 2009-2025 SAP SE. All rights reserved\n */\n\nimport Log from \"sap/base/Log\";\nimport RenderManager from \"sap/ui/core/RenderManager\";\nimport BaseContainer from \"./BaseContainer\";\nimport { OrientationType } from \"./library\";\n\n/**\n * Renders custom loader based on container type.\n */\nconst renderCustomPlaceholder = (rm: RenderManager, control: BaseContainer) => {\n\ttry {\n\t\tconst placeholder = control.getGenericPlaceholder();\n\t\tif (!placeholder) {\n\t\t\trm.openStart(\"div\", control.getId() + \"-placeholder\")\n\t\t\t\t.class(\"sapUiBaseContainerPlaceholder\")\n\t\t\t\t.openEnd()\n\t\t\t\t.close(\"div\");\n\t\t\treturn;\n\t\t}\n\t\trm.renderControl(placeholder);\n\t} catch (error) {\n\t\tLog.error(\"Failed to render placeholder:\", error as string);\n\t}\n};\n\nexport default {\n\tapiVersion: 2,\n\n\t/**\n\t * Renders the control.\n\t *\n\t * @public\n\t * @override\n\t * @param {RenderManager} rm - The RenderManager object.\n\t * @param {BaseContainer} control - The BaseContainer control to be rendered.\n\t */\n\trender: function (rm: RenderManager, control: BaseContainer) {\n\t\trm.openStart(\"div\", control).class(\"sapCuxBaseContainer\");\n\n\t\t//Apply Layout based style classes\n\t\tif (control.getProperty(\"orientation\") === OrientationType.SideBySide) {\n\t\t\trm.class(\"sapCuxSideBySide\");\n\t\t} else if (control.getProperty(\"orientation\") === OrientationType.Horizontal) {\n\t\t\trm.class(\"sapCuxHorizontal\");\n\t\t} else {\n\t\t\trm.class(\"sapCuxVertical\");\n\t\t}\n\n\t\t//update width and height\n\t\trm.style(\"width\", control.getWidth());\n\t\trm.style(\"height\", control.getHeight());\n\t\trm.openEnd();\n\n\t\t//render content only if it is loaded, render placeholder otherwise\n\t\tconst isLazyLoadEnabled = control.getProperty(\"enableLazyLoad\") as boolean;\n\t\tif (!isLazyLoadEnabled || control.getProperty(\"loaded\")) {\n\t\t\tthis.renderContent(rm, control);\n\t\t} else {\n\t\t\trenderCustomPlaceholder(rm, control);\n\t\t}\n\n\t\trm.close(\"div\");\n\t},\n\n\t/**\n\t * Renders the content of the control.\n\t *\n\t * @private\n\t * @param {RenderManager} rm - The RenderManager object.\n\t * @param {BaseContainer} control - The BaseContainer control.\n\t */\n\trenderContent: function (rm: RenderManager, control: BaseContainer) {\n\t\tif (control.getContent()?.length > 0) {\n\t\t\t//render header\n\t\t\trm.openStart(\"div\", control.getId() + \"-header\")\n\t\t\t\t.class(\"sapUiBaseContainerHeader\")\n\t\t\t\t.openEnd();\n\t\t\trm.renderControl(control._getHeader());\n\t\t\trm.close(\"div\");\n\n\t\t\t//render content\n\t\t\trm.openStart(\"div\", control.getId() + \"-content\")\n\t\t\t\t.class(\"sapUiBaseContainerContent\")\n\t\t\t\t.openEnd();\n\t\t\trm.renderControl(control._getInnerControl());\n\t\t\trm.close(\"div\");\n\t\t}\n\t}\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"BaseContainerRenderer.js","names":["sap","ui","define","Log","___library","OrientationType","renderPanel","rm","control","panel","getVisible","orientation","getProperty","isSideBySide","SideBySide","openStart","getId","class","openEnd","renderControl","getPanelHeader","getContent","forEach","content","close","renderCustomPlaceholder","placeholder","getAggregation","error","__exports","apiVersion","render","Horizontal","style","getWidth","getHeight","isLazyLoadEnabled","renderContent","length","_getHeader","_getInnerControl"],"sources":["BaseContainerRenderer.ts"],"sourcesContent":["/*!\n * SAP UI development toolkit for HTML5 (SAPUI5)\n *  * (c) Copyright 2009-2025 SAP SE. All rights reserved\n */\n\nimport Log from \"sap/base/Log\";\nimport HTML from \"sap/ui/core/HTML\";\nimport RenderManager from \"sap/ui/core/RenderManager\";\nimport BaseContainer from \"./BaseContainer\";\nimport BasePanel from \"./BasePanel\";\nimport { OrientationType } from \"./library\";\nimport Control from \"sap/ui/core/Control\";\n\nconst renderPanel = (rm: RenderManager, control: BaseContainer, panel: BasePanel) => {\n\tif (!panel.getVisible()) {\n\t\treturn;\n\t}\n\n\tconst orientation = control.getProperty(\"orientation\") as OrientationType;\n\tconst isSideBySide = orientation === OrientationType.SideBySide;\n\n\trm.openStart(\"div\", panel.getId()).class(\"sapUiBasePanel\").openEnd();\n\n\tif (!isSideBySide) {\n\t\t// render panel header\n\t\trm.renderControl(control.getPanelHeader(panel));\n\t}\n\n\t//render panel content\n\tpanel.getContent().forEach((content: Control) => {\n\t\trm.renderControl(content);\n\t});\n\n\trm.close(\"div\");\n};\n\n/**\n * Renders custom loader based on container type.\n */\nconst renderCustomPlaceholder = (rm: RenderManager, control: BaseContainer) => {\n\ttry {\n\t\tconst placeholder = control.getAggregation(\"_placeholder\") as HTML;\n\t\tif (!placeholder) {\n\t\t\trm.openStart(\"div\", control.getId() + \"-placeholder\")\n\t\t\t\t.class(\"sapUiBaseContainerPlaceholder\")\n\t\t\t\t.openEnd()\n\t\t\t\t.close(\"div\");\n\t\t\treturn;\n\t\t}\n\t\trm.renderControl(placeholder);\n\t} catch (error) {\n\t\tLog.error(\"Failed to render placeholder:\", error as string);\n\t}\n};\n\nexport default {\n\tapiVersion: 2,\n\n\t/**\n\t * Renders the control.\n\t *\n\t * @public\n\t * @override\n\t * @param {RenderManager} rm - The RenderManager object.\n\t * @param {BaseContainer} control - The BaseContainer control to be rendered.\n\t */\n\trender: function (rm: RenderManager, control: BaseContainer) {\n\t\trm.openStart(\"div\", control).class(\"sapCuxBaseContainer\");\n\n\t\t//Apply Layout based style classes\n\t\tif (control.getProperty(\"orientation\") === OrientationType.SideBySide) {\n\t\t\trm.class(\"sapCuxSideBySide\");\n\t\t} else if (control.getProperty(\"orientation\") === OrientationType.Horizontal) {\n\t\t\trm.class(\"sapCuxHorizontal\");\n\t\t} else {\n\t\t\trm.class(\"sapCuxVertical\");\n\t\t}\n\n\t\t//update width and height\n\t\trm.style(\"width\", control.getWidth());\n\t\trm.style(\"height\", control.getHeight());\n\t\trm.openEnd();\n\n\t\t//render content only if it is loaded, render placeholder otherwise\n\t\tconst isLazyLoadEnabled = control.getProperty(\"enableLazyLoad\") as boolean;\n\t\tif (!isLazyLoadEnabled || control.getProperty(\"loaded\")) {\n\t\t\tthis.renderContent(rm, control);\n\t\t} else {\n\t\t\trenderCustomPlaceholder(rm, control);\n\t\t}\n\n\t\trm.close(\"div\");\n\t},\n\n\t/**\n\t * Renders the content of the control.\n\t *\n\t * @private\n\t * @param {RenderManager} rm - The RenderManager object.\n\t * @param {BaseContainer} control - The BaseContainer control.\n\t */\n\trenderContent: function (rm: RenderManager, control: BaseContainer) {\n\t\tif (control.getContent()?.length > 0) {\n\t\t\t//render header\n\t\t\trm.openStart(\"div\", control.getId() + \"-header\")\n\t\t\t\t.class(\"sapUiBaseContainerHeader\")\n\t\t\t\t.openEnd();\n\t\t\trm.renderControl(control._getHeader());\n\t\t\trm.close(\"div\");\n\n\t\t\t//render inner control only if orientation is SideBySide\n\t\t\tconst orientation = control.getProperty(\"orientation\") as OrientationType;\n\t\t\tconst isSideBySide = orientation === OrientationType.SideBySide;\n\n\t\t\t//render content\n\t\t\trm.openStart(\"div\", control.getId() + \"-content\")\n\t\t\t\t.class(\"sapUiBaseContainerContent\")\n\t\t\t\t.class(`sapUiOrientation${orientation}`)\n\t\t\t\t.openEnd();\n\t\t\tif (isSideBySide) {\n\t\t\t\trm.renderControl(control._getInnerControl());\n\t\t\t} else {\n\t\t\t\t//render individual panels\n\t\t\t\tcontrol.getContent().forEach((panel: BasePanel) => renderPanel(rm, control, panel));\n\t\t\t}\n\n\t\t\trm.close(\"div\");\n\t\t}\n\t}\n};\n"],"mappings":"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","ignoreList":[]}

package/src/sap/cux/home/BaseContainerRenderer.ts

@@ -4,16 +4,42 @@
  */
 
 import Log from "sap/base/Log";
+import HTML from "sap/ui/core/HTML";
 import RenderManager from "sap/ui/core/RenderManager";
 import BaseContainer from "./BaseContainer";
+import BasePanel from "./BasePanel";
 import { OrientationType } from "./library";
+import Control from "sap/ui/core/Control";
+
+const renderPanel = (rm: RenderManager, control: BaseContainer, panel: BasePanel) => {
+	if (!panel.getVisible()) {
+		return;
+	}
+
+	const orientation = control.getProperty("orientation") as OrientationType;
+	const isSideBySide = orientation === OrientationType.SideBySide;
+
+	rm.openStart("div", panel.getId()).class("sapUiBasePanel").openEnd();
+
+	if (!isSideBySide) {
+		// render panel header
+		rm.renderControl(control.getPanelHeader(panel));
+	}
+
+	//render panel content
+	panel.getContent().forEach((content: Control) => {
+		rm.renderControl(content);
+	});
+
+	rm.close("div");
+};
 
 /**
  * Renders custom loader based on container type.
  */
 const renderCustomPlaceholder = (rm: RenderManager, control: BaseContainer) => {
 	try {
-		const placeholder = control.getGenericPlaceholder();
+		const placeholder = control.getAggregation("_placeholder") as HTML;
 		if (!placeholder) {
 			rm.openStart("div", control.getId() + "-placeholder")
 				.class("sapUiBaseContainerPlaceholder")
@@ -82,11 +108,22 @@ export default {
 			rm.renderControl(control._getHeader());
 			rm.close("div");
 
+			//render inner control only if orientation is SideBySide
+			const orientation = control.getProperty("orientation") as OrientationType;
+			const isSideBySide = orientation === OrientationType.SideBySide;
+
 			//render content
 			rm.openStart("div", control.getId() + "-content")
 				.class("sapUiBaseContainerContent")
+				.class(`sapUiOrientation${orientation}`)
 				.openEnd();
-			rm.renderControl(control._getInnerControl());
+			if (isSideBySide) {
+				rm.renderControl(control._getInnerControl());
+			} else {
+				//render individual panels
+				control.getContent().forEach((panel: BasePanel) => renderPanel(rm, control, panel));
+			}
+
 			rm.close("div");
 		}
 	}

package/src/sap/cux/home/BaseLayout.d.ts

@@ -30,9 +30,9 @@ declare module "sap/cux/home/BaseLayout" {
      * @version 0.0.1
      * @since 1.121
      *
-     * @internal
      * @abstract
-     * @public
+     * @private
+     * @ui5-restricted ux.eng.s4producthomes1
      *
      * @alias sap.cux.home.BaseLayout
      */

package/src/sap/cux/home/BaseLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BaseLayout.d.ts","sourceRoot":"../../../../..","sources":["src/sap/cux/home/BaseLayout.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"BaseLayout.d.ts","sourceRoot":"../../../../..","sources":["src/sap/cux/home/BaseLayout.ts"],"names":[],"mappings":"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"}

package/src/sap/cux/home/BaseLayout.js

@@ -24,9 +24,9 @@ sap.ui.define(["sap/base/Log", "sap/base/util/deepEqual", "sap/m/library", "sap/
    * @version 0.0.1
    * @since 1.121
    *
-   * @internal
    * @abstract
-   * @public
+   * @private
+   * @ui5-restricted ux.eng.s4producthomes1
    *
    * @alias sap.cux.home.BaseLayout
    */
@@ -609,6 +609,7 @@ sap.ui.define(["sap/base/Log", "sap/base/util/deepEqual", "sap/m/library", "sap/
             const updatedHash = this._addURLParam(currentHash, "expanded", fullScreenName);
             this._hashChanger?.setHash(updatedHash);
             this._focusFullScreenButton(element);
+
             //fire onExpand event
             element.fireEvent("onExpand");
           } else {
@@ -730,8 +731,8 @@ sap.ui.define(["sap/base/Log", "sap/base/util/deepEqual", "sap/m/library", "sap/
      * @param {number} [indexOfVisiblePanel] - Index of panel to exclude from toggle.
      */
     _toggleInnerPanelVisibility: function _toggleInnerPanelVisibility(element, visibility, indexOfVisiblePanel) {
-      element._getInnerControl().getItems().forEach((panel, index) => {
-        panel.toggleStyleClass("sapCuxHidden", index === indexOfVisiblePanel ? visibility : !visibility);
+      element.getContent()?.forEach((panel, index) => {
+        panel.setVisible(index === indexOfVisiblePanel ? !visibility : visibility);
       });
     },
     /**