diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts
index 6461d8ddb822..44d9b9041581 100644
--- a/packages/main/src/TextArea.ts
+++ b/packages/main/src/TextArea.ts
@@ -395,7 +395,7 @@ class TextArea extends UI5Element implements IFormInputElement {
 
 	_onfocusout(e: FocusEvent) {
 		const eTarget = e.relatedTarget as HTMLElement;
-		const focusedOutToValueStateMessage = eTarget?.shadowRoot?.querySelector(".ui5-valuestatemessage-root");
+		const focusedOutToValueStateMessage = eTarget && this.contains(eTarget);
 
 		this.focused = false;
 
@@ -577,7 +577,7 @@ class TextArea extends UI5Element implements IFormInputElement {
 		}
 
 		if (this.hasCustomValueState) {
-			return `${this.valueStateTypeMappings[this.valueState]}`.concat(" ", this.valueStateMessageText.map(el => el.textContent).join(" "));
+			return `${this.valueStateTypeMappings[this.valueState]}`.concat(" ", this.valueStateMessage.map(el => el.textContent).join(" "));
 		}
 
 		return `${this.valueStateTypeMappings[this.valueState]} ${this.valueStateDefaultText}`;
@@ -611,10 +611,6 @@ class TextArea extends UI5Element implements IFormInputElement {
 		return this.valueState === ValueState.Negative || this.valueState === ValueState.Critical || this.valueState === ValueState.Information;
 	}
 
-	get valueStateMessageText() {
-		return this.valueStateMessage.map(x => x.cloneNode(true));
-	}
-
 	get _valueStatePopoverHorizontalAlign(): `${PopoverHorizontalAlign}` {
 		return this.effectiveDir !== "rtl" ? "Start" : "End";
 	}
diff --git a/packages/main/src/TextAreaPopover.hbs b/packages/main/src/TextAreaPopover.hbs
index 1f6b0dce66d8..eebf0cf14eea 100644
--- a/packages/main/src/TextAreaPopover.hbs
+++ b/packages/main/src/TextAreaPopover.hbs
@@ -18,9 +18,7 @@
 
 {{#*inline "valueStateMessage"}}
 	{{#if hasCustomValueState}}
-		{{#each valueStateMessageText}}
-			{{this}}
-		{{/each}}
+		<slot name="valueStateMessage"></slot>
 	{{else}}
 		{{valueStateDefaultText}}
 	{{/if}}
diff --git a/packages/main/test/pages/TextArea.html b/packages/main/test/pages/TextArea.html
index 56a9c2eba6ca..f8e75488522d 100644
--- a/packages/main/test/pages/TextArea.html
+++ b/packages/main/test/pages/TextArea.html
@@ -54,7 +54,11 @@
 
 		<br>
 		<br>
-		<ui5-textarea rows="1" id="basic-textarea-error" placeholder="Placeholder" value-state="Negative"></ui5-textarea>
+		<ui5-textarea rows="1" id="basic-textarea-error" placeholder="Placeholder" value-state="Negative">
+			<div slot="valueStateMessage">
+				This is a random value state message text with a <a href="#" _target="blank">Link</a>.
+			</div>
+		</ui5-textarea>
 
 		<br>
 		<br>