@sigil-dev/compiler 0.9.2 → 0.9.3

package/src/babel/handlers/dom/globals.ts

@@ -1,105 +1,105 @@
-import { types as t } from "@babel/core";
-
-const GLOBAL_TARGETS: Record<string, t.Expression> = {
-	Window: t.identifier("window"),
-	Document: t.identifier("document"),
-	Body: t.memberExpression(t.identifier("document"), t.identifier("body")),
-};
-
-export function isGlobalComponent(tag: string): boolean {
-	return tag in GLOBAL_TARGETS;
-}
-
-export function handleGlobalComponent(
-	tag: string,
-	node: t.JSXElement,
-	statements: t.Statement[],
-	genId: () => string,
-): string {
-	const varName = genId();
-	const targetExpr = GLOBAL_TARGETS[tag];
-
-	for (const attr of node.openingElement.attributes) {
-		if (!t.isJSXAttribute(attr)) continue;
-
-		let attrName: string;
-		if (t.isJSXNamespacedName(attr.name)) {
-			attrName = attr.name.name.name;
-		} else {
-			attrName = (attr.name as t.JSXIdentifier).name;
-		}
-
-		if (/^on[A-Z]/.test(attrName)) {
-			const event = attrName.slice(2).toLowerCase();
-			const handler = (attr.value as t.JSXExpressionContainer)
-				.expression as t.Expression;
-
-			// createEffect(() => {
-			//   if (typeof window === "undefined") return;
-			//   target.addEventListener(ev, handler);
-			//   return () => target.removeEventListener(ev, handler);
-			// })
-			statements.push(
-				t.expressionStatement(
-					t.callExpression(t.identifier("createEffect"), [
-						t.arrowFunctionExpression(
-							[],
-							t.blockStatement([
-								t.ifStatement(
-									t.binaryExpression(
-										"===",
-										//@ts-expect-error i dont think it can be undefined here
-										t.unaryExpression("typeof", targetExpr),
-										t.stringLiteral("undefined"),
-									),
-									t.returnStatement(),
-								),
-								t.expressionStatement(
-									t.callExpression(
-										t.memberExpression(
-											//@ts-expect-error i dont think it can be undefined here
-											targetExpr,
-											t.identifier("addEventListener"),
-										),
-										[t.stringLiteral(event), handler],
-									),
-								),
-								t.returnStatement(
-									t.arrowFunctionExpression(
-										[],
-										t.callExpression(
-											t.memberExpression(
-												//@ts-expect-error i dont think it can be undefined here
-												targetExpr,
-												t.identifier("removeEventListener"),
-											),
-											[t.stringLiteral(event), handler],
-										),
-									),
-								),
-							]),
-						),
-					]),
-				),
-			);
-		}
-	}
-
-	// Placeholder comment node for the component's return value
-	statements.push(
-		t.variableDeclaration("const", [
-			t.variableDeclarator(
-				t.identifier(varName),
-				t.callExpression(
-					t.memberExpression(
-						t.identifier("document"),
-						t.identifier("createComment"),
-					),
-					[t.stringLiteral(tag.toLowerCase())],
-				),
-			),
-		]),
-	);
-
-	return varName;
-}
+import { types as t } from "@babel/core";
+
+const GLOBAL_TARGETS: Record<string, t.Expression> = {
+	Window: t.identifier("window"),
+	Document: t.identifier("document"),
+	Body: t.memberExpression(t.identifier("document"), t.identifier("body")),
+};
+
+export function isGlobalComponent(tag: string): boolean {
+	return tag in GLOBAL_TARGETS;
+}
+
+export function handleGlobalComponent(
+	tag: string,
+	node: t.JSXElement,
+	statements: t.Statement[],
+	genId: () => string,
+): string {
+	const varName = genId();
+	const targetExpr = GLOBAL_TARGETS[tag];
+
+	for (const attr of node.openingElement.attributes) {
+		if (!t.isJSXAttribute(attr)) continue;
+
+		let attrName: string;
+		if (t.isJSXNamespacedName(attr.name)) {
+			attrName = attr.name.name.name;
+		} else {
+			attrName = (attr.name as t.JSXIdentifier).name;
+		}
+
+		if (/^on[A-Z]/.test(attrName)) {
+			const event = attrName.slice(2).toLowerCase();
+			const handler = (attr.value as t.JSXExpressionContainer)
+				.expression as t.Expression;
+
+			// createEffect(() => {
+			//   if (typeof window === "undefined") return;
+			//   target.addEventListener(ev, handler);
+			//   return () => target.removeEventListener(ev, handler);
+			// })
+			statements.push(
+				t.expressionStatement(
+					t.callExpression(t.identifier("createEffect"), [
+						t.arrowFunctionExpression(
+							[],
+							t.blockStatement([
+								t.ifStatement(
+									t.binaryExpression(
+										"===",
+										//@ts-expect-error i dont think it can be undefined here
+										t.unaryExpression("typeof", targetExpr),
+										t.stringLiteral("undefined"),
+									),
+									t.returnStatement(),
+								),
+								t.expressionStatement(
+									t.callExpression(
+										t.memberExpression(
+											//@ts-expect-error i dont think it can be undefined here
+											targetExpr,
+											t.identifier("addEventListener"),
+										),
+										[t.stringLiteral(event), handler],
+									),
+								),
+								t.returnStatement(
+									t.arrowFunctionExpression(
+										[],
+										t.callExpression(
+											t.memberExpression(
+												//@ts-expect-error i dont think it can be undefined here
+												targetExpr,
+												t.identifier("removeEventListener"),
+											),
+											[t.stringLiteral(event), handler],
+										),
+									),
+								),
+							]),
+						),
+					]),
+				),
+			);
+		}
+	}
+
+	// Placeholder comment node for the component's return value
+	statements.push(
+		t.variableDeclaration("const", [
+			t.variableDeclarator(
+				t.identifier(varName),
+				t.callExpression(
+					t.memberExpression(
+						t.identifier("document"),
+						t.identifier("createComment"),
+					),
+					[t.stringLiteral(tag.toLowerCase())],
+				),
+			),
+		]),
+	);
+
+	return varName;
+}

package/src/babel/handlers/dom/state.ts

@@ -1,104 +1,107 @@
-import type { NodePath } from "@babel/core";
-import { types as t } from "@babel/core";
-import { MAGIC } from "../../util/magic.ts";
-
-export function handleState(
-    declaration: NodePath<t.VariableDeclaration>,
-    declarator: NodePath<t.VariableDeclarator>,
-    init: NodePath<t.CallExpression>,
-    signals: Set<string>,
-    dev?: boolean,
-    fileKey?: string, // e.g. "src/routes/counter.tsx"
-): void {
-    const { id } = declarator.node;
-    if (!t.isIdentifier(id)) throw new Error("Destructured $state not supported");
-    const name = id.name;
-
-    // check for // @sigil:reset escape comment
-    const hasReset = declaration.node.leadingComments?.some(
-        c => c.value.trim() === "@sigil:reset"
-    );
-
-	const setCall = (value: t.Expression) =>
-		t.callExpression(
-			t.memberExpression(t.identifier(name), t.identifier("set")),
-			[value],
-		);
-	const binding = declaration.scope.getBinding(name);
-	if (!binding) return;
-	const refs       = [...binding.referencePaths];
-	const violations = [...binding.constantViolations];
-
-    const originalArgs = init.node.arguments;
-
-    if (dev && fileKey && !hasReset) {
-        const key = `${fileKey}#${name}`;
-        // createSignal(__hmrAdopt__("file#count", original))
-        init.replaceWith(
-            t.callExpression(t.identifier(MAGIC.createSignal), [
-                t.callExpression(t.identifier("__hmrAdopt__"), [
-                    t.stringLiteral(key),
-                    ...(originalArgs as t.Expression[]),
-                ]),
-            ])
-        );
-        // __hmrRegister__("file#count", count) — inserted after declaration
-        declaration.insertAfter(
-            t.expressionStatement(
-                t.callExpression(t.identifier("__hmrRegister__"), [
-                    t.stringLiteral(key),
-                    t.identifier(name),
-                ])
-            )
-        );
-    } else {
-        init.replaceWith(
-            t.callExpression(t.identifier(MAGIC.createSignal), originalArgs as t.Expression[])
-        );
-    }
-
-    declaration.node.kind = "const";
-    // ... rest of rewrites unchanged
-	// rewrite writes
-	// violations go before refs becase UpdateExpression
-	// is both a read and a write and this prevents count()++
-	for (const violation of violations) {
-		if (violation.isUpdateExpression()) {
-			const op = violation.node.operator === "++" ? "+" : "-";
-			violation.replaceWith(
-				setCall(
-					t.binaryExpression(
-						op,
-						t.callExpression(t.identifier(name), []),
-						t.numericLiteral(1),
-					),
-				),
-			);
-		} else if (violation.isAssignmentExpression()) {
-			const { operator, right } = violation.node;
-			if (operator === "=") {
-				// count = 5  ->  count.set(5)
-				violation.replaceWith(setCall(right));
-			} else {
-				// count += 2  ->  count.set(count() + 2)
-				const baseOp = operator.slice(0, -1);
-				violation.replaceWith(
-					setCall(
-						t.binaryExpression(
-							baseOp as t.BinaryExpression["operator"],
-							t.callExpression(t.identifier(name), []),
-							right,
-						),
-					),
-				);
-			}
-		}
-	}
-
-	for (const ref of refs) {
-		if (!ref.isIdentifier()) continue;
-		// weird syntax, but just swaps the read with a call.
-		ref.replaceWith(t.callExpression(ref.node, []));
-	}
-	signals.add(name);
-}
+import type { NodePath } from "@babel/core";
+import { types as t } from "@babel/core";
+import { MAGIC } from "../../util/magic.ts";
+
+export function handleState(
+	declaration: NodePath<t.VariableDeclaration>,
+	declarator: NodePath<t.VariableDeclarator>,
+	init: NodePath<t.CallExpression>,
+	signals: Set<string>,
+	dev?: boolean,
+	fileKey?: string, // e.g. "src/routes/counter.tsx"
+): void {
+	const { id } = declarator.node;
+	if (!t.isIdentifier(id)) throw new Error("Destructured $state not supported");
+	const name = id.name;
+
+	// check for // @sigil:reset escape comment
+	const hasReset = declaration.node.leadingComments?.some(
+		(c) => c.value.trim() === "@sigil:reset",
+	);
+
+	const setCall = (value: t.Expression) =>
+		t.callExpression(
+			t.memberExpression(t.identifier(name), t.identifier("set")),
+			[value],
+		);
+	const binding = declaration.scope.getBinding(name);
+	if (!binding) return;
+	const refs = [...binding.referencePaths];
+	const violations = [...binding.constantViolations];
+
+	const originalArgs = init.node.arguments;
+
+	if (dev && fileKey && !hasReset) {
+		const key = `${fileKey}#${name}`;
+		// createSignal(__hmrAdopt__("file#count", original))
+		init.replaceWith(
+			t.callExpression(t.identifier(MAGIC.createSignal), [
+				t.callExpression(t.identifier("__hmrAdopt__"), [
+					t.stringLiteral(key),
+					...(originalArgs as t.Expression[]),
+				]),
+			]),
+		);
+		// __hmrRegister__("file#count", count) — inserted after declaration
+		declaration.insertAfter(
+			t.expressionStatement(
+				t.callExpression(t.identifier("__hmrRegister__"), [
+					t.stringLiteral(key),
+					t.identifier(name),
+				]),
+			),
+		);
+	} else {
+		init.replaceWith(
+			t.callExpression(
+				t.identifier(MAGIC.createSignal),
+				originalArgs as t.Expression[],
+			),
+		);
+	}
+
+	declaration.node.kind = "const";
+	// ... rest of rewrites unchanged
+	// rewrite writes
+	// violations go before refs becase UpdateExpression
+	// is both a read and a write and this prevents count()++
+	for (const violation of violations) {
+		if (violation.isUpdateExpression()) {
+			const op = violation.node.operator === "++" ? "+" : "-";
+			violation.replaceWith(
+				setCall(
+					t.binaryExpression(
+						op,
+						t.callExpression(t.identifier(name), []),
+						t.numericLiteral(1),
+					),
+				),
+			);
+		} else if (violation.isAssignmentExpression()) {
+			const { operator, right } = violation.node;
+			if (operator === "=") {
+				// count = 5  ->  count.set(5)
+				violation.replaceWith(setCall(right));
+			} else {
+				// count += 2  ->  count.set(count() + 2)
+				const baseOp = operator.slice(0, -1);
+				violation.replaceWith(
+					setCall(
+						t.binaryExpression(
+							baseOp as t.BinaryExpression["operator"],
+							t.callExpression(t.identifier(name), []),
+							right,
+						),
+					),
+				);
+			}
+		}
+	}
+
+	for (const ref of refs) {
+		if (!ref.isIdentifier()) continue;
+		// weird syntax, but just swaps the read with a call.
+		ref.replaceWith(t.callExpression(ref.node, []));
+	}
+	signals.add(name);
+}

package/src/babel/handlers/ssr/derived.ts

@@ -1,27 +1,27 @@
-import { type NodePath, types as t } from "@babel/core";
-
-export function handleDerivedSSR(
-	declaration: NodePath<t.VariableDeclaration>,
-	declarator: NodePath<t.VariableDeclarator>,
-	init: NodePath<t.CallExpression>,
-	_signals?: Set<string>, // SSR has no reactivity, intentionally unused
-): void {
-	const { id } = declarator.node;
-	if (!t.isIdentifier(id))
-		throw new Error("Destructured $derived not supported");
-
-	// Replace $derived(expr) with () => expr (lazy evaluation)
-	init.replaceWith(
-		t.arrowFunctionExpression([], init.node.arguments[0] as t.Expression),
-	);
-	declaration.node.kind = "const";
-
-	// Replace all references to this variable with () calls
-	const binding = declaration.scope.getBinding(id.name);
-	if (!binding) return;
-	for (const ref of [...binding.referencePaths]) {
-		if (!ref.isIdentifier()) continue;
-		if (ref.parentPath?.isUpdateExpression()) continue;
-		ref.replaceWith(t.callExpression(ref.node, []));
-	}
-}
+import { type NodePath, types as t } from "@babel/core";
+
+export function handleDerivedSSR(
+	declaration: NodePath<t.VariableDeclaration>,
+	declarator: NodePath<t.VariableDeclarator>,
+	init: NodePath<t.CallExpression>,
+	_signals?: Set<string>, // SSR has no reactivity, intentionally unused
+): void {
+	const { id } = declarator.node;
+	if (!t.isIdentifier(id))
+		throw new Error("Destructured $derived not supported");
+
+	// Replace $derived(expr) with () => expr (lazy evaluation)
+	init.replaceWith(
+		t.arrowFunctionExpression([], init.node.arguments[0] as t.Expression),
+	);
+	declaration.node.kind = "const";
+
+	// Replace all references to this variable with () calls
+	const binding = declaration.scope.getBinding(id.name);
+	if (!binding) return;
+	for (const ref of [...binding.referencePaths]) {
+		if (!ref.isIdentifier()) continue;
+		if (ref.parentPath?.isUpdateExpression()) continue;
+		ref.replaceWith(t.callExpression(ref.node, []));
+	}
+}

package/src/babel/handlers/ssr/state.ts

@@ -1,11 +1,11 @@
-import type { NodePath, types as t } from "@babel/core";
-
-export function handleStateSSR(
-	declaration: NodePath<t.VariableDeclaration>,
-	_declarator: NodePath<t.VariableDeclarator>,
-	init: NodePath<t.CallExpression>,
-	_signals?: Set<string>, // SSR has no reactivity. Left in for future reference
-): void {
-	init.replaceWith(init.node.arguments[0] as t.Expression);
-	declaration.node.kind = "let";
-}
+import type { NodePath, types as t } from "@babel/core";
+
+export function handleStateSSR(
+	declaration: NodePath<t.VariableDeclaration>,
+	_declarator: NodePath<t.VariableDeclarator>,
+	init: NodePath<t.CallExpression>,
+	_signals?: Set<string>, // SSR has no reactivity. Left in for future reference
+): void {
+	init.replaceWith(init.node.arguments[0] as t.Expression);
+	declaration.node.kind = "let";
+}