@spinjs/components 0.1.0-preview.1 → 0.2.0-alpha.1

package/dist/runtime/syntax/parse.js

@@ -0,0 +1,407 @@
+import { ParseError } from "./ir.js";
+import { matchBrace } from "./braces.js";
+// src/runtime/syntax/parse.ts
+const VOID = /* @__PURE__ */ new Set([
+	"area",
+	"base",
+	"br",
+	"col",
+	"embed",
+	"hr",
+	"img",
+	"input",
+	"link",
+	"meta",
+	"source",
+	"track",
+	"wbr"
+]);
+const span = (start, end) => ({
+	start,
+	end
+});
+function fail(p, code, message, start, end) {
+	p.errors.push({
+		code,
+		message,
+		span: span(start, end)
+	});
+}
+function skipWs(p) {
+	while (p.pos < p.src.length && /\s/.test(p.src[p.pos])) p.pos++;
+}
+function readTagName(p) {
+	const start = p.pos;
+	while (p.pos < p.src.length && /[A-Za-z0-9\-\._:]/.test(p.src[p.pos])) p.pos++;
+	return p.src.slice(start, p.pos);
+}
+function readAttrValue(p) {
+	const quote = p.src[p.pos];
+	if (quote === "\"" || quote === "'") {
+		p.pos;
+		p.pos++;
+		const start = p.pos;
+		let value = "";
+		for (;;) {
+			if (p.pos >= p.src.length) break;
+			const ch = p.src[p.pos];
+			if (ch === quote) {
+				p.pos++;
+				break;
+			}
+			if (ch === "{") {
+				const close = matchBrace(p.src, p.pos, p.src.length);
+				value += p.src.slice(p.pos, close + 1);
+				p.pos = close + 1;
+				continue;
+			}
+			value += ch;
+			p.pos++;
+		}
+		return {
+			value,
+			start,
+			end: p.pos
+		};
+	}
+	const start = p.pos;
+	if (p.src[p.pos] === "{") {
+		const close = matchBrace(p.src, p.pos, p.src.length);
+		const value = p.src.slice(p.pos, close + 1);
+		p.pos = close + 1;
+		return {
+			value,
+			start,
+			end: p.pos
+		};
+	}
+	while (p.pos < p.src.length && !/[\s/>]/.test(p.src[p.pos])) p.pos++;
+	return {
+		value: p.src.slice(start, p.pos),
+		start,
+		end: p.pos
+	};
+}
+function attrValue(raw, start, end) {
+	const t = raw.trim();
+	if (t.startsWith("{") && t.endsWith("}")) return {
+		kind: "expr",
+		expr: t.slice(1, -1).trim(),
+		span: span(start, end)
+	};
+	return {
+		kind: "static",
+		value: raw
+	};
+}
+function parseText(p) {
+	const start = p.pos;
+	while (p.pos < p.src.length && p.src[p.pos] !== "<") p.pos++;
+	const raw = p.src.slice(start, p.pos);
+	const mixed = [];
+	let last = 0;
+	let i = 0;
+	while (i < raw.length) {
+		const open = raw.indexOf("{", i);
+		if (open === -1) break;
+		const close = matchBrace(raw, open, raw.length);
+		if (close >= raw.length) break;
+		if (open > last) {
+			const seg = raw.slice(last, open);
+			mixed.push({
+				kind: "static",
+				value: seg.includes("&") ? seg.replace(/&(#[xX]?[0-9a-fA-F]+|[a-zA-Z][a-zA-Z0-9]*);/g, (m, body) => {
+					if (body[0] === "#") {
+						const isHex = body[1] === "x" || body[1] === "X";
+						const code = parseInt(body.slice(isHex ? 2 : 1), isHex ? 16 : 10);
+						if (Number.isNaN(code) || code < 0 || code > 1114111) return m;
+						try {
+							return String.fromCodePoint(code);
+						} catch {
+							return m;
+						}
+					}
+					return {
+						amp: "&",
+						lt: "<",
+						gt: ">",
+						quot: "\"",
+						apos: "'",
+						times: "×",
+						mdash: "—",
+						ndash: "–",
+						hellip: "…",
+						copy: "©"
+					}[body] ?? m;
+				}) : seg
+			});
+		}
+		mixed.push({
+			kind: "expr",
+			expr: raw.slice(open + 1, close).trim(),
+			span: span(start + open, start + close + 1)
+		});
+		last = close + 1;
+		i = close + 1;
+	}
+	if (last < raw.length) {
+		const seg = raw.slice(last);
+		mixed.push({
+			kind: "static",
+			value: seg.includes("&") ? seg.replace(/&(#[xX]?[0-9a-fA-F]+|[a-zA-Z][a-zA-Z0-9]*);/g, (m, body) => {
+				if (body[0] === "#") {
+					const isHex = body[1] === "x" || body[1] === "X";
+					const code = parseInt(body.slice(isHex ? 2 : 1), isHex ? 16 : 10);
+					if (Number.isNaN(code) || code < 0 || code > 1114111) return m;
+					try {
+						return String.fromCodePoint(code);
+					} catch {
+						return m;
+					}
+				}
+				return {
+					amp: "&",
+					lt: "<",
+					gt: ">",
+					quot: "\"",
+					apos: "'",
+					times: "×",
+					mdash: "—",
+					ndash: "–",
+					hellip: "…",
+					copy: "©"
+				}[body] ?? m;
+			}) : seg
+		});
+	}
+	return {
+		kind: "text",
+		parts: mixed,
+		span: span(start, p.pos)
+	};
+}
+function parseElement(p) {
+	const start = p.pos;
+	p.pos++;
+	if (p.src[p.pos] === "/") {
+		fail(p, "stray-close", "closing tag without an opener", start, p.pos + 1);
+		while (p.pos < p.src.length && p.src[p.pos] !== ">") p.pos++;
+		p.pos++;
+		return {
+			kind: "text",
+			parts: [],
+			span: span(start, p.pos)
+		};
+	}
+	const tag = readTagName(p);
+	const attrs = [];
+	const events = [];
+	const actions = [];
+	const spreads = [];
+	for (;;) {
+		skipWs(p);
+		if (p.pos >= p.src.length) break;
+		const aStart = p.pos;
+		const ch = p.src[p.pos];
+		if (ch === ">") {
+			p.pos++;
+			break;
+		}
+		if (ch === "/" && p.src[p.pos + 1] === ">") {
+			p.pos += 2;
+			return finishElement(p, tag, attrs, events, actions, spreads, [], start, p.pos);
+		}
+		if (ch === "/") {
+			fail(p, "stray-slash", "a `/` that closes nothing is dropped", p.pos, p.pos + 1);
+			p.pos++;
+			continue;
+		}
+		let name = "";
+		if (p.src[p.pos] === "{" && p.src.slice(p.pos, p.pos + 4) === "{...") {
+			let depth = 0;
+			let quote;
+			while (p.pos < p.src.length) {
+				const c = p.src[p.pos];
+				if (quote !== void 0) {
+					name += c;
+					if (c === quote) quote = void 0;
+				} else if (c === "\"" || c === "'") {
+					quote = c;
+					name += c;
+				} else if (c === "{") {
+					depth++;
+					name += c;
+				} else if (c === "}") {
+					depth--;
+					name += c;
+					if (depth === 0) {
+						p.pos++;
+						break;
+					}
+				} else name += c;
+				p.pos++;
+			}
+		} else while (p.pos < p.src.length && !/[\s=/>]/.test(p.src[p.pos])) {
+			name += p.src[p.pos];
+			p.pos++;
+		}
+		skipWs(p);
+		let raw = "";
+		let vStart = p.pos;
+		let vEnd = p.pos;
+		if (p.src[p.pos] === "=") {
+			p.pos++;
+			skipWs(p);
+			const v = readAttrValue(p);
+			raw = v.value;
+			vStart = v.start;
+			vEnd = v.end;
+		}
+		const aSpan = span(aStart, p.pos);
+		if (name.startsWith("{...") && name.endsWith("}")) spreads.push({
+			expr: name.slice(4, -1).trim(),
+			span: aSpan
+		});
+		else if (name.startsWith("on:")) {
+			const body = raw.trim();
+			const handler = body.startsWith("{") && body.endsWith("}") ? body.slice(1, -1).trim() : body;
+			events.push({
+				event: name.slice(3),
+				handler,
+				span: aSpan
+			});
+		} else if (name.startsWith("use:")) {
+			const body = raw.trim();
+			const param = body.startsWith("{") && body.endsWith("}") ? body.slice(1, -1).trim() : body.length > 0 ? JSON.stringify(body) : void 0;
+			actions.push({
+				name: name.slice(4),
+				param,
+				span: aSpan
+			});
+		} else if (name === "for" || name === "as" || name === "key") attrs.push({
+			name,
+			value: attrValue(raw, vStart, vEnd),
+			span: aSpan
+		});
+		else attrs.push({
+			name,
+			value: attrValue(raw, vStart, vEnd),
+			span: aSpan
+		});
+	}
+	if (VOID.has(tag)) return finishElement(p, tag, attrs, events, actions, spreads, [], start, p.pos);
+	if (tag === "template") return parseTemplate(p, attrs, events, actions, start);
+	const children = [];
+	for (;;) {
+		skipWs(p);
+		if (p.pos >= p.src.length) {
+			fail(p, "unclosed", `element <${tag}> is never closed`, start, p.pos);
+			break;
+		}
+		if (p.src[p.pos] === "<" && p.src[p.pos + 1] === "/") {
+			p.pos += 2;
+			const close = readTagName(p);
+			skipWs(p);
+			if (p.src[p.pos] === ">") p.pos++;
+			if (close !== tag) fail(p, "mismatch", `expected </${tag}> but found </${close}>`, start, p.pos);
+			break;
+		}
+		if (p.src[p.pos] === "<") children.push(parseElement(p));
+		else {
+			const t = parseText(p);
+			if (t.kind === "text" && t.parts.length > 0) children.push(t);
+		}
+	}
+	return finishElement(p, tag, attrs, events, actions, spreads, children, start, p.pos);
+}
+function finishElement(p, tag, attrs, events, actions, spreads, children, start, end) {
+	const at = attrs.findIndex((a) => a.name === "show");
+	let show;
+	if (at !== -1) {
+		const found = attrs[at];
+		if (found.value.kind !== "expr") fail(p, "show-static", "`show` needs an expression: show={cond}", found.span.start, found.span.end);
+		else show = found.value.expr;
+		attrs.splice(at, 1);
+	}
+	return {
+		kind: "element",
+		tag,
+		attrs,
+		events,
+		actions,
+		spreads,
+		children,
+		...show !== void 0 ? { show } : {},
+		span: span(start, end)
+	};
+}
+function templateAttr(attrs, name) {
+	const found = attrs.find((a) => a.name === name);
+	if (!found) return void 0;
+	const v = found.value;
+	if (v.kind === "static") return v.value;
+	return `{${v.expr}}`;
+}
+function parseTemplate(p, attrs, events, actions, start) {
+	const rawFor = templateAttr(attrs, "for");
+	const rawAs = templateAttr(attrs, "as");
+	const rawKey = templateAttr(attrs, "key");
+	if (rawFor === void 0) fail(p, "template-for", "<template> needs a for={items} attribute", start, p.pos);
+	const source = rawFor !== void 0 && rawFor.startsWith("{") && rawFor.endsWith("}") ? rawFor.slice(1, -1).trim() : rawFor ?? "";
+	const binding = rawAs !== void 0 && rawAs.startsWith("{") && rawAs.endsWith("}") ? rawAs.slice(1, -1).trim() : rawAs ?? "item";
+	const key = rawKey !== void 0 && rawKey.startsWith("{") && rawKey.endsWith("}") ? rawKey.slice(1, -1).trim() : rawKey;
+	const body = [];
+	for (;;) {
+		skipWs(p);
+		if (p.pos >= p.src.length) {
+			fail(p, "unclosed", "<template> is never closed", start, p.pos);
+			break;
+		}
+		if (p.src[p.pos] === "<" && p.src[p.pos + 1] === "/") {
+			p.pos += 2;
+			const close = readTagName(p);
+			skipWs(p);
+			if (p.src[p.pos] === ">") p.pos++;
+			if (close !== "template") fail(p, "mismatch", `expected </template> but found </${close}>`, start, p.pos);
+			break;
+		}
+		if (p.src[p.pos] === "<") body.push(parseElement(p));
+		else {
+			const t = parseText(p);
+			if (t.kind === "text" && t.parts.length > 0) body.push(t);
+		}
+	}
+	return {
+		kind: "for",
+		source,
+		binding,
+		key,
+		body,
+		span: span(start, p.pos)
+	};
+}
+function parse(source) {
+	const p = {
+		src: source,
+		pos: 0,
+		errors: []
+	};
+	const nodes = [];
+	for (;;) {
+		skipWs(p);
+		if (p.pos >= p.src.length) break;
+		if (p.src[p.pos] === "<") {
+			const n = parseElement(p);
+			if (n.kind === "text" && n.parts.length === 0) continue;
+			nodes.push(n);
+		} else {
+			const t = parseText(p);
+			if (t.kind === "text" && t.parts.length > 0) nodes.push(t);
+		}
+	}
+	if (p.errors.length > 0) throw new ParseError(p.errors);
+	return { nodes };
+}
+export { parse };
+
+//# sourceMappingURL=parse.js.map

package/dist/runtime/syntax/script-block.d.ts

@@ -0,0 +1,43 @@
+/** The script block: real TypeScript the checker sees.
+ *
+ * The script is a module the checker checks — not text the compiler
+ * parses for types. The compiler's job is the allowlist: only type and
+ * interface declarations, imports, and machine-factory calls survive.
+ * Everything else is stripped before the check, and a stripped script
+ * that leaves nothing meaningful behind is an empty component, not an
+ * error somewhere else.
+ *
+ *   <script lang="ts">
+ *     import { slider } from "../slider.machine.ts";
+ *     const ctl = slider({ value: [50] });
+ *   </script>
+ *
+ * The call's semantics are the factory's semantics: called here, fresh
+ * instance, caller owns lifecycle. The template references the binding
+ * (`ctl.getRootProps()`); the compiler wires it.
+ */
+export interface ScriptCall {
+  readonly name: string;
+  readonly factory: string;
+  readonly args: string;
+}
+export interface ScriptConsume {
+  readonly name: string;
+  readonly handle: string;
+}
+export interface StrippedScript {
+  /** The module text the checker sees. */
+  readonly module: string;
+  /** The binding names the template may reference. */
+  readonly bindings: readonly string[];
+  /** The parsed machine-factory calls, including multi-line args. */
+  readonly calls: readonly ScriptCall[];
+  /** `consume(handle)` ancestor lookups the template may reference. */
+  readonly consumes: readonly ScriptConsume[];
+  /** What was stripped, for diagnostics. */
+  readonly stripped: readonly string[];
+}
+/** Strip a script body to what the checker sees. */
+export declare function stripScript(body: string): StrippedScript;
+/** Extract the script block from markup source, if it has one. */
+export declare function extractScript(source: string): string | undefined;

package/dist/runtime/syntax/script-block.js

@@ -0,0 +1,190 @@
+import { skipQuoted } from "./braces.js";
+// src/runtime/syntax/script-block.ts
+/** The script block: real TypeScript the checker sees.
+*
+* The script is a module the checker checks — not text the compiler
+* parses for types. The compiler's job is the allowlist: only type and
+* interface declarations, imports, and machine-factory calls survive.
+* Everything else is stripped before the check, and a stripped script
+* that leaves nothing meaningful behind is an empty component, not an
+* error somewhere else.
+*
+*   <script lang="ts">
+*     import { slider } from "../slider.machine.ts";
+*     const ctl = slider({ value: [50] });
+*   <\/script>
+*
+* The call's semantics are the factory's semantics: called here, fresh
+* instance, caller owns lifecycle. The template references the binding
+* (`ctl.getRootProps()`); the compiler wires it.
+*/
+const IMPORT_START = /^import(?:\s|\{|\*)/;
+const TYPE_START = /^(?:export\s+)?(?:type|interface)\b/;
+const MACHINE_CALL_START = /^(?:export\s+)?const\s+([A-Za-z_$][\w$]*)\s*=\s*([A-Za-z_$][\w$]*)\s*\(/;
+/** Find the matching `)` for the `(` at `openParen`, skipping strings and comments. */
+function matchParen(source, openParen) {
+	const end = source.length;
+	let depth = 0;
+	let i = openParen;
+	while (i < end) {
+		const c = source[i];
+		if (c === "\"" || c === "'" || c === "`") {
+			i = skipQuoted(source, i, end);
+			continue;
+		}
+		if (c === "/" && source[i + 1] === "/") {
+			const nl = source.indexOf("\n", i + 2);
+			i = nl < 0 ? end : nl + 1;
+			continue;
+		}
+		if (c === "/" && source[i + 1] === "*") {
+			const close = source.indexOf("*/", i + 2);
+			i = close < 0 ? end : close + 2;
+			continue;
+		}
+		if (c === "(") depth += 1;
+		else if (c === ")") {
+			depth -= 1;
+			if (depth === 0) return i;
+		}
+		i += 1;
+	}
+	return -1;
+}
+/** Scan a balanced top-level statement (`import`, `type`, `interface`) to its line end. */
+function scanStatementEnd(source, start) {
+	const end = source.length;
+	let depth = 0;
+	let i = start;
+	while (i < end) {
+		const c = source[i];
+		if (c === "\"" || c === "'" || c === "`") {
+			i = skipQuoted(source, i, end);
+			continue;
+		}
+		if (c === "/" && source[i + 1] === "/") {
+			const nl = source.indexOf("\n", i + 2);
+			if (depth === 0) return nl < 0 ? end : nl;
+			i = nl < 0 ? end : nl + 1;
+			continue;
+		}
+		if (c === "/" && source[i + 1] === "*") {
+			const close = source.indexOf("*/", i + 2);
+			i = close < 0 ? end : close + 2;
+			continue;
+		}
+		if (c === "{" || c === "(" || c === "[") depth += 1;
+		else if (c === "}" || c === ")" || c === "]") depth = Math.max(0, depth - 1);
+		else if (c === "\n" && depth === 0) {
+			const rest = source.slice(i + 1).trimStart();
+			if (rest.startsWith("|") || rest.startsWith("&")) {
+				i += 1;
+				continue;
+			}
+			return i;
+		}
+		i += 1;
+	}
+	return end;
+}
+/** Strip a script body to what the checker sees. */
+function stripScript(body) {
+	const kept = [];
+	const bindings = [];
+	const calls = [];
+	const consumes = [];
+	const stripped = [];
+	const len = body.length;
+	let pos = 0;
+	while (pos < len) {
+		const lineStart = pos;
+		while (pos < len && (body[pos] === " " || body[pos] === "	" || body[pos] === "\r")) pos += 1;
+		if (pos >= len) {
+			kept.push(body.slice(lineStart));
+			break;
+		}
+		if (body[pos] === "\n") {
+			kept.push(body.slice(lineStart, pos));
+			pos += 1;
+			continue;
+		}
+		const rest = body.slice(pos);
+		if (rest.startsWith("//")) {
+			const nl = body.indexOf("\n", pos);
+			const end = nl < 0 ? len : nl;
+			kept.push(body.slice(lineStart, end));
+			pos = nl < 0 ? len : nl + 1;
+			continue;
+		}
+		if (rest.startsWith("/*")) {
+			const close = body.indexOf("*/", pos + 2);
+			const after = close < 0 ? len : close + 2;
+			const nl = body.indexOf("\n", after);
+			const end = nl < 0 ? len : nl;
+			kept.push(body.slice(lineStart, end));
+			pos = nl < 0 ? len : nl + 1;
+			continue;
+		}
+		if (IMPORT_START.test(rest) || TYPE_START.test(rest)) {
+			const stmtEnd = scanStatementEnd(body, pos);
+			kept.push(body.slice(lineStart, stmtEnd));
+			pos = stmtEnd < len && body[stmtEnd] === "\n" ? stmtEnd + 1 : stmtEnd;
+			continue;
+		}
+		const callMatch = MACHINE_CALL_START.exec(rest);
+		if (callMatch !== null) {
+			const name = callMatch[1] ?? "";
+			const factory = callMatch[2] ?? "";
+			const openParen = pos + callMatch[0].length - 1;
+			const closeParen = matchParen(body, openParen);
+			if (closeParen >= 0) {
+				const nl = body.indexOf("\n", closeParen);
+				const lineEnd = nl < 0 ? len : nl;
+				const tail = body.slice(closeParen + 1, lineEnd).trim();
+				if (tail === "" || tail === ";" || tail.startsWith("//")) {
+					if (factory === "consume") {
+						kept.push(body.slice(lineStart, lineEnd));
+						bindings.push(name);
+						consumes.push({
+							name,
+							handle: body.slice(openParen + 1, closeParen).trim()
+						});
+					} else {
+						kept.push(body.slice(lineStart, lineEnd));
+						bindings.push(name);
+						calls.push({
+							name,
+							factory,
+							args: body.slice(openParen + 1, closeParen).trim()
+						});
+					}
+					pos = nl < 0 ? len : nl + 1;
+					continue;
+				}
+			}
+		}
+		const nl = body.indexOf("\n", pos);
+		const lineEnd = nl < 0 ? len : nl;
+		stripped.push(body.slice(lineStart, lineEnd));
+		pos = nl < 0 ? len : nl + 1;
+	}
+	return {
+		module: kept.join("\n"),
+		bindings,
+		calls,
+		consumes,
+		stripped
+	};
+}
+/** Extract the script block from markup source, if it has one. */
+function extractScript(source) {
+	const open = /<script(\s[^>]*)?>/.exec(source);
+	if (open === null || open.index === void 0) return void 0;
+	const bodyStart = open.index + open[0].length;
+	const close = source.indexOf("<\/script>", bodyStart);
+	if (close < 0) return void 0;
+	return source.slice(bodyStart, close);
+}
+export { extractScript, stripScript };
+
+//# sourceMappingURL=script-block.js.map

package/dist/runtime/testing.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The test-only DOM.
+ *
+ * A second `Window` type, which is the point of keeping it behind a
+ * subpath: a browser consumer importing `@spinjs/components/runtime` never loads this
+ * module, so the two `Window` types never coexist in one program. Exposing
+ * it from the package root instead put it in every consumer's program and
+ * broke the whole workspace check.
+ */
+import { parseHTML } from "linkedom";
+export { parseHTML };

package/dist/runtime/testing.js

@@ -0,0 +1 @@
+export { parseHTML } from "linkedom";