@sigil-dev/compiler 0.9.4 → 0.9.5

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";
+}

package/src/babel/index.ts

@@ -25,6 +25,14 @@ const SSR_HELPERS = template.statements.ast(`
         if (v?.[__SAFE]) return v.v;
         if (Array.isArray(v)) return v.map(x => x?.[__SAFE] ? x.v : __e(x)).join('');
         if (v === false || v === null || v === undefined) return '';
+        if (typeof v === 'object' && v.constructor === Object) {
+            const UNITLESS = new Set(['animationIterationCount','borderImageOutset','borderImageSlice','borderImageWidth','boxFlex','boxFlexGroup','boxSnapAfterPatch','boxSupress','columnCount','columnFlex','columnFlexGrow','columns','flexGrow','flexPositive','flexShrink','flexNegative','fontWeight','gridArea','gridRow','gridRowEnd','gridRowSpan','gridRowStart','gridColumn','gridColumnEnd','gridColumnSpan','gridColumnStart','lineClamp','lineHeight','opacity','order','orphans','tabSize','widows','zIndex','zoom','fillOpacity','floodOpacity','stopOpacity','strokeDasharray','strokeDashoffset','strokeMiterlimit','strokeOpacity','strokeWidth']);
+            return Object.entries(v).map(([k, val]) => {
+                const prop = k.replace(/([A-Z])/g, '-$1').toLowerCase();
+                if (typeof val === 'number' && !UNITLESS.has(k)) return prop + ':' + val + 'px';
+                return prop + ':' + val;
+            }).join(';');
+        }
         return String(v).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
     };
 `);