@sigil-dev/compiler 0.9.2 → 0.9.3

package/src/babel/jsx/text-node.ts

@@ -1,192 +1,192 @@
-import { types as t } from "@babel/core";
-
-/**
- * Create a reactive text node: `createEffect(() => node.textContent = String(expr))`
- * In hydrate mode:
- *   - Claims <!--g--> anchor via claimComment (fixes adjacent-text bug vs DOM walk)
- *   - Consumes <!--/g--> closing delimiter
- *   - Gets nextSibling as the text node; if it's not a Text (SPA navigation), creates one
- *   - Effect updates that text node's content
- * In dom mode: creates a new text node and appends it.
- */
-export function buildTextNode(
-	varName: string,
-	expr: t.Expression,
-	statements: t.Statement[],
-	genId: () => string,
-	hydrate?: boolean,
-	nodesVar?: string,
-	parentVar?: string,
-): void {
-	if (hydrate) {
-		const nodesId = t.identifier(nodesVar ?? "__nodes");
-		const parentIdent = parentVar ? t.identifier(parentVar) : undefined;
-
-		// const _anchor = claimComment(nodes, "g", parent) — claim/create <!--g-->
-		const anchorVar = genId();
-		const claimGArgs: t.Expression[] = [nodesId, t.stringLiteral("g")];
-		if (parentIdent) claimGArgs.push(parentIdent);
-		statements.push(
-			t.variableDeclaration("const", [
-				t.variableDeclarator(
-					t.identifier(anchorVar),
-					t.callExpression(t.identifier("claimComment"), claimGArgs),
-				),
-			]),
-		);
-
-		// claimComment(nodes, "/g", parent) — consume <!--/g--> from pool
-		const claimSlashGArgs: t.Expression[] = [nodesId, t.stringLiteral("/g")];
-		if (parentIdent) claimSlashGArgs.push(parentIdent);
-		statements.push(
-			t.expressionStatement(
-				t.callExpression(t.identifier("claimComment"), claimSlashGArgs),
-			),
-		);
-
-		// let _t = _anchor?.nextSibling
-		// In SSR hydration, this is the text node between the comment delimiters.
-		// In SPA navigation, this is the closing <!--/g--> (not a Text), so we create one.
-		const textVar = genId();
-		statements.push(
-			t.variableDeclaration("let", [
-				t.variableDeclarator(
-					t.identifier(textVar),
-					t.optionalMemberExpression(
-						t.identifier(anchorVar),
-						t.identifier("nextSibling"),
-						false,
-						true,
-					),
-				),
-			]),
-		);
-
-		// if (!(_t instanceof Text)) { const _nt = createTextNode(""); if (_anchor) _anchor.after(_nt); _t = _nt; }
-		const newTextVar = genId();
-		statements.push(
-			t.ifStatement(
-				t.unaryExpression(
-					"!",
-					t.parenthesizedExpression(
-						t.binaryExpression(
-							"instanceof",
-							t.identifier(textVar),
-							t.identifier("Text"),
-						),
-					),
-				),
-				t.blockStatement([
-					t.variableDeclaration("const", [
-						t.variableDeclarator(
-							t.identifier(newTextVar),
-							t.callExpression(
-								t.memberExpression(
-									t.identifier("document"),
-									t.identifier("createTextNode"),
-								),
-								[t.stringLiteral("")],
-							),
-						),
-					]),
-					t.ifStatement(
-						t.identifier(anchorVar),
-						t.expressionStatement(
-							t.callExpression(
-								t.memberExpression(
-									t.identifier(anchorVar),
-									t.identifier("after"),
-								),
-								[t.identifier(newTextVar)],
-							),
-						),
-					),
-					t.expressionStatement(
-						t.assignmentExpression(
-							"=",
-							t.identifier(textVar),
-							t.identifier(newTextVar),
-						),
-					),
-				]),
-			),
-		);
-
-		// createEffect(() => { if (_t) _t.textContent = String(expr); })
-		statements.push(
-			t.expressionStatement(
-				t.callExpression(t.identifier("createEffect"), [
-					t.arrowFunctionExpression(
-						[],
-						t.blockStatement([
-							t.ifStatement(
-								t.identifier(textVar),
-								t.expressionStatement(
-									t.assignmentExpression(
-										"=",
-										t.memberExpression(
-											t.identifier(textVar),
-											t.identifier("textContent"),
-										),
-										t.callExpression(t.identifier("String"), [expr]),
-									),
-								),
-							),
-						]),
-					),
-				]),
-			),
-		);
-		return;
-	}
-
-	// DOM mode: create text node and append
-	const textVar = genId();
-	statements.push(
-		t.variableDeclaration("const", [
-			t.variableDeclarator(
-				t.identifier(textVar),
-				t.callExpression(
-					t.memberExpression(
-						t.identifier("document"),
-						t.identifier("createTextNode"),
-					),
-					[t.stringLiteral("")],
-				),
-			),
-		]),
-	);
-
-	// createEffect(() => _t.textContent = String(expr))
-	statements.push(
-		t.expressionStatement(
-			t.callExpression(t.identifier("createEffect"), [
-				t.arrowFunctionExpression(
-					[],
-					t.blockStatement([
-						t.expressionStatement(
-							t.assignmentExpression(
-								"=",
-								t.memberExpression(
-									t.identifier(textVar),
-									t.identifier("textContent"),
-								),
-								t.callExpression(t.identifier("String"), [expr]),
-							),
-						),
-					]),
-				),
-			]),
-		),
-	);
-
-	// varName.append(_t)
-	statements.push(
-		t.expressionStatement(
-			t.callExpression(
-				t.memberExpression(t.identifier(varName), t.identifier("append")),
-				[t.identifier(textVar)],
-			),
-		),
-	);
-}
+import { types as t } from "@babel/core";
+
+/**
+ * Create a reactive text node: `createEffect(() => node.textContent = String(expr))`
+ * In hydrate mode:
+ *   - Claims <!--g--> anchor via claimComment (fixes adjacent-text bug vs DOM walk)
+ *   - Consumes <!--/g--> closing delimiter
+ *   - Gets nextSibling as the text node; if it's not a Text (SPA navigation), creates one
+ *   - Effect updates that text node's content
+ * In dom mode: creates a new text node and appends it.
+ */
+export function buildTextNode(
+	varName: string,
+	expr: t.Expression,
+	statements: t.Statement[],
+	genId: () => string,
+	hydrate?: boolean,
+	nodesVar?: string,
+	parentVar?: string,
+): void {
+	if (hydrate) {
+		const nodesId = t.identifier(nodesVar ?? "__nodes");
+		const parentIdent = parentVar ? t.identifier(parentVar) : undefined;
+
+		// const _anchor = claimComment(nodes, "g", parent) — claim/create <!--g-->
+		const anchorVar = genId();
+		const claimGArgs: t.Expression[] = [nodesId, t.stringLiteral("g")];
+		if (parentIdent) claimGArgs.push(parentIdent);
+		statements.push(
+			t.variableDeclaration("const", [
+				t.variableDeclarator(
+					t.identifier(anchorVar),
+					t.callExpression(t.identifier("claimComment"), claimGArgs),
+				),
+			]),
+		);
+
+		// claimComment(nodes, "/g", parent) — consume <!--/g--> from pool
+		const claimSlashGArgs: t.Expression[] = [nodesId, t.stringLiteral("/g")];
+		if (parentIdent) claimSlashGArgs.push(parentIdent);
+		statements.push(
+			t.expressionStatement(
+				t.callExpression(t.identifier("claimComment"), claimSlashGArgs),
+			),
+		);
+
+		// let _t = _anchor?.nextSibling
+		// In SSR hydration, this is the text node between the comment delimiters.
+		// In SPA navigation, this is the closing <!--/g--> (not a Text), so we create one.
+		const textVar = genId();
+		statements.push(
+			t.variableDeclaration("let", [
+				t.variableDeclarator(
+					t.identifier(textVar),
+					t.optionalMemberExpression(
+						t.identifier(anchorVar),
+						t.identifier("nextSibling"),
+						false,
+						true,
+					),
+				),
+			]),
+		);
+
+		// if (!(_t instanceof Text)) { const _nt = createTextNode(""); if (_anchor) _anchor.after(_nt); _t = _nt; }
+		const newTextVar = genId();
+		statements.push(
+			t.ifStatement(
+				t.unaryExpression(
+					"!",
+					t.parenthesizedExpression(
+						t.binaryExpression(
+							"instanceof",
+							t.identifier(textVar),
+							t.identifier("Text"),
+						),
+					),
+				),
+				t.blockStatement([
+					t.variableDeclaration("const", [
+						t.variableDeclarator(
+							t.identifier(newTextVar),
+							t.callExpression(
+								t.memberExpression(
+									t.identifier("document"),
+									t.identifier("createTextNode"),
+								),
+								[t.stringLiteral("")],
+							),
+						),
+					]),
+					t.ifStatement(
+						t.identifier(anchorVar),
+						t.expressionStatement(
+							t.callExpression(
+								t.memberExpression(
+									t.identifier(anchorVar),
+									t.identifier("after"),
+								),
+								[t.identifier(newTextVar)],
+							),
+						),
+					),
+					t.expressionStatement(
+						t.assignmentExpression(
+							"=",
+							t.identifier(textVar),
+							t.identifier(newTextVar),
+						),
+					),
+				]),
+			),
+		);
+
+		// createEffect(() => { if (_t) _t.textContent = String(expr); })
+		statements.push(
+			t.expressionStatement(
+				t.callExpression(t.identifier("createEffect"), [
+					t.arrowFunctionExpression(
+						[],
+						t.blockStatement([
+							t.ifStatement(
+								t.identifier(textVar),
+								t.expressionStatement(
+									t.assignmentExpression(
+										"=",
+										t.memberExpression(
+											t.identifier(textVar),
+											t.identifier("textContent"),
+										),
+										t.callExpression(t.identifier("String"), [expr]),
+									),
+								),
+							),
+						]),
+					),
+				]),
+			),
+		);
+		return;
+	}
+
+	// DOM mode: create text node and append
+	const textVar = genId();
+	statements.push(
+		t.variableDeclaration("const", [
+			t.variableDeclarator(
+				t.identifier(textVar),
+				t.callExpression(
+					t.memberExpression(
+						t.identifier("document"),
+						t.identifier("createTextNode"),
+					),
+					[t.stringLiteral("")],
+				),
+			),
+		]),
+	);
+
+	// createEffect(() => _t.textContent = String(expr))
+	statements.push(
+		t.expressionStatement(
+			t.callExpression(t.identifier("createEffect"), [
+				t.arrowFunctionExpression(
+					[],
+					t.blockStatement([
+						t.expressionStatement(
+							t.assignmentExpression(
+								"=",
+								t.memberExpression(
+									t.identifier(textVar),
+									t.identifier("textContent"),
+								),
+								t.callExpression(t.identifier("String"), [expr]),
+							),
+						),
+					]),
+				),
+			]),
+		),
+	);
+
+	// varName.append(_t)
+	statements.push(
+		t.expressionStatement(
+			t.callExpression(
+				t.memberExpression(t.identifier(varName), t.identifier("append")),
+				[t.identifier(textVar)],
+			),
+		),
+	);
+}