From a1c19518658d8da60f253f39bf625fa2ecd8f2b7 Mon Sep 17 00:00:00 2001
From: Nicolas Merget <nicolas.merget@deutschebahn.com>
Date: Wed, 18 Dec 2024 08:21:48 +0100
Subject: [PATCH] fix: issue with tab name by changing the state._name once

---
 packages/components/src/components/tabs/tabs.lite.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/tabs/tabs.lite.tsx b/packages/components/src/components/tabs/tabs.lite.tsx
index fb88f87482f..77b7134c471 100644
--- a/packages/components/src/components/tabs/tabs.lite.tsx
+++ b/packages/components/src/components/tabs/tabs.lite.tsx
@@ -91,7 +91,7 @@ export default function DBTabs(props: DBTabsProps) {
 
 					if (input && label) {
 						if (!input.id) {
-							const tabId = `tabs-${state._name}-tab-${index}`;
+							const tabId = `${state._name}-tab-${index}`;
 							label.setAttribute('for', tabId);
 							input.setAttribute(
 								'aria-controls',
@@ -128,7 +128,7 @@ export default function DBTabs(props: DBTabsProps) {
 					panel.id = `${state._name}-tab-panel-${index}`;
 					panel.setAttribute(
 						'aria-labelledby',
-						`tabs-${state._name}-tab-${index}`
+						`${state._name}-tab-${index}`
 					);
 				}
 			}
@@ -138,7 +138,7 @@ export default function DBTabs(props: DBTabsProps) {
 	onMount(() => {
 		state._id = props.id || state._id;
 
-		state._name = props.name || uuid();
+		state._name = `tabs-${props.name || uuid()}`;
 
 		state.initialized = true;
 	});