@human-synthesis/norns-core 0.0.5 → 0.0.7

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2026 Human Synthesis
+Copyright (c) 2026 Daniel Teodoroiu / Human Synthesis
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,13 +1,25 @@
-# @human-synthesis/norns-core
+# Norns Core
 
-Svelte with CoffeeScript, Pug, and UnoCSS preconfigured.
+**AI-driven software architecture and development framework, based on Svelte.**
+
+Svelte preprocessor for the Norns stack: **Pug + Civet** in `.n` files. The `.c` extension is recognised as an alias for `.civet` — both compile through Civet. CoffeeScript is no longer supported.
+
+## Stack
+
+- [Svelte 5](https://svelte.dev) — components and runes
+- [Pug](https://pugjs.org) — templates
+- [Civet](https://civet.dev) — script (TypeScript-flavored, indented)
+- [Vite](https://vitejs.dev) — bundler
+- [bun](https://bun.sh) — runtime / package manager
 
 ## Install
 
 ```sh
-pnpm add -D @human-synthesis/norns-core svelte unocss vite
+bun add -D @human-synthesis/norns-core svelte
 ```
 
+Most users want the umbrella package [`@human-synthesis/norns`](https://github.com/human-synthesis/norns) instead — it adds the SvelteKit config, the Vite plugin, and the runtime layer.
+
 ## Usage
 
 `svelte.config.js`:
@@ -16,47 +28,19 @@ pnpm add -D @human-synthesis/norns-core svelte unocss vite
 import { nornsPreprocess } from '@human-synthesis/norns-core/preprocess';
 
 export default {
+  extensions: ['.svelte', '.n'],
   preprocess: nornsPreprocess()
 };
 ```
 
-`vite.config.js`:
-
-```js
-import { defineConfig } from 'vite';
-import { svelte } from '@sveltejs/vite-plugin-svelte';
-import { nornsUno } from '@human-synthesis/norns-core/uno';
-
-export default defineConfig({
-  plugins: [nornsUno(), svelte()]
-});
-```
-
-## Writing components
-
-```svelte
-<template lang="pug">
-  h1.text-3xl.font-bold Hello {name}
-  button(on:click="{increment}") count is {count}
-</template>
-
-<script lang="coffee">
-  export let name = 'world'
-  count = 0
-  increment = -> count++
-</script>
-```
-
-## Why this exists
-
-Norns wraps Svelte with the language and styling defaults we like:
-
-- **CoffeeScript** in `<script lang="coffee">` blocks
-- **Pug** in `<template lang="pug">` blocks
-- **UnoCSS** with `presetUno`, `presetAttributify`, `presetIcons`, `presetTypography` enabled
+## What it does
 
-The wrapper is intentionally thin — under the hood it's just `svelte-preprocess` and `unocss/vite` with reasonable defaults. Override anything by passing options.
+- `.n` files default `<script>` to `lang="civet"` and `<template>` to `lang="pug"` — write neither attribute and it just works.
+- `<script lang="civet">` blocks are compiled to JavaScript via [@danielx/civet](https://civet.dev) before svelte-preprocess sees them.
+- Top-level Pug-only content is auto-wrapped in `<template lang="pug">` so you don't need the wrapper boilerplate.
+- Pug class shorthand is rewritten so Tailwind variants (`.hover:bg-X`) and fractional values (`.gap-2.5`) work without escaping.
+- `+if` / `+elseif` / `+else` chains are rewritten to Svelte block syntax (`{#if}/{:else if}/{:else}/{/if}`).
 
-## License & attribution
+## License
 
-MIT © Human Synthesis. Built on top of [Svelte](https://github.com/sveltejs/svelte) © Svelte Contributors, MIT licensed.
+MIT © Daniel Teodoroiu / [Human Synthesis](https://humansynthesis.ai). Built on top of [Svelte](https://github.com/sveltejs/svelte) © Svelte Contributors, MIT licensed.

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@human-synthesis/norns-core",
-  "version": "0.0.5",
-  "description": "Norns core — Svelte with CoffeeScript, Pug, and UnoCSS preconfigured",
+  "version": "0.0.7",
+  "description": "Norns core — Svelte preprocessor for Civet, Pug, and .n files",
   "license": "MIT",
-  "author": "Human Synthesis",
+  "author": "Daniel Teodoroiu (https://humansynthesis.ai)",
   "type": "module",
   "repository": {
     "type": "git",
@@ -13,22 +13,19 @@
     "src",
     "README.md"
   ],
+  "scripts": {
+    "test": "bun test"
+  },
   "exports": {
     ".": "./src/index.js",
     "./preprocess": "./src/preprocess.js",
-    "./uno": "./src/uno.js",
     "./package.json": "./package.json"
   },
   "peerDependencies": {
-    "svelte": "^5.0.0",
-    "unocss": "^0.65.0",
-    "vite": "^5.0.0 || ^6.0.0"
+    "svelte": "^5.0.0"
   },
   "dependencies": {
-    "@unocss/extractor-pug": "^0.65.0 || ^66.0.0",
-    "acorn": "^8.14.0",
-    "coffeescript": "^2.7.0",
-    "magic-string": "^0.30.10",
+    "@danielx/civet": "^0.11.0",
     "pug": "^3.0.3",
     "svelte-preprocess": "^6.0.3"
   },

package/src/index.js

@@ -1,2 +1 @@
-export { nornsPreprocess, fuseRuneDeclarations } from './preprocess.js';
-export { nornsUno } from './uno.js';
+export { nornsPreprocess } from './preprocess.js';

package/src/preprocess.js

@@ -1,193 +1,399 @@
 import { sveltePreprocess } from 'svelte-preprocess';
-import { parse } from 'acorn';
-import MagicString from 'magic-string';
-
-const RUNES = new Set([
-	'$state',
-	'$state.raw',
-	'$derived',
-	'$derived.by',
-	'$effect',
-	'$effect.pre',
-	'$effect.root',
-	'$props',
-	'$bindable'
-]);
-
-function isRuneCall(node) {
-	if (!node || node.type !== 'CallExpression') return false;
-	const c = node.callee;
-	if (c.type === 'Identifier') return RUNES.has(c.name);
-	if (c.type === 'MemberExpression' && c.object.type === 'Identifier') {
-		return RUNES.has(`${c.object.name}.${c.property.name}`);
+import { compile as compileCivet } from '@danielx/civet';
+
+export { transformIfChains, transformSnippets, rewritePugClasses };
+
+
+const SCRIPT_TAG = /<script\b([^>]*)>/i;
+const TEMPLATE_TAG = /<template\b([^>]*)>/i;
+
+function hasLangAttr(attrs) {
+	return /\blang\s*=/.test(attrs || '');
+}
+
+/**
+ * For .norn files: inject lang="civet" / lang="pug" defaults on
+ * <script> and <template> blocks, and auto-wrap any top-level non-script /
+ * non-style content in <template lang="pug">.
+ */
+/**
+ * If a .n file ends with an opening <script> or <style> tag but no matching
+ * close before EOF, append the closing tag. Lets users skip the boilerplate
+ * when the block is the very last thing in the file.
+ */
+function autoCloseTrailingBlock(content) {
+	let out = content;
+	for (const tag of ['script', 'style']) {
+		const opens = (out.match(new RegExp(`<${tag}\\b[^>]*>`, 'gi')) ?? []).length;
+		const closes = (out.match(new RegExp(`</${tag}>`, 'gi')) ?? []).length;
+		if (opens > closes) {
+			out = out.replace(/\s*$/, `\n</${tag}>\n`);
+		}
 	}
-	return false;
+	return out;
+}
+
+const IF_RE = /^(\s*)\+if\s*\((.+)\)\s*$/;
+const ELSEIF_RE_TPL = (ind) => new RegExp(`^${escapeRegex(ind)}\\+elseif\\s*\\((.+)\\)\\s*$`);
+const ELSE_RE_TPL = (ind) => new RegExp(`^${escapeRegex(ind)}\\+else\\s*$`);
+
+// `+snippet('name')` or `+snippet('name', arg1, arg2)`. Lazy match with `$`
+// anchor lets the args list contain parens (e.g. `+snippet('row', fn(a))`)
+// because the engine extends the lazy capture only until the outer `)` lands
+// at end-of-line.
+const SNIPPET_RE = /^(\s*)\+snippet\s*\(\s*['"](\w+)['"](?:\s*,\s*([\s\S]+?))?\s*\)\s*$/;
+
+function escapeRegex(s) {
+	return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function stripQuotes(s) {
+	s = s.trim();
+	if (s.length >= 2) {
+		const first = s[0];
+		const last = s[s.length - 1];
+		if ((first === "'" || first === '"') && first === last) return s.slice(1, -1);
+	}
+	return s;
+}
+
+function detectIndentDiff(lines, fromIdx, parentIndent) {
+	for (let j = fromIdx; j < lines.length; j++) {
+		const line = lines[j];
+		if (line.trim() === '') continue;
+		const m = line.match(/^(\s*)/);
+		if (m && m[1].length > parentIndent.length) {
+			return m[1].slice(parentIndent.length);
+		}
+		break;
+	}
+	return '\t';
 }
 
 /**
- * Fuse `var X; X = expr` patterns (CoffeeScript output) into `let X = expr`,
- * so Svelte 5 accepts runes in declaration position and doesn't warn about
- * non-state variables being "updated".
+ * Find the position of the matching `)` for an `(` at `start`, respecting
+ * nested parens and quoted strings.
+ */
+function findMatchingParen(str, start) {
+	if (str[start] !== '(') return -1;
+	let depth = 1;
+	let inSingle = false;
+	let inDouble = false;
+	for (let i = start + 1; i < str.length; i++) {
+		const c = str[i];
+		if (inSingle) {
+			if (c === "'" && str[i - 1] !== '\\') inSingle = false;
+		} else if (inDouble) {
+			if (c === '"' && str[i - 1] !== '\\') inDouble = false;
+		} else {
+			if (c === "'") inSingle = true;
+			else if (c === '"') inDouble = true;
+			else if (c === '(') depth++;
+			else if (c === ')') {
+				depth--;
+				if (depth === 0) return i;
+			}
+		}
+	}
+	return -1;
+}
+
+const PUG_CLASS_SPECIAL = /[:.\/]/;
+
+/**
+ * Rewrite Pug element lines whose class shorthand contains characters Pug's
+ * lexer rejects (`:`, `/`) or that Pug already mis-parses (fractional `.\d+`
+ * continuations like `.gap-2.5`). Route those classes from shorthand into the
+ * `(class="...")` attribute. Pug then sees only safe class shorthand.
  *
- * Also handles `var X; ({X, ...} = $props())` (destructured props).
+ * Examples:
+ *   `.text-blue.hover:bg-red(href="/")`
+ *     → `.text-blue(class="hover:bg-red" href="/")`
+ *   `.gap-2.5.flex`
+ *     → `.flex(class="gap-2.5")`
+ *   `.bg-white/40.text-4xl(class="static")`
+ *     → `.text-4xl(class="bg-white/40 static")`
  *
- * Walks function bodies recursively so closures get the same treatment.
+ * Skips lines inside `<script>` / `<style>` blocks.
  */
-export function fuseRuneDeclarations(code) {
-	let ast;
-	try {
-		ast = parse(code, {
-			ecmaVersion: 'latest',
-			sourceType: 'module',
-			allowReturnOutsideFunction: true,
-			allowAwaitOutsideFunction: true
-		});
-	} catch {
-		return code;
+function rewritePugClasses(content) {
+	const blockRanges = [];
+	const blockRe = /<(script|style)\b[^>]*>[\s\S]*?<\/\1>/gi;
+	let m;
+	while ((m = blockRe.exec(content)) !== null) {
+		blockRanges.push([m.index, m.index + m[0].length]);
 	}
 
-	const s = new MagicString(code);
-	walkBody(ast.body);
+	const lines = content.split('\n');
+	let offset = 0;
+	const out = lines.map((line) => {
+		const lineEnd = offset + line.length;
+		const inBlock = blockRanges.some(([s, e]) => offset < e && lineEnd > s);
+		const result = inBlock ? line : rewritePugLine(line);
+		offset = lineEnd + 1; // +1 for the newline
+		return result;
+	});
+	return out.join('\n');
+}
 
-	function walkBody(body) {
-		const fused = new Set();
-		const varStmts = [];
-		const claimed = new Set();
+function rewritePugLine(line) {
+	const trimmed = line.trimStart();
+	if (!trimmed) return line;
+	const first = trimmed[0];
+	if (first === '|' || first === '<') return line; // text emit / raw HTML
+	if (trimmed.startsWith('//')) return line; // pug comment
+	if (first === '+' || first === ':') return line; // mixin call / pug filter
 
-		for (let i = 0; i < body.length; i++) {
-			const stmt = body[i];
+	let i = 0;
+	while (i < line.length && /\s/.test(line[i])) i++;
+	const indent = line.slice(0, i);
 
-			if (stmt.type === 'VariableDeclaration' && stmt.kind === 'var') {
-				varStmts.push(stmt);
-				continue;
-			}
-			if (stmt.type !== 'ExpressionStatement') continue;
-			const e = stmt.expression;
-
-			// Pattern: X = expr  (where X was declared via var earlier in this scope)
-			if (
-				e.type === 'AssignmentExpression' &&
-				e.operator === '=' &&
-				e.left.type === 'Identifier' &&
-				isVarDeclared(varStmts, e.left.name) &&
-				!claimed.has(e.left.name)
-			) {
-				claimed.add(e.left.name);
-				fused.add(e.left.name);
-				const init = code.slice(e.right.start, e.right.end);
-				const keyword = isRuneCall(e.right) ? 'let' : 'let';
-				s.overwrite(stmt.start, stmt.end, `${keyword} ${e.left.name} = ${init};`);
-				continue;
-			}
+	let tag = '';
+	if (i < line.length && /[a-zA-Z]/.test(line[i])) {
+		let j = i;
+		while (j < line.length && /[\w-]/.test(line[j])) j++;
+		tag = line.slice(i, j);
+		i = j;
+	}
 
-			// Pattern: ({X, Y} = $props())  →  let {X, Y} = $props()
-			if (
-				e.type === 'AssignmentExpression' &&
-				e.operator === '=' &&
-				e.left.type === 'ObjectPattern' &&
-				isRuneCall(e.right)
-			) {
-				const names = collectPatternNames(e.left);
-				if (names.every((n) => isVarDeclared(varStmts, n) && !claimed.has(n))) {
-					for (const n of names) {
-						claimed.add(n);
-						fused.add(n);
-					}
-					const lhs = code.slice(e.left.start, e.left.end);
-					const rhs = code.slice(e.right.start, e.right.end);
-					s.overwrite(stmt.start, stmt.end, `let ${lhs} = ${rhs};`);
-				}
+	const segs = [];
+	while (i < line.length && (line[i] === '.' || line[i] === '#')) {
+		const sep = line[i];
+		let j = i + 1;
+		if (sep === '#') {
+			while (j < line.length && /[\w-]/.test(line[j])) j++;
+		} else {
+			// class — extend chars to allow `/`, `:`, plus fractional `.\d+` suffixes
+			while (j < line.length && /[\w/:-]/.test(line[j])) j++;
+			while (j < line.length && line[j] === '.' && /\d/.test(line[j + 1] || '')) {
+				j++;
+				while (j < line.length && /\d/.test(line[j])) j++;
 			}
 		}
+		if (j === i + 1) break; // empty token, abort
+		segs.push(line.slice(i, j));
+		i = j;
+	}
 
-		for (const stmt of varStmts) {
-			const remaining = stmt.declarations.filter(
-				(d) => !(d.id.type === 'Identifier' && fused.has(d.id.name))
-			);
-			if (remaining.length === 0) {
-				s.remove(stmt.start, stmt.end);
-			} else if (remaining.length < stmt.declarations.length) {
-				const rebuilt = remaining
-					.map((d) =>
-						d.init ? `${d.id.name} = ${code.slice(d.init.start, d.init.end)}` : d.id.name
-					)
-					.join(', ');
-				s.overwrite(stmt.start, stmt.end, `var ${rebuilt};`);
-			}
+	if (segs.length === 0) return line;
+
+	let attrs = '';
+	if (line[i] === '(') {
+		const close = findMatchingParen(line, i);
+		if (close !== -1) {
+			attrs = line.slice(i, close + 1);
+			i = close + 1;
 		}
+	}
+	const rest = line.slice(i);
 
-		// Recurse into nested function bodies (closures)
-		for (const stmt of body) {
-			recurseInto(stmt);
+	const safe = [];
+	const routed = [];
+	for (const seg of segs) {
+		if (seg[0] === '#') {
+			safe.push(seg);
+		} else {
+			const cls = seg.slice(1);
+			if (PUG_CLASS_SPECIAL.test(cls)) routed.push(cls);
+			else safe.push(seg);
 		}
 	}
 
-	function recurseInto(node) {
-		if (!node || typeof node !== 'object') return;
-		if (Array.isArray(node)) {
-			node.forEach(recurseInto);
-			return;
+	if (routed.length === 0) return line;
+
+	const newAttrs = mergeClassIntoAttrs(attrs, routed);
+	return `${indent}${tag}${safe.join('')}${newAttrs}${rest}`;
+}
+
+function mergeClassIntoAttrs(attrsStr, classesToAdd) {
+	const classStr = classesToAdd.join(' ');
+	if (!attrsStr) return `(class="${classStr}")`;
+	const inner = attrsStr.slice(1, -1);
+
+	// Existing static `class="..."` → prepend our routed classes.
+	const staticRe = /((?:^|\s)class\s*=\s*)"([^"]*)"/;
+	if (staticRe.test(inner)) {
+		return `(${inner.replace(staticRe, (_, prefix, val) => `${prefix}"${classStr} ${val}"`)})`;
+	}
+	// Existing dynamic `class!="{expr}"` → prepend static text. Svelte parses
+	// the resulting `class="static {expr}"` as text + interpolation.
+	const dynamicRe = /((?:^|\s)class\s*!=\s*)"([^"]*)"/;
+	if (dynamicRe.test(inner)) {
+		return `(${inner.replace(dynamicRe, (_, prefix, val) => `${prefix}"${classStr} ${val}"`)})`;
+	}
+
+	// No class= attribute exists — insert one.
+	return `(class="${classStr}" ${inner})`;
+}
+
+/**
+ * Rewrite Pug `+if('expr') / +elseif('expr') / +else` chains to raw Svelte
+ * block syntax emitted via Pug `|` text. Bypasses svelte-preprocess's `+if`
+ * mixin (which doesn't support chaining).
+ *
+ * Input:
+ *   +if('a')
+ *     div one
+ *   +elseif('b')
+ *     div two
+ *   +else
+ *     div three
+ *
+ * Output:
+ *   | {#if a}
+ *   div one
+ *   | {:else if b}
+ *   div two
+ *   | {:else}
+ *   div three
+ *   | {/if}
+ */
+function transformIfChains(content) {
+	const lines = content.split('\n');
+	const out = [];
+	let i = 0;
+
+	while (i < lines.length) {
+		const m = lines[i].match(IF_RE);
+		if (!m) {
+			out.push(lines[i]);
+			i++;
+			continue;
 		}
-		if (node.type === 'FunctionDeclaration' || node.type === 'FunctionExpression' || node.type === 'ArrowFunctionExpression') {
-			if (node.body && node.body.type === 'BlockStatement') {
-				walkBody(node.body.body);
-				return;
+
+		const chainIndent = m[1];
+		const ifExpr = stripQuotes(m[2]);
+		const indentDiff = detectIndentDiff(lines, i + 1, chainIndent);
+		const elseIfRe = ELSEIF_RE_TPL(chainIndent);
+		const elseRe = ELSE_RE_TPL(chainIndent);
+
+		out.push(`${chainIndent}| {#if ${ifExpr}}`);
+		i++;
+
+		while (i < lines.length) {
+			const cur = lines[i];
+
+			const eIfM = cur.match(elseIfRe);
+			if (eIfM) {
+				out.push(`${chainIndent}| {:else if ${stripQuotes(eIfM[1])}}`);
+				i++;
+				continue;
+			}
+			const eM = cur.match(elseRe);
+			if (eM) {
+				out.push(`${chainIndent}| {:else}`);
+				i++;
+				continue;
 			}
-		}
-		for (const key of Object.keys(node)) {
-			if (key === 'parent' || key === 'loc' || key === 'range') continue;
-			recurseInto(node[key]);
-		}
-	}
 
-	function isVarDeclared(varStmts, name) {
-		for (const stmt of varStmts) {
-			for (const d of stmt.declarations) {
-				if (d.id.type === 'Identifier' && d.id.name === name && !d.init) {
-					return true;
-				}
+			if (cur.trim() === '') {
+				out.push(cur);
+				i++;
+				continue;
 			}
-		}
-		return false;
-	}
 
-	function collectPatternNames(pat) {
-		const names = [];
-		if (pat.type === 'ObjectPattern') {
-			for (const prop of pat.properties) {
-				if (prop.type === 'Property' && prop.value.type === 'Identifier') names.push(prop.value.name);
-				else if (prop.type === 'RestElement' && prop.argument.type === 'Identifier')
-					names.push(prop.argument.name);
+			const lineIndent = cur.match(/^(\s*)/)[1];
+			if (lineIndent.length > chainIndent.length) {
+				// Body line — de-indent by one level so it sits at the chain's level.
+				out.push(cur.startsWith(indentDiff) ? cur.slice(indentDiff.length) : cur);
+				i++;
+				continue;
 			}
+
+			break;
 		}
-		return names;
+
+		out.push(`${chainIndent}| {/if}`);
 	}
 
-	return s.toString();
+	return out.join('\n');
 }
 
-const SCRIPT_TAG = /<script\b([^>]*)>/i;
-const TEMPLATE_TAG = /<template\b([^>]*)>/i;
+/**
+ * Rewrite Pug `+snippet('name', args…)` blocks to Svelte 5 `{#snippet name(args)}`
+ * via Pug `|` text emit. Recurses into the body so nested snippets work
+ * (`Tabs > +snippet('item', tab) > Card > +snippet('header')`).
+ *
+ * Input:
+ *   +snippet('header')
+ *     h2 Title
+ *
+ *   +snippet('row', user, idx)
+ *     .row Hello {user.name} {idx}
+ *
+ * Output:
+ *   | {#snippet header()}
+ *   h2 Title
+ *   | {/snippet}
+ *
+ *   | {#snippet row(user, idx)}
+ *   .row Hello {user.name} {idx}
+ *   | {/snippet}
+ */
+function transformSnippets(content) {
+	const lines = content.split('\n');
+	const out = [];
+	let i = 0;
 
-function hasLangAttr(attrs) {
-	return /\blang\s*=/.test(attrs || '');
+	while (i < lines.length) {
+		const m = lines[i].match(SNIPPET_RE);
+		if (!m) {
+			out.push(lines[i]);
+			i++;
+			continue;
+		}
+
+		const indent = m[1];
+		const name = m[2];
+		const args = m[3] ? m[3].trim() : '';
+		const indentDiff = detectIndentDiff(lines, i + 1, indent);
+
+		out.push(`${indent}| {#snippet ${name}(${args})}`);
+		i++;
+
+		// Collect body lines (more indented than the +snippet header) and
+		// process them recursively so nested +snippet blocks resolve.
+		/** @type {string[]} */
+		const body = [];
+		while (i < lines.length) {
+			const cur = lines[i];
+
+			if (cur.trim() === '') {
+				body.push(cur);
+				i++;
+				continue;
+			}
+
+			const lineIndent = cur.match(/^(\s*)/)[1];
+			if (lineIndent.length > indent.length) {
+				body.push(cur.startsWith(indentDiff) ? cur.slice(indentDiff.length) : cur);
+				i++;
+				continue;
+			}
+
+			break;
+		}
+
+		if (body.length > 0) out.push(transformSnippets(body.join('\n')));
+		out.push(`${indent}| {/snippet}`);
+	}
+
+	return out.join('\n');
 }
 
-/**
- * For .norn files: inject lang="coffee" / lang="pug" defaults on
- * <script> and <template> blocks, and auto-wrap any top-level non-script /
- * non-style content in <template lang="pug">.
- */
 function nornDefaultLangs() {
 	return {
 		name: 'norns-default-langs',
 		markup({ content, filename }) {
-			if (!filename || !filename.endsWith('.norn')) return null;
+			if (!filename || !filename.endsWith('.n')) return null;
 
-			let out = content;
+			let out = autoCloseTrailingBlock(content);
+			out = transformIfChains(out);
+			out = transformSnippets(out);
+			out = rewritePugClasses(out);
 
 			// If no <template> exists, scan for script/style blocks and wrap the rest.
-			if (!TEMPLATE_TAG.test(content)) {
+			if (!TEMPLATE_TAG.test(out)) {
 				const blocks = [];
 				const blockRe = /<(script|style)\b[^>]*>[\s\S]*?<\/\1>/gi;
 				let m;
@@ -211,9 +417,9 @@ function nornDefaultLangs() {
 				}
 			}
 
-			// Inject lang="coffee" on <script> tags missing lang=
+			// Inject lang="civet" on <script> tags missing lang=
 			out = out.replace(SCRIPT_TAG, (full, attrs) =>
-				hasLangAttr(attrs) ? full : `<script lang="coffee"${attrs}>`
+				hasLangAttr(attrs) ? full : `<script lang="civet"${attrs}>`
 			);
 
 			// Inject lang="pug" on <template> tags missing lang=
@@ -226,37 +432,82 @@ function nornDefaultLangs() {
 	};
 }
 
-function nornCoffeeRuneFusion() {
+/**
+ * Compile `<script lang="civet">` blocks to JavaScript via Civet.
+ *
+ * Runs before svelte-preprocess so that downstream stages see plain JS.
+ * Civet emits source maps; we forward them so devtools can resolve back to
+ * the original `.civet` source.
+ *
+ * Civet's emit characteristics (verified May 2026, civet@0.11):
+ *   - `count .= $state 0`           → `let count = $state(0)`
+ *   - `count := $state 0`           → `const count = $state(0)`
+ *   - `{ a, b = 0 } := $props()`    → `const { a, b = 0 } = $props()`
+ *   - imports stay where written; if user writes them at top, output is fine
+ *
+ * No `var X; X = expr` split, so `nornCoffeeRuneFusion` and
+ * `nornsCoffeeImportLift` aren't needed for Civet sources.
+ */
+function nornsCivetScript() {
 	return {
-		name: 'norns-coffee-rune-fusion',
-		script({ content, attributes }) {
-			if (attributes.lang !== 'coffee' && attributes.lang !== 'coffeescript') return null;
-			const code = fuseRuneDeclarations(content);
-			return code === content ? null : { code };
+		name: 'norns-civet-script',
+		async script({ content, attributes, filename }) {
+			if (attributes.lang !== 'civet' && attributes.lang !== 'cv') return null;
+			const result = await compileCivet(content, {
+				js: true,
+				sourceMap: true,
+				filename: filename ?? 'unknown'
+			});
+			// Drop the `lang` attribute so svelte-preprocess doesn't try to load
+			// a `./transformers/civet` module — at this point the script body is
+			// already plain JS, no further script-level transform needed.
+			const { lang: _drop, ...nextAttrs } = attributes;
+			return {
+				code: result.code,
+				map: result.sourceMap?.json?.(filename ?? 'unknown') ?? null,
+				attributes: nextAttrs
+			};
 		}
 	};
 }
 
+
 /**
  * Norns preprocessor stack.
  *
- * - `.norn` files default `<script>` to CoffeeScript and `<template>` to Pug
- *   (and auto-wrap top-level content in `<template lang="pug">` if no
- *   template block is present).
- * - CoffeeScript output is post-processed: `var X; X = expr` patterns become
- *   `let X = expr` so Svelte 5 runes work without backtick-embedded JS and
- *   normal variables/functions don't trigger non-reactive warnings.
+ * - `.norn` files default `<script>` to Civet and `<template>` to Pug (and
+ *   auto-wrap top-level content in `<template lang="pug">` if no template
+ *   block is present).
+ * - `<script lang="civet">` blocks are compiled to JS via @danielx/civet
+ *   before svelte-preprocess sees them. Civet emits ESM-correct
+ *   `let count = $state(0)` directly, so no rune-fusion or import-lift
+ *   passes are needed.
+ *
+ * CoffeeScript is no longer supported — `lang="coffee"` will fail. Use
+ * `lang="civet"` (or omit lang and rely on the default).
  *
  * @param {import('svelte-preprocess').AutoPreprocessOptions} [options]
  */
 export function nornsPreprocess(options = {}) {
 	return [
 		nornDefaultLangs(),
+		nornsCivetScript(),
 		sveltePreprocess({
-			coffeescript: { bare: true },
 			pug: {},
+			typescript: {
+				compilerOptions: {
+					// Silence TS 6.x's deprecation warning for older moduleResolution
+					// values (node10) that some toolchains still default to.
+					ignoreDeprecations: '6.0',
+					// Preserve value imports (Svelte component imports look "unused"
+					// to the TS transpiler since their usage lives in the template,
+					// but they MUST be emitted). verbatimModuleSyntax keeps any
+					// non-`import type` imports verbatim.
+					verbatimModuleSyntax: true,
+					isolatedModules: true
+				}
+			},
 			...options
-		}),
-		nornCoffeeRuneFusion()
+		})
 	];
 }

package/src/uno.js

@@ -1,66 +0,0 @@
-import UnoCSS from 'unocss/vite';
-import {
-	presetUno,
-	presetAttributify,
-	presetIcons,
-	presetTypography,
-	transformerDirectives,
-	transformerVariantGroup
-} from 'unocss';
-import extractorPug from '@unocss/extractor-pug';
-
-const NORN_PIPELINE = [
-	/\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/,
-	/\.(norn|coffee)($|\?)/
-];
-
-/**
- * Norns UnoCSS Vite plugin.
- *
- * Defaults baked in for the Norns stack:
- * - presets: Uno + Attributify + Icons + Typography
- * - transformers: Directives (`@apply`) + VariantGroup
- * - extractor: extractor-pug, so Pug class shorthand inside `.svelte` and
- *   `.norn` files is recognized
- * - content pipeline includes `.norn` and `.coffee`
- * - hmrTopLevelAwait: false to avoid a TDZ error in WebKit/Safari when
- *   `virtual:uno.css` is imported from a SvelteKit route module
- *
- * **Naming caveat for shortcuts:** avoid names starting with a CSS
- * pseudo-class prefix (`hover-`, `focus-`, `link-`, `active-`, `visited-`,
- * `disabled-`, `checked-`, etc.) — UnoCSS parses those as variant + utility,
- * not as a shortcut name. Use `nav-link`, `lk-muted`, etc. instead of
- * `link-muted`.
- *
- * @param {import('unocss/vite').VitePluginConfig} [options]
- */
-export function nornsUno(options = {}) {
-	const {
-		presets = [],
-		transformers = [],
-		extractors = [],
-		content = {},
-		hmrTopLevelAwait = false,
-		...rest
-	} = options;
-	return UnoCSS({
-		presets: [
-			presetUno(),
-			presetAttributify(),
-			presetIcons(),
-			presetTypography(),
-			...presets
-		],
-		transformers: [transformerDirectives(), transformerVariantGroup(), ...transformers],
-		extractors: [extractorPug(), ...extractors],
-		content: {
-			pipeline: {
-				include: NORN_PIPELINE,
-				...(content.pipeline ?? {})
-			},
-			...content
-		},
-		hmrTopLevelAwait,
-		...rest
-	});
-}