@c9up/aurora 0.1.3

package/dist/component.js

@@ -0,0 +1,97 @@
+/**
+ * Component runtime.
+ *
+ *   const Counter = component<{ initial?: number }>(({ initial = 0 }) => {
+ *     const count = signal(initial)
+ *     onMount(() => { document.title = `Count: ${count()}` })
+ *     return html`<button @click="${() => count(count() + 1)}">${count}</button>`
+ *   })
+ *
+ * Setup runs **once** when the component is created (mount time).
+ * `onMount` / `onUnmount` are bound to the per-component context active
+ * during setup, so they see the right cleanup queue when the component
+ * is unmounted later. State lives in plain `signal()` / `memo()` from
+ * `./reactive.js` — there's no separate hook layer, and signals work
+ * both inside and outside a component setup.
+ *
+ * Unlike React, there is no re-render — reactivity is push-based via the
+ * signals the setup function captures. The compiled template is what
+ * actually moves on screen.
+ */
+const contextStack = [];
+function activeContext() {
+    const ctx = contextStack[contextStack.length - 1];
+    if (!ctx) {
+        throw new Error("[aurora] onMount / onUnmount called outside component() — only valid inside a component setup function.");
+    }
+    return ctx;
+}
+/**
+ * Build a component factory. The returned function takes props and
+ * produces a `TemplateResult` that can be rendered or nested inside
+ * another template.
+ *
+ * `component()` does NOT itself mount anything — it composes. The
+ * outermost `render(Component(props), container)` is what mounts.
+ */
+export function component(setup) {
+    return (props) => {
+        const ctx = {
+            cleanups: [],
+            mountHooks: [],
+        };
+        contextStack.push(ctx);
+        try {
+            const result = setup((props ?? {}));
+            return wrapWithLifecycle(result, ctx);
+        }
+        finally {
+            contextStack.pop();
+        }
+    };
+}
+/**
+ * Stitch the component context onto the returned TemplateResult so the
+ * outer renderer can flush mount hooks + register unmount cleanups
+ * automatically when this slot is mounted / removed.
+ *
+ * The mechanism is a `Symbol`-keyed handoff: the renderer's text-slot
+ * path (which handles nested TemplateResults) checks for this property
+ * and forwards the lifecycle.
+ */
+const COMPONENT_LIFECYCLE = Symbol.for("aurora:component");
+function wrapWithLifecycle(result, ctx) {
+    result[COMPONENT_LIFECYCLE] = {
+        mountHooks: ctx.mountHooks,
+        cleanups: ctx.cleanups,
+    };
+    return result;
+}
+/**
+ * Internal — extract the lifecycle attachment a `component()` left on a
+ * TemplateResult, if any. The renderer calls this after mounting the
+ * fragment so onMount fires once the DOM is live, and the returned
+ * cleanups bubble into the outer dispose chain.
+ */
+export function readComponentLifecycle(result) {
+    return result[COMPONENT_LIFECYCLE];
+}
+// ─── Lifecycle ────────────────────────────────────────────────────
+/**
+ * Schedule a callback to run after the component is mounted into the
+ * live document. Returning a function from `onMount` registers it as an
+ * unmount cleanup.
+ */
+export function onMount(fn) {
+    const ctx = activeContext();
+    ctx.mountHooks.push(fn);
+}
+/**
+ * Schedule a callback to run when the component unmounts. Equivalent
+ * to the cleanup return of `onMount` but available without a paired
+ * mount action.
+ */
+export function onUnmount(fn) {
+    const ctx = activeContext();
+    ctx.cleanups.push(fn);
+}

package/dist/html.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Tagged-template HTML parser.
+ *
+ *   html`<button @click="${onClick}">${count}</button>`
+ *
+ * returns a `TemplateResult`. The first call with a given `strings` array
+ * compiles a `Template` (parsed `<template>` element + slot descriptors)
+ * and caches it; subsequent calls reuse the compiled artefact and only
+ * pair it with fresh `values`.
+ *
+ * The parser is intentionally minimal — it supports text interpolation
+ * (`>${x}<`), attribute interpolation (`attr="${x}"` and multi-slot
+ * `class="a ${x} b ${y}"`), boolean attributes (`?disabled="${x}"`), DOM
+ * properties (`.value="${x}"`), and event listeners (`@click="${fn}"`).
+ * No custom directives, no fragments-in-attribute-name, no comment-only
+ * placeholders.
+ */
+import { isTemplateResult, type Template, type TemplateResult } from "./types.js";
+/**
+ * Compile (and cache) the template for the given strings array. Exposed
+ * for the renderer + the SSR path; apps stick to `html`.
+ */
+export declare function getTemplate(strings: TemplateStringsArray): Template;
+/**
+ * Tagged-template entrypoint. The `strings` array is reference-stable per
+ * source location (TC39 guarantee), so caching by reference is safe and
+ * O(1) on the hot render path.
+ */
+export declare function html(strings: TemplateStringsArray, ...values: unknown[]): TemplateResult;
+export { isTemplateResult };

package/dist/html.js

@@ -0,0 +1,246 @@
+/**
+ * Tagged-template HTML parser.
+ *
+ *   html`<button @click="${onClick}">${count}</button>`
+ *
+ * returns a `TemplateResult`. The first call with a given `strings` array
+ * compiles a `Template` (parsed `<template>` element + slot descriptors)
+ * and caches it; subsequent calls reuse the compiled artefact and only
+ * pair it with fresh `values`.
+ *
+ * The parser is intentionally minimal — it supports text interpolation
+ * (`>${x}<`), attribute interpolation (`attr="${x}"` and multi-slot
+ * `class="a ${x} b ${y}"`), boolean attributes (`?disabled="${x}"`), DOM
+ * properties (`.value="${x}"`), and event listeners (`@click="${fn}"`).
+ * No custom directives, no fragments-in-attribute-name, no comment-only
+ * placeholders.
+ */
+import { isTemplateResult, TEMPLATE_RESULT_BRAND, } from "./types.js";
+const TEMPLATE_CACHE = new WeakMap();
+/** Sentinel inserted at every `${...}` site. Read back during the walk. */
+const MARKER = "__aurora_slot_";
+/** Marker comment that takes a child slot inside a text region. */
+const TEXT_NODE_MARKER = `<!--${MARKER}-->`;
+/** Markup-friendly placeholder for slots inside attribute values. */
+function attrPlaceholder(i) {
+    return `${MARKER}${i}__`;
+}
+function classifySlots(strings) {
+    const result = [];
+    let insideTag = false;
+    let insideComment = false;
+    for (let i = 0; i < strings.length - 1; i++) {
+        const segment = strings[i];
+        for (let j = 0; j < segment.length; j++) {
+            if (insideComment) {
+                // Comments swallow everything (including stray `<` / `>`) up
+                // to the literal `-->` terminator; without this guard a
+                // `<!-- > -->` literal would flip the tag scanner mid-stride.
+                if (segment[j] === "-" &&
+                    segment[j + 1] === "-" &&
+                    segment[j + 2] === ">") {
+                    insideComment = false;
+                    j += 2;
+                }
+                continue;
+            }
+            if (!insideTag &&
+                segment[j] === "<" &&
+                segment[j + 1] === "!" &&
+                segment[j + 2] === "-" &&
+                segment[j + 3] === "-") {
+                insideComment = true;
+                j += 3;
+                continue;
+            }
+            const ch = segment[j];
+            if (!insideTag && ch === "<")
+                insideTag = true;
+            else if (insideTag && ch === ">")
+                insideTag = false;
+        }
+        result.push({ region: insideTag ? "attribute" : "text" });
+    }
+    return result;
+}
+/**
+ * Build the HTML markup to feed the `<template>` element.
+ *
+ * Slots in text regions are replaced with a `<!--__aurora_slot_-->` comment
+ * that survives DOM parsing. Slots in attribute regions are replaced with a
+ * unique string token like `__aurora_slot_3__` that the post-parse walk
+ * detects when scanning attribute values.
+ */
+function buildMarkup(strings, classification) {
+    let out = strings[0];
+    for (let i = 0; i < classification.length; i++) {
+        out +=
+            classification[i].region === "text"
+                ? TEXT_NODE_MARKER
+                : attrPlaceholder(i);
+        out += strings[i + 1];
+    }
+    return out;
+}
+/**
+ * Walk the parsed fragment and collect a slot descriptor for every
+ * placeholder we emitted. The walk is depth-first, child-by-child, and
+ * records the integer path so `render()` can re-walk a clone without any
+ * string parsing.
+ */
+function collectSlots(root, classification) {
+    const slots = [];
+    let slotIndex = 0;
+    // Classify one marker-bearing attribute into slot(s): `@event`, `?boolean`,
+    // `.prop`, or a (possibly multi-slot) regular attribute. Pushes the slot(s)
+    // and queues the attribute for removal from the inert template.
+    function classifyAttribute(attr, path, toRemove) {
+        const value = attr.value;
+        if (!value.includes(MARKER))
+            return;
+        const localPath = [...path];
+        if (attr.name.startsWith("@")) {
+            const slot = {
+                kind: "event",
+                path: localPath,
+                event: attr.name.slice(1),
+            };
+            slots.push(slot);
+            slotIndex++;
+            toRemove.push(attr.name);
+            return;
+        }
+        if (attr.name.startsWith("?")) {
+            const slot = {
+                kind: "boolean-attr",
+                path: localPath,
+                name: attr.name.slice(1),
+            };
+            slots.push(slot);
+            slotIndex++;
+            toRemove.push(attr.name);
+            return;
+        }
+        if (attr.name.startsWith(".")) {
+            const slot = {
+                kind: "prop",
+                path: localPath,
+                name: attr.name.slice(1),
+            };
+            slots.push(slot);
+            slotIndex++;
+            toRemove.push(attr.name);
+            return;
+        }
+        // Regular attribute — may host one or more slots inline with static text.
+        // Strip the placeholder version (the renderer re-applies via setAttribute)
+        // so the inert template never carries the `__aurora_slot_0__` artefact.
+        const parts = value.split(/__aurora_slot_(\d+)__/);
+        // Even indices = static text, odd = slot indices. One slot with no
+        // surrounding static text → a "pure" attr slot; else carry static parts.
+        if (parts.length === 3 && parts[0] === "" && parts[2] === "") {
+            const slot = { kind: "attr", path: localPath, name: attr.name };
+            slots.push(slot);
+            slotIndex++;
+        }
+        else {
+            // Multi-slot attribute. Each slot points at the same `staticParts`
+            // array; consumers re-join on every update.
+            const staticParts = [];
+            const slotCountInThisAttr = (parts.length - 1) / 2;
+            for (let i = 0; i < parts.length; i += 2) {
+                staticParts.push(parts[i]);
+            }
+            for (let i = 0; i < slotCountInThisAttr; i++) {
+                const slot = {
+                    kind: "attr",
+                    path: localPath,
+                    name: attr.name,
+                    staticParts,
+                    staticPartIndex: i,
+                };
+                slots.push(slot);
+                slotIndex++;
+            }
+        }
+        toRemove.push(attr.name);
+    }
+    function visit(node, path) {
+        // Process children FIRST in reverse so a comment-marker we're about
+        // to remove never invalidates the index of a later sibling. But text
+        // slots also bring the node into existence — handle them with a
+        // stable path captured up front.
+        if (node.nodeType === 8 /* Comment */) {
+            const data = node.data;
+            if (data === MARKER) {
+                if (slotIndex >= classification.length)
+                    return;
+                const cls = classification[slotIndex];
+                if (cls.region !== "text") {
+                    throw new Error(`[aurora] internal classification mismatch at slot ${slotIndex}`);
+                }
+                const slot = { kind: "text", path: [...path] };
+                slots.push(slot);
+                slotIndex++;
+            }
+            return;
+        }
+        if (node.nodeType === 1 /* Element */) {
+            const el = node;
+            // Scan attributes — multiple slots can share one attribute.
+            // Collect attrs to remove AFTER iteration (mutating during it
+            // shifts indices on some DOM implementations).
+            const toRemove = [];
+            for (const attr of Array.from(el.attributes)) {
+                classifyAttribute(attr, path, toRemove);
+            }
+            for (const name of toRemove)
+                el.removeAttribute(name);
+        }
+        // Recurse into children with their indices.
+        let childIndex = 0;
+        let child = node.firstChild;
+        while (child) {
+            const nextSibling = child.nextSibling;
+            visit(child, [...path, childIndex]);
+            child = nextSibling;
+            childIndex++;
+        }
+    }
+    visit(root.content, []);
+    return slots;
+}
+function compile(strings) {
+    const classification = classifySlots(strings);
+    const markup = buildMarkup(strings, classification);
+    const tpl = document.createElement("template");
+    tpl.innerHTML = markup;
+    const slots = collectSlots(tpl, classification);
+    return { element: tpl, slots };
+}
+/**
+ * Compile (and cache) the template for the given strings array. Exposed
+ * for the renderer + the SSR path; apps stick to `html`.
+ */
+export function getTemplate(strings) {
+    let cached = TEMPLATE_CACHE.get(strings);
+    if (!cached) {
+        cached = compile(strings);
+        TEMPLATE_CACHE.set(strings, cached);
+    }
+    return cached;
+}
+/**
+ * Tagged-template entrypoint. The `strings` array is reference-stable per
+ * source location (TC39 guarantee), so caching by reference is safe and
+ * O(1) on the hot render path.
+ */
+export function html(strings, ...values) {
+    const result = {
+        strings,
+        values,
+        [TEMPLATE_RESULT_BRAND]: true,
+    };
+    return result;
+}
+export { isTemplateResult };

package/dist/hydrate.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Hydration — adopt SSR-rendered HTML in the browser without rebuilding
+ * the DOM.
+ *
+ * `hydrate(container, factory)` runs the same component factory used
+ * server-side, recomputes the slot bindings, and attaches them to the
+ * existing nodes. Where SSR emitted plain text for `${signal}`, hydrate
+ * locates the same text node (via path resolution against the cloned
+ * template) and starts an effect that updates it on signal change.
+ *
+ * Implementation note: we still run `getTemplate(strings)` to know
+ * where each slot lives, then walk the LIVE container tree using the
+ * same path. SSR output must match the shape of the parsed template
+ * for hydration to find the right node — same constraint as React's
+ * hydration mismatch warning.
+ */
+import { type Disposer } from "./render.js";
+import { type TemplateResult } from "./types.js";
+/** @internal Reset the warn-once flag (tests). */
+export declare function resetHydrateWarnings(): void;
+/**
+ * Adopt SSR markup inside `container`. `factory` is the same function
+ * that was rendered server-side — its output (a TemplateResult tree)
+ * tells hydrate which slots to wire.
+ *
+ * Returns a `Disposer` that detaches every effect and event listener,
+ * leaving the DOM in place.
+ */
+export declare function hydrate(container: Element, factory: () => TemplateResult): Disposer;