@sigil-dev/compiler 0.7.7 → 0.8.2

package/package.json

@@ -2,7 +2,7 @@
   "name": "@sigil-dev/compiler",
   "module": "index.ts",
   "type": "module",
-  "version": "0.7.7",
+  "version": "0.8.2",
   "private": false,
   "description": "Compiler for the Sigil framework",
   "peerDependencies": {
@@ -23,6 +23,7 @@
   },
   "dependencies": {
     "@babel/generator": "^7.29.7",
+    "@babel/parser": "^7.29.7",
     "@babel/plugin-transform-typescript": "^8.0.0-rc.6",
     "@babel/preset-typescript": "^8.0.0-rc.6"
   }

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

@@ -4,6 +4,7 @@ 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))

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

@@ -2,8 +2,9 @@ import type { NodePath, types as t } from "@babel/core";
 
 export function handleStateSSR(
 	declaration: NodePath<t.VariableDeclaration>,
-	declarator: NodePath<t.VariableDeclarator>,
+	_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";

package/src/babel/index.ts

@@ -115,12 +115,6 @@ export default function sigilPlugin(): PluginObject {
 						"createInspectEffect",
 						"withEffectScope",
 					];
-					console.log(
-						"[sigil exit] didTransform:",
-						didTransform,
-						"withEffectScope in required:",
-						requiredSpecifiers.includes("withEffectScope"),
-					);
 					const runtimeImport = path.node.body.find(
 						(n): n is t.ImportDeclaration =>
 							t.isImportDeclaration(n) &&
@@ -128,10 +122,10 @@ export default function sigilPlugin(): PluginObject {
 					);
 
 					if (runtimeImport) {
-						console.log(
-							"[sigil exit] found existing import, specifier count:",
-							runtimeImport.specifiers.length,
-						);
+						// console.log(
+						// 	"[sigil exit] found existing import, specifier count:",
+						// 	runtimeImport.specifiers.length,
+						// );
 						const existingNames = new Set(
 							runtimeImport.specifiers
 								.filter(t.isImportSpecifier)
@@ -299,11 +293,13 @@ export default function sigilPlugin(): PluginObject {
 							const innerCallee = object.get("callee");
 							if (innerCallee.isIdentifier({ name: "$inspect" })) {
 								didTransform = true;
+								//@ts-expect-error Bizzare but it works if you read LSP
 								const args = object.node.arguments.map(wrapSignal);
 								const cb = path.node.arguments[0];
 								path.replaceWith(
 									t.callExpression(t.identifier(MAGIC.createInspectEffect), [
 										t.arrowFunctionExpression([], t.arrayExpression(args)),
+										//@ts-expect-error Bizzare but it works if you read LSP
 										cb,
 									]),
 								);
@@ -348,6 +344,7 @@ export default function sigilPlugin(): PluginObject {
 				// Handle standalone $inspect(...)
 				if (callee.isIdentifier({ name: "$inspect" })) {
 					didTransform = true;
+					//@ts-expect-error Bizzare but it works if you read LSP
 					const args = path.node.arguments.map(wrapSignal);
 					path.replaceWith(
 						t.callExpression(t.identifier(MAGIC.createInspectEffect), [

package/src/babel/jsx/children.ts

@@ -8,7 +8,7 @@ import { processFragment } from "./fragment";
  */
 export function collectChildren(
 	node: t.JSXElement,
-	statements: t.Statement[],
+	_statements: t.Statement[],
 	genId: () => string,
 	signals: Set<string>,
 	hash?: string,

package/src/babel/jsx/element.ts

@@ -1,4 +1,5 @@
 import { types as t } from "@babel/core";
+//@ts-expect-error Not our problem babel forgot tp export types.
 import { generate } from "@babel/generator";
 import {
 	handleGlobalComponent,
@@ -294,14 +295,14 @@ export function processElement(
 			if (bindProp === "group") {
 				// Scan element attributes for type and value
 				let inputType = "";
-				let inputValue: t.StringLiteral | undefined;
+				let _inputValue: t.StringLiteral | undefined;
 				for (const a of node.openingElement.attributes) {
 					if (t.isJSXAttribute(a) && t.isJSXIdentifier(a.name)) {
 						if (a.name.name === "type" && t.isStringLiteral(a.value)) {
 							inputType = a.value.value;
 						}
 						if (a.name.name === "value" && t.isStringLiteral(a.value)) {
-							inputValue = a.value;
+							_inputValue = a.value;
 						}
 					}
 				}

package/src/babel/jsx/utils.ts

@@ -6,12 +6,16 @@ export const ATTR_MAP: Record<string, string> = {
 };
 
 export function containsSignal(
-	expr: t.Expression,
+	expr: t.Expression | t.Node,
 	signals: Set<string>,
 ): boolean {
+	if (!expr) return false;
 	if (t.isIdentifier(expr)) return signals.has(expr.name);
 	if (t.isCallExpression(expr)) {
-		return containsSignal(expr.callee as t.Expression, signals);
+		return (
+			containsSignal(expr.callee as t.Expression, signals) ||
+			expr.arguments.some((a) => containsSignal(a as t.Expression, signals))
+		);
 	}
 	if (t.isBinaryExpression(expr)) {
 		return (
@@ -43,6 +47,49 @@ export function containsSignal(
 			containsSignal(e as t.Expression, signals),
 		);
 	}
+	// ── additions ──
+	if (t.isArrayExpression(expr)) {
+		return expr.elements.some(
+			(e) => e !== null && containsSignal(e as t.Expression, signals),
+		);
+	}
+	if (t.isObjectExpression(expr)) {
+		return expr.properties.some((p) => {
+			if (t.isObjectProperty(p)) {
+				const computedKey = p.computed
+					? containsSignal(p.key as t.Expression, signals)
+					: false;
+				return computedKey || containsSignal(p.value as t.Expression, signals);
+			}
+			if (t.isSpreadElement(p)) return containsSignal(p.argument, signals);
+			return false;
+		});
+	}
+	if (t.isSequenceExpression(expr)) {
+		return expr.expressions.some((e) => containsSignal(e, signals));
+	}
+	if (t.isAssignmentExpression(expr)) {
+		return containsSignal(expr.right, signals);
+	}
+	if (t.isSpreadElement(expr)) {
+		return containsSignal(expr.argument, signals);
+	}
+	// ArrowFunction/Function — don't traverse, signals inside are captured
+	// not reactive at the call site (onclick={() => count()} is fine as-is)
+	if (t.isArrowFunctionExpression(expr) || t.isFunctionExpression(expr)) {
+		return false;
+	}
+	// Babel represents ?. as distinct node types not in t.is* guards
+	if (t.isOptionalMemberExpression(expr)) {
+		return containsSignal((expr as any).object, signals);
+	}
+	if (t.isOptionalCallExpression(expr)) {
+		const n = expr as any;
+		return (
+			containsSignal(n.callee, signals) ||
+			n.arguments.some((a: t.Node) => containsSignal(a, signals))
+		);
+	}
 	return false;
 }
 

package/src/babel/util/bind.ts

@@ -75,7 +75,7 @@ export function buildBind(
 export function buildProxyBind(
 	varName: string,
 	bindProp: string,
-	attr: t.JSXAttribute,
+	_attr: t.JSXAttribute,
 	statements: t.Statement[],
 	signal: t.MemberExpression, // already form().name
 ): void {

package/src/babel/util/css.ts

@@ -1,4 +1,4 @@
-import { createHash } from "crypto";
+import { createHash } from "node:crypto";
 
 /**
  * Compute a deterministic hash from a file path.
@@ -6,7 +6,7 @@ import { createHash } from "crypto";
  * 's' prefix for Sigil.
  */
 export function computeHash(filePath: string): string {
-	return "s" + createHash("md5").update(filePath).digest("hex").slice(0, 8);
+	return `s${createHash("md5").update(filePath).digest("hex").slice(0, 8)}`;
 }
 
 /**
@@ -141,10 +141,10 @@ function rewriteSelector(selector: string, hash: string): string {
 		// Check for placeholder
 		const globalMatch = trimmed.match(/^__GLOBAL_(\d+)__$/);
 		if (globalMatch) {
-			return globals[parseInt(globalMatch[1]!)];
+			return globals[parseInt(globalMatch[1]!, 10)];
 		}
 
-		return trimmed + "." + hash;
+		return `${trimmed}.${hash}`;
 	});
 
 	return parts.join(", ");

package/src/babel/util/dead-code.ts

@@ -1,4 +1,4 @@
-import { type NodePath, types as t, traverse } from "@babel/core";
+import { type NodePath, types as t } from "@babel/core";
 
 export function warnDeadReactivity(
 	path: NodePath,
@@ -19,7 +19,7 @@ export function warnDeadReactivity(
 	for (const name of signals) {
 		if (storeSignals.has(name)) continue; // exported, used across files
 		if (!used.has(name)) {
-			const tag = filename ? `[sigil:${filename}]` : "[sigil]";
+			const tag = filename ? `[${filename}]` : "[sigil]";
 			console.warn(
 				`${tag} unused reactive declaration: "${name}" is declared with $state or $derived but never read.`,
 			);

package/src/bun-plugin.ts

@@ -73,14 +73,13 @@ export function sigil(options?: {
 				});
 				let out = transpiler.transformSync(res?.code ?? "");
 				if (scopedCSS && options?.mode !== "ssr") {
-					out =
-						`
+					out = `
 if (typeof document !== 'undefined' && !document.getElementById('sigil-${hash}')) {
     const __style = document.createElement('style');
     __style.id = 'sigil-${hash}';
     __style.textContent = ${JSON.stringify(scopedCSS)};
     document.head.appendChild(__style);
-}` + out;
+}${out}`;
 				}
 				return { contents: out, loader: "js" };
 			});

package/test/containsSignal.test.ts

@@ -0,0 +1,288 @@
+import { describe, expect, it } from "bun:test";
+import { parseExpression } from "@babel/parser";
+import type { Expression } from "@babel/types";
+import { containsSignal } from "../src/babel/jsx/utils";
+
+// Our containsSignal is so jank it needs a dedicated test suite.
+
+// ── helpers ──────────────────────────────────────────────────────────────────
+
+function parse(code: string): Expression {
+	return parseExpression(code, {
+		plugins: ["typescript", "jsx"],
+		strictMode: false,
+	}) as Expression;
+}
+
+/** Signals in scope for all tests */
+const SIG = new Set(["count", "name", "items", "user", "flag"]);
+
+function yes(code: string, msg?: string) {
+	it(msg ?? `contains signal: ${code}`, () => {
+		expect(containsSignal(parse(code), SIG)).toBe(true);
+	});
+}
+
+function no(code: string, msg?: string) {
+	it(msg ?? `no signal:       ${code}`, () => {
+		expect(containsSignal(parse(code), SIG)).toBe(false);
+	});
+}
+
+// ── Identifier ───────────────────────────────────────────────────────────────
+
+describe("Identifier", () => {
+	yes("count");
+	yes("name");
+	no("foo");
+	no("bar");
+	no("unrelated");
+});
+
+// ── CallExpression ───────────────────────────────────────────────────────────
+
+describe("CallExpression — callee", () => {
+	yes("count()");
+	yes("name()");
+	no("foo()");
+	no("Math.random()");
+});
+
+describe("CallExpression — arguments", () => {
+	yes("foo(count())");
+	yes("foo(bar, count())");
+	yes("foo(1, 2, count())");
+	yes("foo(name(), bar)");
+	no("foo(bar, baz)");
+	no("foo(1, 2, 3)");
+});
+
+describe("CallExpression — nested callee", () => {
+	yes("count()()"); // count is in SIG, callee of outer call
+	yes("foo(bar(count()))"); // signal buried in nested argument
+	no("foo(bar(baz()))");
+	no("getSignal()()"); // getSignal not in SIG — correctly false
+});
+
+// ── MemberExpression ─────────────────────────────────────────────────────────
+
+describe("MemberExpression", () => {
+	yes("count().value");
+	yes("count().nested.deep");
+	yes("name().length");
+	no("foo.bar");
+	no("obj.prop");
+	no("Math.PI");
+	no("foo.bar.baz");
+});
+
+// ── OptionalMemberExpression ─────────────────────────────────────────────────
+
+describe("OptionalMemberExpression", () => {
+	yes("count()?.value");
+	yes("count()?.foo?.bar");
+	yes("name()?.length");
+	no("foo?.bar");
+	no("obj?.prop");
+	no("foo?.bar?.baz");
+});
+
+// ── OptionalCallExpression ───────────────────────────────────────────────────
+
+describe("OptionalCallExpression", () => {
+	yes("count?.()");
+	yes("foo?.(count())");
+	yes("foo?.(bar, count())");
+	no("foo?.()");
+	no("foo?.(bar, baz)");
+});
+
+// ── BinaryExpression ─────────────────────────────────────────────────────────
+
+describe("BinaryExpression", () => {
+	yes("count() + 1");
+	yes("1 + count()");
+	yes("count() > 0");
+	yes("count() === name()");
+	yes("foo + count()");
+	no("1 + 2");
+	no("foo + bar");
+	no("'a' + 'b'");
+});
+
+// ── LogicalExpression ────────────────────────────────────────────────────────
+
+describe("LogicalExpression", () => {
+	yes("count() && foo");
+	yes("foo && count()");
+	yes("count() || name()");
+	yes("foo ?? count()");
+	no("foo && bar");
+	no("a || b");
+	no("null ?? 'default'");
+});
+
+// ── ConditionalExpression ────────────────────────────────────────────────────
+
+describe("ConditionalExpression", () => {
+	yes("count() ? 'a' : 'b'", "signal in test");
+	yes("foo ? count() : 'b'", "signal in consequent");
+	yes("foo ? 'a' : count()", "signal in alternate");
+	yes("count() ? name() : 'b'", "signal in test and consequent");
+	no("foo ? 'a' : 'b'");
+	no("true ? 1 : 0");
+});
+
+// ── UnaryExpression ──────────────────────────────────────────────────────────
+
+describe("UnaryExpression", () => {
+	yes("!count()");
+	yes("-count()");
+	yes("typeof count()");
+	no("!foo");
+	no("-1");
+	no("typeof foo");
+});
+
+// ── TemplateLiteral ──────────────────────────────────────────────────────────
+
+describe("TemplateLiteral", () => {
+	yes("`${count()}`");
+	yes("`hello ${name()}`");
+	yes("`${foo} ${count()}`");
+	yes("`${count()} and ${name()}`");
+	no("`hello world`");
+	no("`${foo}`");
+	no("`${foo} ${bar}`");
+});
+
+// ── ArrayExpression ──────────────────────────────────────────────────────────
+
+describe("ArrayExpression", () => {
+	yes("[count()]");
+	yes("[foo, count()]");
+	yes("[1, 2, count()]");
+	yes("[...count()]");
+	no("[]");
+	no("[1, 2, 3]");
+	no("[foo, bar]");
+	// sparse arrays have null holes
+	no("[,,,]", "sparse array holes");
+});
+
+// ── ObjectExpression ─────────────────────────────────────────────────────────
+
+describe("ObjectExpression", () => {
+	yes("({ a: count() })");
+	yes("({ a: foo, b: count() })");
+	yes("({ ...count() })");
+	yes("({ [name()]: 'val' })", "computed key with signal");
+	no("({})");
+	no("({ a: 1 })");
+	no("({ a: foo, b: bar })");
+	no("({ ...foo })");
+});
+
+// ── SequenceExpression ───────────────────────────────────────────────────────
+
+describe("SequenceExpression", () => {
+	yes("(foo, count())");
+	yes("(count(), foo)");
+	yes("(a, b, count())");
+	no("(a, b)");
+	no("(1, 2, 3)");
+});
+
+// ── AssignmentExpression ─────────────────────────────────────────────────────
+
+describe("AssignmentExpression", () => {
+	// only RHS matters for reactivity — LHS is where you're writing to
+	yes("x = count()");
+	yes("x += count()");
+	no("x = foo");
+	no("x = 1");
+});
+
+// ── SpreadElement ────────────────────────────────────────────────────────────
+
+describe("SpreadElement — inside array/call", () => {
+	yes("[...count()]");
+	yes("foo(...count())");
+	no("[...foo]");
+	no("foo(...bar)");
+});
+
+// ── ArrowFunctionExpression ──────────────────────────────────────────────────
+// signals inside a function body are captured at call time, not bind time —
+// making the attribute reactive would re-assign the handler on every signal change
+
+describe("ArrowFunctionExpression — must NOT traverse body", () => {
+	no("() => count()");
+	no("(x) => count() + x");
+	no("() => { return count(); }");
+	no("(e) => { count(); }");
+});
+
+// ── FunctionExpression ───────────────────────────────────────────────────────
+
+describe("FunctionExpression — must NOT traverse body", () => {
+	no("function() { return count(); }");
+	no("function handler() { count(); }");
+});
+
+// ── Literals (always false) ──────────────────────────────────────────────────
+
+describe("Literals", () => {
+	no("1");
+	no("'hello'");
+	no("true");
+	no("null");
+	no("/regex/");
+});
+
+// ── Deep nesting ─────────────────────────────────────────────────────────────
+
+describe("Deep nesting", () => {
+	yes("foo(bar(baz(count())))");
+	yes("a && b ? c + count() : d");
+	yes("`prefix_${foo ? count() : bar}`");
+	yes("[{ a: count() }]");
+	yes("({ arr: [1, count()] })");
+	yes("foo?.bar?.(count())");
+	no("foo(bar(baz(qux())))");
+	no("a && b ? c + d : e");
+});
+
+// ── Multiple signals ─────────────────────────────────────────────────────────
+
+describe("Multiple signals", () => {
+	yes("count() + name()");
+	yes("[count(), name(), items()]");
+	yes("user()?.profile ?? name()");
+	yes("flag() ? count() : name()");
+});
+
+// ── Non-signal identifiers that look similar ─────────────────────────────────
+
+describe("Near-miss identifiers", () => {
+	no("counter"); // not "count"
+	no("counted");
+	no("names"); // not "name"
+	no("userCount");
+	no("flagged");
+	no("itemsList");
+});
+
+// ── null/undefined safety ────────────────────────────────────────────────────
+
+describe("null/undefined guard", () => {
+	it("returns false for null input", () => {
+		expect(containsSignal(null as any, SIG)).toBe(false);
+	});
+	it("returns false for undefined input", () => {
+		expect(containsSignal(undefined as any, SIG)).toBe(false);
+	});
+	it("empty signal set never matches", () => {
+		expect(containsSignal(parse("count()"), new Set())).toBe(false);
+	});
+});