@multiplekex/shallot 0.1.12 → 0.2.0

package/src/core/xml.ts

@@ -1,10 +1,12 @@
-import { XMLParser } from "fast-xml-parser";
 import { addComponent, Pair } from "bitecs";
 import type { State } from "./state";
 import { getRegisteredComponent, type ComponentLike, type RegisteredComponent } from "./component";
 import { getRelationDef, ChildOf } from "./relation";
 import { toKebabCase, toCamelCase } from "./strings";
 
+const INDENT = "    ";
+const MAX_LINE = 100;
+
 function levenshtein(a: string, b: string): number {
     if (a.length === 0) return b.length;
     if (b.length === 0) return a.length;
@@ -61,221 +63,253 @@ function findClosestMatch(input: string, candidates: string[]): string | null {
     return bestMatch;
 }
 
-export interface ParsedElement {
-    readonly tag: string;
-    readonly attrs: Readonly<Record<string, string>>;
-    readonly children: readonly ParsedElement[];
+export interface Node {
+    id?: string;
+    attrs: Attr[];
+    children: Node[];
+    comments?: string[];
+    blankBefore?: boolean;
 }
 
-export interface EntityRef {
-    readonly attrName: string;
-    readonly targetName: string;
+export interface Attr {
+    name: string;
+    value: string;
 }
 
-export interface EntityDef {
-    readonly id?: string;
-    readonly components: readonly ComponentDef[];
-    readonly children: readonly EntityDef[];
-    readonly entityRefs: readonly EntityRef[];
+export interface Ref {
+    attr: string;
+    target: string;
 }
 
-export interface ComponentDef {
-    readonly def: RegisteredComponent;
-    readonly attrs: Record<string, string>;
+export interface ParseError {
+    message: string;
+    path?: string;
 }
 
-export interface ParseResult {
-    readonly entities: readonly EntityDef[];
-    readonly errors: readonly ParseError[];
-    readonly warnings: readonly string[];
+interface PendingFieldRef {
+    eid: number;
+    component: ComponentLike;
+    field: string;
+    targetName: string;
 }
 
-export interface ParseError {
-    readonly message: string;
-    readonly path?: string;
+interface Token {
+    type: "comment" | "open" | "close" | "blank";
+    value: string;
+    selfClosing?: boolean;
+    attrs?: Record<string, string>;
+    tagName?: string;
 }
 
-export interface PendingFieldRef {
-    readonly eid: number;
-    readonly component: ComponentLike;
-    readonly field: string;
-    readonly targetName: string;
-}
+function tokenize(xml: string): Token[] {
+    const tokens: Token[] = [];
+    const regex = /<!--[\s\S]*?-->|<\/?\s*(\w+)[^>]*\/?>/g;
+    let lastIndex = 0;
+    let match: RegExpExecArray | null;
 
-export function parseXml(xml: string): ParseResult {
-    const errors: ParseError[] = [];
-    const warnings: string[] = [];
-
-    const parser = new XMLParser({
-        ignoreAttributes: false,
-        attributeNamePrefix: "",
-        preserveOrder: true,
-        trimValues: true,
-        allowBooleanAttributes: true,
-    });
-
-    let raw: unknown;
-    try {
-        raw = parser.parse(xml, { allowBooleanAttributes: true });
-    } catch (e) {
-        return {
-            entities: [],
-            errors: [{ message: `xml parse error: ${(e as Error).message}` }],
-            warnings: [],
-        };
-    }
-
-    const elements = normalizeRaw(raw);
-    const entities: EntityDef[] = [];
-
-    for (const el of elements) {
-        if (el.tag === "scene") {
-            for (const child of el.children) {
-                const result = parseEntityElement(child, errors, warnings);
-                if (result) entities.push(result);
-            }
-        } else if (el.tag === "a") {
-            const result = parseEntityElement(el, errors, warnings);
-            if (result) entities.push(result);
-        } else if (el.tag.toLowerCase() === "scene" || el.tag.toLowerCase() === "world") {
-            errors.push({ message: `Invalid tag "${el.tag}". Use lowercase <scene>` });
+    while ((match = regex.exec(xml)) !== null) {
+        const before = xml.slice(lastIndex, match.index);
+        if (/\n\s*\n/.test(before)) {
+            tokens.push({ type: "blank", value: "" });
+        }
+        lastIndex = match.index + match[0].length;
+
+        const tag = match[0];
+
+        if (tag.startsWith("<!--")) {
+            const content = tag.slice(4, -3).trim();
+            tokens.push({ type: "comment", value: content });
+        } else if (tag.startsWith("</")) {
+            const tagName = tag.match(/<\/\s*(\w+)/)?.[1] ?? "";
+            tokens.push({ type: "close", value: tag, tagName });
+        } else {
+            const selfClosing = tag.endsWith("/>");
+            const tagMatch = tag.match(/<\s*(\w+)/);
+            const tagName = tagMatch?.[1] ?? "";
+            const attrs = parseTagAttrs(tag);
+            tokens.push({ type: "open", value: tag, selfClosing, tagName, attrs });
         }
     }
 
-    return { entities, errors, warnings };
+    return tokens;
 }
 
-function isEntityRef(value: string): boolean {
-    return value.startsWith("@") && value.length > 1;
+function parseTagAttrs(tag: string): Record<string, string> {
+    const attrs: Record<string, string> = {};
+    const attrRegex = /([^\s=<>\/]+)(?:\s*=\s*"([^"]*)")?/g;
+    const inner = tag.replace(/^<\s*\w+/, "").replace(/\/?>$/, "");
+    let match: RegExpExecArray | null;
+
+    while ((match = attrRegex.exec(inner)) !== null) {
+        const name = match[1];
+        const value = match[2] ?? "";
+        attrs[name] = value;
+    }
+
+    return attrs;
 }
 
-function parseEntityElement(
-    el: ParsedElement,
-    errors: ParseError[],
-    warnings: string[]
-): EntityDef | null {
-    if (el.tag !== "a") {
-        if (el.tag.toLowerCase() === "a") {
-            errors.push({ message: `Invalid tag "${el.tag}". Use lowercase <a>` });
+export function parse(xml: string): Node[] {
+    const unclosedMatch = xml.match(/<[^>]*$/);
+    if (unclosedMatch) {
+        throw new Error(`xml parse error: Unclosed tag at end of document`);
+    }
+
+    const tokens = tokenize(xml);
+
+    for (const token of tokens) {
+        if (token.type === "open" && token.tagName !== "scene" && token.tagName !== "a") {
+            const tagName = token.tagName ?? "unknown";
+            if (tagName.toLowerCase() === "a" || tagName.toLowerCase() === "scene") {
+                continue;
+            }
+            throw new Error(`xml parse error: Unknown tag <${tagName}>`);
         }
-        return null;
     }
 
-    const components: ComponentDef[] = [];
-    const children: EntityDef[] = [];
-    const entityRefs: EntityRef[] = [];
-    const shorthands: Array<{ name: string; value: string }> = [];
-    let entityId: string | undefined;
+    const nodes: Node[] = [];
+    const errors: ParseError[] = [];
+
+    let i = 0;
+    let pendingComments: string[] = [];
+    let pendingBlank = false;
 
-    for (const [attrName, attrValue] of Object.entries(el.attrs)) {
-        if (attrName === "id") {
-            entityId = attrValue;
+    while (i < tokens.length) {
+        const token = tokens[i];
+
+        if (token.type === "blank") {
+            pendingBlank = true;
+            i++;
             continue;
         }
 
-        if (typeof attrValue === "string" && isEntityRef(attrValue)) {
-            entityRefs.push({
-                attrName,
-                targetName: attrValue.slice(1),
-            });
+        if (token.type === "comment") {
+            pendingComments.push(token.value);
+            i++;
             continue;
         }
 
-        const registered = getRegisteredComponent(attrName);
-        if (registered) {
-            const attrs: Record<string, string> = {};
-            if (typeof attrValue === "string" && attrValue !== "") {
-                attrs["_value"] = attrValue;
+        if (token.type === "open" && token.tagName === "scene") {
+            pendingComments = [];
+            pendingBlank = false;
+            i++;
+            continue;
+        }
+
+        if (token.type === "close" && token.tagName === "scene") {
+            i++;
+            continue;
+        }
+
+        if (token.type === "open" && token.tagName === "a") {
+            const result = parseNodeFromTokens(tokens, i, errors);
+            if (result.node) {
+                result.node.comments = pendingComments.length > 0 ? pendingComments : undefined;
+                result.node.blankBefore = pendingBlank || undefined;
+                nodes.push(result.node);
             }
-            components.push({ def: registered, attrs });
+            pendingComments = [];
+            pendingBlank = false;
+            i = result.nextIndex;
             continue;
         }
 
-        if (typeof attrValue === "string" && attrValue !== "") {
-            shorthands.push({ name: attrName, value: attrValue });
+        if (token.type === "open" && token.tagName?.toLowerCase() === "scene") {
+            throw new Error(`Invalid tag "${token.tagName}". Use lowercase <scene>`);
         }
+
+        if (
+            token.type === "open" &&
+            token.tagName?.toLowerCase() === "a" &&
+            token.tagName !== "a"
+        ) {
+            throw new Error(`Invalid tag "${token.tagName}". Use lowercase <a>`);
+        }
+
+        i++;
     }
 
-    for (const { name, value } of shorthands) {
-        const camel = toCamelCase(name);
-        let matched = false;
+    if (errors.length > 0) {
+        throw new Error(errors.map((e) => e.message).join("\n"));
+    }
 
-        for (const comp of components) {
-            const component = comp.def.component;
-            const hasField = camel in component || `${camel}X` in component;
+    return nodes;
+}
 
-            if (hasField) {
-                matched = true;
-                if (!comp.attrs._value) {
-                    comp.attrs[name] = value;
-                }
-            }
-        }
+function parseNodeFromTokens(
+    tokens: Token[],
+    startIndex: number,
+    errors: ParseError[]
+): { node: Node | null; nextIndex: number } {
+    const token = tokens[startIndex];
 
-        if (!matched) {
-            const id = entityId ? ` (${entityId})` : "";
-            warnings.push(`shorthand "${name}" matches no declared component${id}`);
+    if (token.type !== "open" || token.tagName !== "a") {
+        if (token.tagName?.toLowerCase() === "a") {
+            errors.push({ message: `Invalid tag "${token.tagName}". Use lowercase <a>` });
         }
+        return { node: null, nextIndex: startIndex + 1 };
     }
 
-    for (const child of el.children) {
-        if (child.tag === "a") {
-            const childEntity = parseEntityElement(child, errors, warnings);
-            if (childEntity) children.push(childEntity);
-        } else if (child.tag.toLowerCase() === "a") {
-            errors.push({ message: `Invalid tag "${child.tag}". Use lowercase <a>` });
+    const rawAttrs = token.attrs ?? {};
+    const attrs: Attr[] = [];
+    let nodeId: string | undefined;
+
+    for (const [attrName, attrValue] of Object.entries(rawAttrs)) {
+        if (attrName === "id") {
+            nodeId = attrValue;
         } else {
-            errors.push({ message: `Only <a> children allowed, found <${child.tag}>` });
+            attrs.push({ name: attrName, value: attrValue });
         }
     }
 
-    return { id: entityId, components, children, entityRefs };
-}
+    const children: Node[] = [];
+    let i = startIndex + 1;
 
-interface RawElement {
-    [key: string]: unknown;
-    ":@"?: Record<string, string>;
-}
+    if (!token.selfClosing) {
+        let pendingComments: string[] = [];
+        let pendingBlank = false;
 
-function normalizeRaw(raw: unknown): ParsedElement[] {
-    if (!Array.isArray(raw)) return [];
+        while (i < tokens.length) {
+            const childToken = tokens[i];
 
-    const result: ParsedElement[] = [];
-
-    for (const item of raw as RawElement[]) {
-        if (typeof item !== "object" || item === null) continue;
+            if (childToken.type === "blank") {
+                pendingBlank = true;
+                i++;
+                continue;
+            }
 
-        for (const [key, value] of Object.entries(item)) {
-            if (key === ":@") continue;
+            if (childToken.type === "comment") {
+                pendingComments.push(childToken.value);
+                i++;
+                continue;
+            }
 
-            const rawAttrs = item[":@"] ?? {};
-            const attrs: Record<string, string> = {};
+            if (childToken.type === "close" && childToken.tagName === "a") {
+                i++;
+                break;
+            }
 
-            for (const [attrKey, attrVal] of Object.entries(rawAttrs)) {
-                if (typeof attrVal === "string") {
-                    attrs[attrKey] = attrVal;
-                } else if (attrVal === true || attrVal === "") {
-                    attrs[attrKey] = "";
+            if (childToken.type === "open" && childToken.tagName === "a") {
+                const result = parseNodeFromTokens(tokens, i, errors);
+                if (result.node) {
+                    result.node.comments = pendingComments.length > 0 ? pendingComments : undefined;
+                    result.node.blankBefore = pendingBlank || undefined;
+                    children.push(result.node);
                 }
+                pendingComments = [];
+                pendingBlank = false;
+                i = result.nextIndex;
+                continue;
             }
 
-            const children = normalizeRaw(value as unknown);
-
-            result.push({
-                tag: key,
-                attrs,
-                children,
-            });
+            i++;
         }
     }
 
-    return result;
-}
-
-export interface LoadResult {
-    readonly entities: Map<string, number>;
-    readonly roots: readonly number[];
-    readonly errors: readonly ParseError[];
+    return {
+        node: { id: nodeId, attrs, children },
+        nextIndex: i,
+    };
 }
 
 export interface PostLoadContext {
@@ -295,109 +329,115 @@ export function unregisterPostLoadHook(hook: PostLoadHook): void {
     if (idx !== -1) postLoadHooks.splice(idx, 1);
 }
 
-class LoadParseContext implements PostLoadContext {
-    private readonly nameToEntity = new Map<string, number>();
-
-    getEntityByName(name: string): number | null {
-        return this.nameToEntity.get(name) ?? null;
-    }
-
-    setName(name: string, eid: number): void {
-        this.nameToEntity.set(name, eid);
-    }
-
-    getEntityMap(): Map<string, number> {
-        return new Map(this.nameToEntity);
-    }
-}
-
-export function loadScene(state: State, xml: string): LoadResult {
-    const parseResult = parseXml(xml);
-    return instantiateScene(state, parseResult.entities, parseResult.errors);
-}
-
-export async function loadSceneFile(
-    state: State,
-    path: string,
-    readFile: (path: string) => Promise<string>
-): Promise<LoadResult> {
-    const xml = await readFile(path);
-    return loadScene(state, xml);
-}
-
 interface QueuedEntity {
-    readonly def: EntityDef;
-    readonly eid: number;
-    readonly parent?: number;
+    node: Node;
+    eid: number;
+    parent?: number;
 }
 
-function instantiateScene(
-    state: State,
-    entityDefs: readonly EntityDef[],
-    parseErrors: readonly ParseError[]
-): LoadResult {
-    const context = new LoadParseContext();
-    const errors: ParseError[] = [...parseErrors];
+export function load(nodes: Node[], state: State): Map<Node, number> {
+    const nameToEntity = new Map<string, number>();
+    const nodeToEntity = new Map<Node, number>();
+    const errors: ParseError[] = [];
     const queue: QueuedEntity[] = [];
-    const roots: number[] = [];
     const pendingFieldRefs: PendingFieldRef[] = [];
 
-    for (const entityDef of entityDefs) {
-        const eid = createEntityTree(state, entityDef, context, undefined, queue);
-        roots.push(eid);
+    for (const node of nodes) {
+        createEntityTree(state, node, nameToEntity, nodeToEntity, undefined, queue);
     }
 
-    for (const { def, eid, parent } of queue) {
+    for (const { node, eid, parent } of queue) {
         if (parent !== undefined) {
             addComponent(state.world, eid, Pair(ChildOf.relation, parent));
         }
 
-        for (const ref of def.entityRefs) {
-            applyRelation(state, eid, ref, context, errors);
+        const { componentAttrs, refs, unknown } = categorizeAttrs(node.attrs);
+
+        for (const attr of unknown) {
+            const nodeId = node.id ? ` (id="${node.id}")` : "";
+            errors.push({ message: `Unknown component "${attr.name}"${nodeId}` });
         }
 
-        for (const compDef of def.components) {
-            applyComponent(state, eid, compDef, context, errors, pendingFieldRefs);
+        for (const ref of refs) {
+            applyRelation(state, eid, ref, nameToEntity, errors);
+        }
+
+        for (const attr of componentAttrs) {
+            applyComponent(state, eid, attr, errors, pendingFieldRefs);
         }
     }
 
     for (const ref of pendingFieldRefs) {
-        const targetEid = context.getEntityByName(ref.targetName);
-        if (targetEid === null) {
+        const targetEid = nameToEntity.get(ref.targetName);
+        if (targetEid === undefined) {
             errors.push({ message: `Unknown entity: "@${ref.targetName}"` });
             continue;
         }
         setFieldValue(ref.component, ref.field, ref.eid, targetEid);
     }
 
+    const context: PostLoadContext = {
+        getEntityByName: (name) => nameToEntity.get(name) ?? null,
+    };
     for (const hook of postLoadHooks) {
         hook(state, context);
     }
 
-    return {
-        entities: context.getEntityMap(),
-        roots,
-        errors,
-    };
+    if (errors.length > 0) {
+        throw new Error(errors.map((e) => e.message).join("\n"));
+    }
+
+    return nodeToEntity;
+}
+
+interface CategorizedAttrs {
+    componentAttrs: { name: string; value: string; def: RegisteredComponent }[];
+    refs: Ref[];
+    unknown: { name: string; value: string }[];
+}
+
+function categorizeAttrs(attrs: Attr[]): CategorizedAttrs {
+    const componentAttrs: { name: string; value: string; def: RegisteredComponent }[] = [];
+    const refs: Ref[] = [];
+    const unknown: { name: string; value: string }[] = [];
+
+    for (const attr of attrs) {
+        if (attr.value.startsWith("@") && attr.value.length > 1) {
+            refs.push({ attr: attr.name, target: attr.value.slice(1) });
+            continue;
+        }
+
+        const registered = getRegisteredComponent(attr.name);
+        if (registered) {
+            componentAttrs.push({ name: attr.name, value: attr.value, def: registered });
+            continue;
+        }
+
+        unknown.push({ name: attr.name, value: attr.value });
+    }
+
+    return { componentAttrs, refs, unknown };
 }
 
 function createEntityTree(
     state: State,
-    def: EntityDef,
-    context: LoadParseContext,
+    node: Node,
+    nameToEntity: Map<string, number>,
+    nodeToEntity: Map<Node, number>,
     parent: number | undefined,
     queue: QueuedEntity[]
 ): number {
     const eid = state.addEntity();
 
-    if (def.id) {
-        context.setName(def.id, eid);
+    if (node.id) {
+        nameToEntity.set(node.id, eid);
     }
+    nodeToEntity.set(node, eid);
 
-    queue.push({ def, eid, parent });
+    queue.push({ node, eid, parent });
 
-    for (const childDef of def.children) {
-        createEntityTree(state, childDef, context, eid, queue);
+    for (const child of node.children) {
+        createEntityTree(state, child, nameToEntity, nodeToEntity, eid, queue);
     }
 
     return eid;
@@ -406,19 +446,19 @@ function createEntityTree(
 function applyRelation(
     state: State,
     eid: number,
-    ref: EntityRef,
-    context: LoadParseContext,
+    ref: Ref,
+    nameToEntity: Map<string, number>,
     errors: ParseError[]
 ): void {
-    const relationDef = getRelationDef(ref.attrName);
+    const relationDef = getRelationDef(ref.attr);
     if (!relationDef) {
-        errors.push({ message: `Unknown relation: "${ref.attrName}"` });
+        errors.push({ message: `Unknown relation: "${ref.attr}"` });
         return;
     }
 
-    const targetEid = context.getEntityByName(ref.targetName);
-    if (targetEid === null) {
-        errors.push({ message: `Unknown entity: "@${ref.targetName}"` });
+    const targetEid = nameToEntity.get(ref.target);
+    if (targetEid === undefined) {
+        errors.push({ message: `Unknown entity: "@${ref.target}"` });
         return;
     }
 
@@ -428,28 +468,32 @@ function applyRelation(
 function applyComponent(
     state: State,
     eid: number,
-    compDef: ComponentDef,
-    context: LoadParseContext,
+    attr: { name: string; value: string; def: RegisteredComponent },
     errors: ParseError[],
     pendingFieldRefs: PendingFieldRef[]
 ): void {
-    const { def, attrs } = compDef;
+    const { def, value } = attr;
     const { component, name, traits } = def;
 
     state.addComponent(eid, component as never);
 
     const defaults = traits?.defaults?.() ?? {};
-    for (const [field, value] of Object.entries(defaults)) {
-        setFieldValue(component, field, eid, value as number);
+    for (const [field, val] of Object.entries(defaults)) {
+        setFieldValue(component, field, eid, val as number);
+    }
+
+    const props: Record<string, string> = {};
+    if (value !== "") {
+        props["_value"] = value;
     }
 
     let values: Record<string, number>;
-    let entityRefs: FieldEntityRef[] = [];
+    let entityRefs: { field: string; targetName: string }[] = [];
 
     if (traits?.adapter) {
-        values = traits.adapter(attrs, eid);
+        values = traits.adapter(props, eid);
     } else {
-        const result = parseAttrs(def, attrs);
+        const result = parseAttrs(def, props);
         values = result.values;
         entityRefs = result.entityRefs;
         for (const err of result.errors) {
@@ -457,8 +501,8 @@ function applyComponent(
         }
     }
 
-    for (const [field, value] of Object.entries(values)) {
-        setFieldValue(component, field, eid, value);
+    for (const [field, val] of Object.entries(values)) {
+        setFieldValue(component, field, eid, val);
     }
 
     for (const ref of entityRefs) {
@@ -471,39 +515,40 @@ function applyComponent(
     }
 }
 
-interface ParseAttrsResult {
+function parseAttrs(
+    def: RegisteredComponent,
+    props: Record<string, string>
+): {
     values: Record<string, number>;
-    entityRefs: FieldEntityRef[];
+    entityRefs: { field: string; targetName: string }[];
     errors: string[];
-}
-
-function parseAttrs(def: RegisteredComponent, attrs: Record<string, string>): ParseAttrsResult {
+} {
     const allValues: Record<string, number> = {};
-    const allEntityRefs: FieldEntityRef[] = [];
+    const allEntityRefs: { field: string; targetName: string }[] = [];
     const allErrors: string[] = [];
 
-    if (attrs._value) {
-        if (isCSSAttrSyntax(attrs._value)) {
-            const result = parsePropertyString(def.name, attrs._value, def.component);
+    if (props._value) {
+        if (isCSSAttrSyntax(props._value)) {
+            const result = parsePropertyString(def.name, props._value, def.component);
             Object.assign(allValues, result.values);
             allEntityRefs.push(...result.entityRefs);
             allErrors.push(...result.errors);
         }
     }
 
-    for (const [attrName, attrValue] of Object.entries(attrs)) {
-        if (attrName === "_value") continue;
-        if (!attrValue) continue;
+    for (const [propName, propValue] of Object.entries(props)) {
+        if (propName === "_value") continue;
+        if (!propValue) continue;
 
-        if (isCSSAttrSyntax(attrValue)) {
-            const result = parsePropertyString(def.name, attrValue, def.component);
+        if (isCSSAttrSyntax(propValue)) {
+            const result = parsePropertyString(def.name, propValue, def.component);
             Object.assign(allValues, result.values);
             allEntityRefs.push(...result.entityRefs);
             allErrors.push(...result.errors);
         } else {
             const result = parsePropertyString(
                 def.name,
-                `${attrName}: ${attrValue}`,
+                `${propName}: ${propValue}`,
                 def.component
             );
             Object.assign(allValues, result.values);
@@ -522,17 +567,6 @@ function setFieldValue(component: ComponentLike, field: string, eid: number, val
     }
 }
 
-interface FieldEntityRef {
-    readonly field: string;
-    readonly targetName: string;
-}
-
-interface PropertyParseResult {
-    readonly values: Record<string, number>;
-    readonly entityRefs: readonly FieldEntityRef[];
-    readonly errors: readonly string[];
-}
-
 function detectVec2(component: ComponentLike, base: string): boolean {
     return `${base}X` in component && `${base}Y` in component;
 }
@@ -597,9 +631,13 @@ function parsePropertyString(
     componentName: string,
     propertyString: string,
     component: ComponentLike
-): PropertyParseResult {
+): {
+    values: Record<string, number>;
+    entityRefs: { field: string; targetName: string }[];
+    errors: string[];
+} {
     const values: Record<string, number> = {};
-    const entityRefs: FieldEntityRef[] = [];
+    const entityRefs: { field: string; targetName: string }[] = [];
     const errors: string[] = [];
 
     const properties = splitProperties(propertyString);
@@ -724,3 +762,81 @@ function parsePropertyString(
 function isCSSAttrSyntax(value: string): boolean {
     return value.includes(":") && (value.includes(";") || /^[\w-]+\s*:/.test(value));
 }
+
+export function serialize(nodes: Node[]): string {
+    const lines: string[] = ["<scene>"];
+    let isFirst = true;
+
+    for (const node of nodes) {
+        serializeNode(node, lines, 1, isFirst);
+        isFirst = false;
+    }
+
+    lines.push("</scene>");
+    return lines.join("\n");
+}
+
+function serializeNode(node: Node, lines: string[], depth: number, isFirst: boolean): void {
+    const indent = INDENT.repeat(depth);
+
+    if (node.blankBefore && !isFirst) {
+        lines.push("");
+    }
+
+    if (node.comments) {
+        for (const comment of node.comments) {
+            lines.push(`${indent}<!-- ${comment} -->`);
+        }
+    }
+
+    const attrParts = buildAttrParts(node);
+    const singleLine = `${indent}<a${attrParts.join("")}${node.children.length === 0 ? " />" : ">"}`;
+
+    if (singleLine.length <= MAX_LINE) {
+        lines.push(singleLine);
+    } else {
+        lines.push(`${indent}<a`);
+        const attrIndent = INDENT.repeat(depth + 1);
+        for (const part of attrParts) {
+            lines.push(`${attrIndent}${part.trim()}`);
+        }
+        lines.push(`${indent}${node.children.length === 0 ? "/>" : ">"}`);
+    }
+
+    if (node.children.length > 0) {
+        let childIsFirst = true;
+        for (const child of node.children) {
+            serializeNode(child, lines, depth + 1, childIsFirst);
+            childIsFirst = false;
+        }
+        lines.push(`${indent}</a>`);
+    }
+}
+
+function buildAttrParts(node: Node): string[] {
+    const parts: string[] = [];
+
+    if (node.id) {
+        parts.push(` id="${escapeAttr(node.id)}"`);
+    }
+
+    const sortedAttrs = [...node.attrs].sort((a, b) => a.name.localeCompare(b.name));
+
+    for (const attr of sortedAttrs) {
+        if (attr.value === "") {
+            parts.push(` ${attr.name}`);
+        } else {
+            parts.push(` ${attr.name}="${escapeAttr(attr.value)}"`);
+        }
+    }
+
+    return parts;
+}
+
+function escapeAttr(str: string): string {
+    return str
+        .replace(/&/g, "&amp;")
+        .replace(/"/g, "&quot;")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;");
+}