From 21ba3ad8a3c56a70e315eedddefba7c93614ae39 Mon Sep 17 00:00:00 2001
From: Jonas Strehle <jonas@strehles.info>
Date: Sun, 25 May 2025 18:25:39 +0200
Subject: [PATCH] add support for rawHTML

---
 src/html/render.ts       |  5 +++++
 src/html/unsafe-html.ts  | 26 ++++++++++++++++++++++++--
 src/hydration/partial.ts | 18 ++++++++++--------
 3 files changed, 39 insertions(+), 10 deletions(-)

diff --git a/src/html/render.ts b/src/html/render.ts
index 2e2021cb4..ffa1927c0 100644
--- a/src/html/render.ts
+++ b/src/html/render.ts
@@ -17,6 +17,7 @@ import { serializeJSValue } from "../utils/serialize-js.ts";
 import { Component } from "../components/Component.ts";
 import { DX_VALUE } from "datex-core-legacy/runtime/constants.ts";
 import { resolveDependencies } from "./dependency-resolver.ts"
+import { RawHTML } from "./unsafe-html.ts";
 
 let stage:string|undefined = '?'
 
@@ -146,6 +147,10 @@ function _getOuterHTML(el:Node, opts?:_renderOptions, collectedStylesheets?:stri
 		}
 	}
 
+	if (el instanceof RawHTML) {
+        return el.html;
+    }
+
 	if (el?.[OPEN_GRAPH]) {
 		opts.extractedData.openGraph = el[OPEN_GRAPH];
 	}
diff --git a/src/html/unsafe-html.ts b/src/html/unsafe-html.ts
index e3e985dad..33523a1a4 100644
--- a/src/html/unsafe-html.ts
+++ b/src/html/unsafe-html.ts
@@ -1,7 +1,29 @@
 import { Datex } from "datex-core-legacy/mod.ts";
-import { domUtils } from "../app/dom-context.ts";
+import { domContext, domUtils } from "../app/dom-context.ts";
 import type { HTMLElement } from "../uix-dom/dom/deno-dom/src/api.ts";
 
+/**
+ * Injects raw HTML into the DOM by converting the HTML string to a DOM node
+ * @param html 
+ * @param content 
+ * @returns 
+ */
 export function unsafeHTML(html:string, content?: Datex.RefOrValue<HTMLElement>|(Datex.RefOrValue<HTMLElement>)[]) {
 	return domUtils.createHTMLElement(html, content)
-}
\ No newline at end of file
+}
+
+export class RawHTML extends domContext.HTMLElement {
+    constructor(public html: string) {
+        super()
+    }
+}
+
+/**
+ * Injects raw HTML text into the rendered HTML.
+ * This method is currently only supported for backend rendering.
+ * @param html 
+ * @returns RawHTML
+ */
+export function rawHTML(html: string) {
+    return new RawHTML(html);
+}
diff --git a/src/hydration/partial.ts b/src/hydration/partial.ts
index ae3224a0a..ed7fb57b2 100644
--- a/src/hydration/partial.ts
+++ b/src/hydration/partial.ts
@@ -1,5 +1,6 @@
 import { Datex } from "datex-core-legacy";
 import { DOMUtils } from "../uix-dom/datex-bindings/dom-utils.ts";
+import { RawHTML } from "../html/unsafe-html.ts";
 
 /**
  * Returns a list of all nodes in a DOM tree that have live pointer binding
@@ -18,14 +19,15 @@ export function getLiveNodes(treeRoot: Element, includeEventListeners = true, _l
 
 	// iterate children
 	for (const val of (serialized.content instanceof Array ? serialized.content : [serialized.content]) ?? []) {
-		if (val instanceof Element) getLiveNodes(val, includeEventListeners, _list);
-		else {
-			const ptr = Datex.Pointer.pointerifyValue(val);
-			if (ptr instanceof Datex.Pointer) {
-				isLive = true;
-			}
-		}
-	}
+        if (val instanceof RawHTML) continue;
+        if (val instanceof Element) getLiveNodes(val, includeEventListeners, _list);
+        else {
+            const ptr = Datex.Pointer.pointerifyValue(val);
+            if (ptr instanceof Datex.Pointer) {
+                isLive = true;
+            }
+        }
+    }
 	
 	if (!isLive) {
 		if (treeRoot[DOMUtils.ATTR_BINDINGS]?.size) isLive = true