From 0f305e41a80ce172731a41ff64576a223d56c7cf Mon Sep 17 00:00:00 2001
From: nathan <nathangray.bsc+github@gmail.com>
Date: Fri, 26 Jul 2024 11:42:05 -0600
Subject: [PATCH] Et2Tabs now auto-size from first tab contents when tabHeight
 property is not set

---
 api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts | 32 +++++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

diff --git a/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts b/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts
index 1864e124bd..aed38f2a9b 100644
--- a/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts
+++ b/api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts
@@ -72,7 +72,7 @@ export class Et2Tabs extends Et2InputWidget(SlTabGroup) implements et2_IResizeab
 
 			/**
 			 * Set the height for tabs
-			 * Leave unset to size automatically
+			 * Leave unset to size automatically from either parent height attribute, or height of first tabpanel
 			 */
 			tabHeight: {type: String},
 
@@ -215,6 +215,36 @@ export class Et2Tabs extends Et2InputWidget(SlTabGroup) implements et2_IResizeab
 
 		// Create the tab DOM-Nodes
 		this.createTabs(tabData);
+
+		// Use the height of the first tab if height not set
+		if(!this.tabHeight && tabData.length > 0)
+		{
+			const firstTab = tabData[0].contentDiv;
+			firstTab.updateComplete.then(async() =>
+			{
+				// Wait for children to load
+				let wait = [];
+				let walk = (widget) =>
+				{
+					if(widget.loading)
+					{
+						wait.push(widget.loading);
+					}
+					wait.push(widget.updateComplete);
+					widget.getChildren().forEach(child => walk(child));
+				}
+				walk(firstTab);
+				await Promise.all(wait);
+
+				const initial = firstTab.hasAttribute("active");
+				firstTab.setAttribute("active", '');
+				this.tabHeight = getComputedStyle(firstTab).height;
+				if(!initial)
+				{
+					firstTab.removeAttribute("active");
+				}
+			})
+		}
 	}
 
 	_readTabs(tabData, tabs)