rooklang 0.0.0-stage → 0.3.0

package/dist/codegen/emitter.js

@@ -0,0 +1,296 @@
+import { decorate } from "../decorators.js";
+import { htmlTagName } from "../html-tag.js";
+import { localize } from "./imported.js";
+import { assignedNames, collectValueNames } from "../names.js";
+import { recursiveComponents } from "../recursion.js";
+import { forEachChild } from "../walk.js";
+import { JS_RESERVED, JS_UNDECLARABLE } from "./syntax.js";
+/**
+ * The base of the JS generator: the output buffer, scopes of declared names and the state of the
+ * current function. The generator is split into layers, each adding to the previous one:
+ *
+ *     Emitter → ExpressionEmitter → CallEmitter → SimpleStatementEmitter → ControlStatementEmitter
+ *       → ParallelLoopEmitter → StatementEmitter → UpdateEmitter → AttributeEmitter
+ *       → CreationEmitter → ElementEmitter → ControlFlowEmitter → ComponentPropsEmitter
+ *       → ComponentValueEmitter → EarlyReturnEmitter → RefEmitter
+ *       → StyleEmitter → ComponentEmitter → WebComponentEmitter → FunctionEmitter → JsGenerator
+ */
+export class Emitter {
+    program;
+    options;
+    lines = [];
+    level = 0;
+    scopes = [];
+    fn = {
+        deferMode: 'none',
+        deferList: '$$defer',
+        temps: 0,
+        breakTargets: [],
+    };
+    /** Helpers that the module must define, such as $$runDeferred. */
+    helpers = new Set();
+    /**
+     * Whether code for the current expression may be written before the statement that contains it.
+     * Elements use this to be created in statements of their own; it is off where an expression is
+     * not always evaluated exactly once (branches of `?:`, loop conditions and so on).
+     */
+    hoist = false;
+    /** Top-level `type` aliases, to find the zero value of `let id ID`. */
+    typeAliases = new Map();
+    /** Names that are assigned somewhere in the module; others keep their value. */
+    assigned;
+    /** Names used as values; imports used only as types are dropped. */
+    valueNames = new Set();
+    /** Components of the module with their decorators applied, inlined where they are used. */
+    components = new Map();
+    /**
+     * Components that become functions: recursive ones cannot be inlined, and web components
+     * (`@html-tag`) create their markup in the element's class.
+     */
+    functionComponents;
+    /** Web components of the module by their tags: `<app-card count={3} />` sets their properties. */
+    webComponents = new Map();
+    /** The JS functions of components of other modules: `$$Card`, imported from their modules. */
+    functionNames = new Map();
+    /** For those, the element at the top of what they create, found in their modules. */
+    importedRoots = new Map();
+    /** The inlined copies of each component and the lines they take, to choose functions (js.ts). */
+    inlined = new Map();
+    /** The decorators that components of the module apply, by name. */
+    appliedDecorators = new Set();
+    /** Copies of the code of other modules: their positions are in the sources of those. */
+    foreign = new WeakSet();
+    /** Components of other modules inlined here, by name, with what their packages bring. */
+    inlinedImports = new Map();
+    /** The components that decorators of other modules bring, by the names of the decorators. */
+    decoratorImports = new Map();
+    /** Components a package brings: they have no function here, so they are always inlined. */
+    alwaysInlined = new Set();
+    constructor(program, options) {
+        this.program = program;
+        this.options = options;
+        const decorators = new Map(options.decorators);
+        const imported = [...(options.decorators?.values() ?? [])];
+        for (const statement of program.body) {
+            if (statement.kind === 'DecoratorDeclaration') {
+                decorators.set(statement.name.name, { node: statement, moduleNames: [] });
+            }
+            else if (statement.kind === 'ComponentDeclaration') {
+                for (const use of statement.decorators)
+                    this.appliedDecorators.add(use.name.name);
+            }
+        }
+        const originals = new WeakSet();
+        const collect = (node) => {
+            originals.add(node);
+            forEachChild(node, collect);
+        };
+        const sources = [...imported, ...(options.components?.values() ?? [])];
+        for (const each of imported)
+            collect(each.node);
+        for (const each of sources) {
+            for (const node of each.inline?.components.values() ?? [])
+                collect(node);
+            for (const source of each.inline?.decorators.values() ?? [])
+                collect(source.node);
+        }
+        // Copies of other modules' code keep the types of the originals, from their own modules.
+        const { types } = options;
+        const keepType = (copy, original) => {
+            const expression = original;
+            const type = types?.get(expression) ??
+                sources.map((each) => each.types?.get(expression)).find((each) => each !== undefined);
+            if (type)
+                types?.set(copy, type);
+            if (originals.has(original) || this.foreign.has(original))
+                this.foreign.add(copy);
+        };
+        // The components that a decorator of another module uses come with it, under tags of their own.
+        for (const [name, decorator] of options.decorators ?? []) {
+            if (!decorator.inline || !this.appliedDecorators.has(name))
+                continue;
+            // Its members cannot hide the names its components use: the checker of its module sees to it.
+            const localized = localize(name, name, decorator.inline, keepType);
+            this.decoratorImports.set(name, localized);
+            decorators.set(name, { ...decorator, tags: localized.tags });
+            for (const [tag, node] of localized.inline) {
+                this.components.set(tag, node);
+                this.alwaysInlined.add(tag);
+            }
+        }
+        for (const statement of program.body) {
+            if (statement.kind === 'TypeAliasDeclaration') {
+                this.typeAliases.set(statement.name.name, statement.type);
+            }
+            else if (statement.kind === 'ComponentDeclaration') {
+                this.components.set(statement.name.name, decorate(statement, decorators, keepType));
+            }
+        }
+        // A component used as a value is a function, which tags that take it from there call.
+        collectValueNames(program, this.valueNames, (name) => this.components.has(name) || options.components?.has(name) === true);
+        // A small component of another module is inlined, unless generateJs chose to call it.
+        for (const [name, component] of options.components ?? []) {
+            if (!component.inline || options.functions?.has(name) || this.valueNames.has(name))
+                continue;
+            const localized = localize(name, component.node.name.name, component.inline, keepType);
+            this.inlinedImports.set(name, localized);
+            for (const [tag, node] of localized.inline) {
+                this.components.set(tag, node);
+                if (tag !== name)
+                    this.alwaysInlined.add(tag);
+            }
+        }
+        // Nodes of other modules that were not copied, as names that are not renamed, keep their types.
+        const fill = (node) => {
+            const expression = node;
+            if (!types.has(expression)) {
+                const type = sources.map((each) => each.types?.get(expression)).find(Boolean);
+                if (type)
+                    types.set(expression, type);
+            }
+            forEachChild(node, fill);
+        };
+        if (types && sources.length > 0) {
+            for (const component of this.components.values())
+                fill(component);
+        }
+        this.assigned = assignedNames(program);
+        for (const component of this.components.values())
+            assignedNames(component, this.assigned);
+        const functionComponents = recursiveComponents(this.components);
+        for (const [name, component] of this.components) {
+            // Other modules call an exported component, so it is a function here too.
+            if (component.exported || this.valueNames.has(name))
+                functionComponents.add(component);
+            if (!component.htmlTag)
+                continue;
+            functionComponents.add(component);
+            this.webComponents.set(htmlTagName(component), component);
+        }
+        for (const name of options.functions ?? []) {
+            const component = this.components.get(name);
+            if (component)
+                functionComponents.add(component);
+        }
+        // Other components of other modules are called: their functions are imported.
+        const called = [
+            ...(options.components ?? []),
+        ]
+            .filter(([name]) => !this.inlinedImports.has(name))
+            .map(([name, { node, root }]) => [name, { node, name: `$$${name}`, root }]);
+        for (const localized of [...this.inlinedImports.values(), ...this.decoratorImports.values()]) {
+            called.push(...localized.functions);
+        }
+        for (const [tag, { node, name, root }] of called) {
+            this.components.set(tag, node);
+            this.functionNames.set(node, name);
+            this.importedRoots.set(node, root);
+            functionComponents.add(node);
+        }
+        this.functionComponents = functionComponents;
+    }
+    // ─── Output ────────────────────────────────────────────────────────────────────────────────────
+    indent() {
+        return '  '.repeat(this.level);
+    }
+    /** Writes a line at the current indentation. Later lines of `text` are already indented. */
+    line(text) {
+        this.lines.push(this.indent() + text);
+    }
+    blankLine() {
+        if (this.lines.length > 0 && this.lines.at(-1) !== '')
+            this.lines.push('');
+    }
+    /** Returns the lines written by `emit`, one level deeper than the current one. */
+    capture(emit) {
+        const saved = this.lines;
+        this.lines = [];
+        this.level++;
+        try {
+            emit();
+            return this.lines;
+        }
+        finally {
+            this.level--;
+            this.lines = saved;
+        }
+    }
+    /** Renders the lines written by `emit` as a `{ ... }` block, for use inside a line. */
+    block(emit) {
+        const inner = this.capture(emit);
+        return inner.length === 0 ? '{}' : `{\n${inner.join('\n')}\n${this.indent()}}`;
+    }
+    blankLineBetween(previous, next) {
+        if (this.foreign.has(previous) || this.foreign.has(next))
+            return false;
+        return /\n[^\S\n]*\n/.test(this.options.source.slice(previous.end, next.start));
+    }
+    /** A component of the module as it is inlined: with its decorators applied. */
+    applied(component) {
+        return this.components.get(component.name.name) ?? component;
+    }
+    // ─── Scopes and names ──────────────────────────────────────────────────────────────────────────
+    withScope(bindings, emit) {
+        this.scopes.push(new Map(bindings));
+        try {
+            return emit();
+        }
+        finally {
+            this.scopes.pop();
+        }
+    }
+    lookup(name) {
+        for (let i = this.scopes.length - 1; i >= 0; i--) {
+            const kind = this.scopes[i].get(name);
+            if (kind !== undefined)
+                return kind;
+        }
+        return undefined;
+    }
+    /** The JS name for a Rook name. */
+    name(name) {
+        const rename = JS_RESERVED.has(name) || (JS_UNDECLARABLE.has(name) && this.lookup(name) !== undefined);
+        return rename ? `${name}$` : name;
+    }
+    params(params) {
+        // Several `_` parameters would be duplicate names in JS.
+        const blanks = params.filter((param) => param.name.name === '_').length;
+        return params
+            .map((param, i) => param.name.name === '_' && blanks > 1 ? `_${i}` : this.name(param.name.name))
+            .join(', ');
+    }
+    // ─── Functions ─────────────────────────────────────────────────────────────────────────────────
+    withFunction(mode, params, emit) {
+        const saved = this.fn;
+        this.fn = { deferMode: mode, deferList: '$$defer', temps: 0, breakTargets: [] };
+        try {
+            return this.withScope(params.map((param) => [param.name.name, 'param']), emit);
+        }
+        finally {
+            this.fn = saved;
+        }
+    }
+    withHoisting(hoist, emit) {
+        const saved = this.hoist;
+        this.hoist = hoist;
+        try {
+            return emit();
+        }
+        finally {
+            this.hoist = saved;
+        }
+    }
+    /** A fresh temporary name: `$$0`, `$$1`, ... */
+    temp() {
+        return `$$${this.fn.temps++}`;
+    }
+    withBreakTarget(label, emit) {
+        this.fn.breakTargets.push(label);
+        try {
+            return emit();
+        }
+        finally {
+            this.fn.breakTargets.pop();
+        }
+    }
+}

package/dist/codegen/expressions.d.ts

@@ -0,0 +1,49 @@
+import type * as ast from '../ast.ts';
+import { Emitter } from './emitter.ts';
+/** Expressions, with the parentheses that JS operator precedence requires. */
+export declare abstract class ExpressionEmitter extends Emitter {
+    /** Parameters and body of a function; implemented by FunctionEmitter. */
+    protected abstract func(params: ast.Parameter[], body: ast.BlockStatement): [string, string];
+    /** Code that creates an element, as an expression; implemented by ElementEmitter. */
+    protected abstract element(node: ast.ElementExpression): string;
+    /** Writes a statement; implemented by StatementEmitter. */
+    protected abstract statement(node: ast.Statement): void;
+    /** Whether an arrow function's expression body changes component state; see ElementEmitter. */
+    protected abstract changesState(body: ast.Expression): boolean;
+    /** Go-style zero value of a type, or `null`; implemented by SimpleStatementEmitter. */
+    protected abstract zeroValue(type: ast.TypeNode): string | null;
+    /** `f(x)`, `new C(x)`, `[a, b]` and `[]byte(s)`; implemented by CallEmitter. */
+    protected abstract call(node: ast.CallExpression): string;
+    protected abstract newExpression(node: ast.NewExpression): string;
+    protected abstract arrayLiteral(node: ast.ArrayLiteral): string;
+    protected abstract conversion(node: ast.ConversionExpression): string;
+    protected abstract make(node: ast.MakeExpression): string;
+    /** `<-ch` that gives `[value, ok]`, in `v, ok = <-ch`. */
+    protected readonly commaOk: WeakSet<ast.Expression>;
+    /** `items[i]` in a part of `go for`, which is `items[$$i]` there (parallel.ts). */
+    protected readonly partElements: Set<ast.Expression>;
+    /** In the worker module, `go` runs in the same worker (go-helpers.ts). */
+    protected get inWorker(): boolean;
+    /** `v, ok = <-ch`: two variables from a single receive. */
+    protected markCommaOk(count: number, values: readonly ast.Expression[]): void;
+    /** The expression, in parentheses if it binds weaker than `minPrecedence`. */
+    protected expression(node: ast.Expression, minPrecedence: number, forceParens?: boolean): string;
+    /** An expression used as a statement: JS would read a leading `{` as a block. */
+    protected expressionStatement(node: ast.Expression): string;
+    /** `1.toFixed()` is not valid JS, so number literals before `.` get parentheses. */
+    protected memberObject(node: ast.Expression, render: (node: ast.Expression) => string): string;
+    /** Whether `error` refers to the predeclared function rather than to a declared name. */
+    protected isBuiltinError(node: ast.Expression): boolean;
+    /**
+     * The component a capitalized name refers to here: not a variable that hides it, as the
+     * property `Header` of an inlined component does.
+     */
+    protected componentNamed(name: string): ast.ComponentDeclaration | undefined;
+    private expressionWithPrecedence;
+    protected elements(elements: readonly (ast.Expression | ast.SpreadElement)[]): string;
+    private template;
+    private objectLiteral;
+    private arrowFunction;
+    private unary;
+    private binary;
+}

package/dist/codegen/expressions.js

@@ -0,0 +1,262 @@
+import { decoratedName } from "../decorators.js";
+import { goCaptures, goParams, goTarget } from "../goroutines.js";
+import { isIterator, usesThis } from "../iterators.js";
+import { containsElement, startsWithObjectLiteral } from "./analysis.js";
+import { Emitter } from "./emitter.js";
+import { PREDECLARED } from "./helpers.js";
+import { ARROW, BINARY, CONDITIONAL, POSTFIX, PRIMARY, UNARY } from "./syntax.js";
+/** Expressions, with the parentheses that JS operator precedence requires. */
+export class ExpressionEmitter extends Emitter {
+    /** `<-ch` that gives `[value, ok]`, in `v, ok = <-ch`. */
+    commaOk = new WeakSet();
+    /** `items[i]` in a part of `go for`, which is `items[$$i]` there (parallel.ts). */
+    partElements = new Set();
+    /** In the worker module, `go` runs in the same worker (go-helpers.ts). */
+    get inWorker() {
+        return this.options.goroutines !== undefined && 'targets' in this.options.goroutines;
+    }
+    /** `v, ok = <-ch`: two variables from a single receive. */
+    markCommaOk(count, values) {
+        const [value] = values;
+        if (count === 2 && values.length === 1 && value?.kind === 'UnaryExpression') {
+            if (value.operator === '<-')
+                this.commaOk.add(value);
+        }
+    }
+    /** The expression, in parentheses if it binds weaker than `minPrecedence`. */
+    expression(node, minPrecedence, forceParens = false) {
+        const [text, precedence] = this.expressionWithPrecedence(node);
+        return precedence < minPrecedence || forceParens ? `(${text})` : text;
+    }
+    /** An expression used as a statement: JS would read a leading `{` as a block. */
+    expressionStatement(node) {
+        const text = this.expression(node, 0);
+        return startsWithObjectLiteral(node) ? `(${text})` : text;
+    }
+    /** `1.toFixed()` is not valid JS, so number literals before `.` get parentheses. */
+    memberObject(node, render) {
+        const text = render(node);
+        return node.kind === 'NumberLiteral' ? `(${text})` : text;
+    }
+    /** Whether `error` refers to the predeclared function rather than to a declared name. */
+    isBuiltinError(node) {
+        return (node.kind === 'Identifier' && node.name === 'error' && this.lookup('error') === undefined);
+    }
+    /**
+     * The component a capitalized name refers to here: not a variable that hides it, as the
+     * property `Header` of an inlined component does.
+     */
+    componentNamed(name) {
+        const binding = this.lookup(name);
+        return binding === undefined || binding === 'import' ? this.components.get(name) : undefined;
+    }
+    expressionWithPrecedence(node) {
+        switch (node.kind) {
+            case 'Identifier': {
+                const component = this.componentNamed(node.name);
+                // A component as a value is its function.
+                if (component) {
+                    return [this.functionNames.get(component) ?? `$$${component.name.name}`, PRIMARY];
+                }
+                // `close(ch)` and the like are predeclared; JS has a `close` of its own, the window's.
+                const helper = Object.hasOwn(PREDECLARED, node.name) ? PREDECLARED[node.name] : undefined;
+                if (helper && this.lookup(node.name) === undefined) {
+                    this.helpers.add(helper);
+                    return [`$$${node.name}`, PRIMARY];
+                }
+                // The predeclared `error` used as a value is JS's `Error`, which also works without `new`.
+                return [this.isBuiltinError(node) ? 'Error' : this.name(node.name), PRIMARY];
+            }
+            case 'NumberLiteral':
+            case 'BigIntLiteral':
+            case 'StringLiteral':
+                return [node.raw, PRIMARY];
+            case 'TemplateLiteral':
+                return [this.template(node), PRIMARY];
+            case 'BooleanLiteral':
+                return [String(node.value), PRIMARY];
+            case 'NullLiteral':
+                return ['null', PRIMARY];
+            // The member is a variable of the component's code: see decorate().
+            case 'DecoratorMember':
+                return [decoratedName(node.decorator.name, node.member.name), PRIMARY];
+            case 'DecoratorGet':
+                return [decoratedName(node.target.decorator.name, node.target.member.name), PRIMARY];
+            case 'ThisExpression':
+                return ['this', PRIMARY];
+            // `as` is only for the checker.
+            case 'AsExpression':
+                return this.expressionWithPrecedence(node.expression);
+            case 'SuperExpression':
+                return ['super', PRIMARY];
+            case 'ArrayLiteral': {
+                const text = this.arrayLiteral(node);
+                return [text, text.startsWith('[') ? PRIMARY : POSTFIX];
+            }
+            case 'ObjectLiteral':
+                return [this.objectLiteral(node), PRIMARY];
+            case 'FuncExpression': {
+                // Func literals become arrow functions, so `this` inside them is the enclosing `this`. An
+                // iterator is a generator function, which is never an arrow: it gets that `this` bound.
+                const [params, body] = this.func(node.params, node.body);
+                if (isIterator(node.params)) {
+                    return usesThis(node.body)
+                        ? [`function* () ${body}.bind(this)`, POSTFIX]
+                        : [`function* () ${body}`, PRIMARY];
+                }
+                return [`${node.async ? 'async ' : ''}(${params}) => ${body}`, ARROW];
+            }
+            case 'ArrowFunction':
+                return [this.arrowFunction(node), ARROW];
+            // `chan<number>(10)`: the channel keeps the zero value that a closed one gives.
+            case 'ChanExpression': {
+                const size = node.size ? this.expression(node.size, ARROW) : '0';
+                this.helpers.add('chan');
+                return [`$$chan(${size}, ${this.zeroValue(node.element) ?? 'null'})`, POSTFIX];
+            }
+            // The worker module has the function under the same name, a literal under the name given to
+            // it, after the local names it uses; the arguments are copied there. In the worker module a
+            // literal runs in the same worker, with copies of those names as its first parameters.
+            case 'GoExpression': {
+                const { callee } = node.call;
+                const literal = callee.kind === 'FuncExpression' ? callee : null;
+                const captured = literal ? goCaptures(this.program, node) : [];
+                const args = [
+                    ...captured.map((name) => this.name(name)),
+                    this.elements(node.call.arguments),
+                ];
+                // Without type checking, a callee that is neither fails when the call runs.
+                const fn = literal && this.inWorker
+                    ? this.expression({ ...literal, params: [...goParams(literal, captured), ...literal.params] }, ARROW)
+                    : JSON.stringify(goTarget(this.program, node));
+                this.helpers.add(this.inWorker ? 'goLocal' : 'go');
+                return [`$$go(${fn}, [${args.filter((arg) => arg !== '').join(', ')}])`, POSTFIX];
+            }
+            case 'UnaryExpression':
+                return [this.unary(node), UNARY];
+            case 'BinaryExpression':
+                return [this.binary(node), BINARY[node.operator]];
+            case 'ConditionalExpression': {
+                const test = this.expression(node.test, CONDITIONAL + 1);
+                // Only one branch runs, so neither may create elements in advance.
+                const [consequent, alternate] = this.withHoisting(false, () => [
+                    this.expression(node.consequent, ARROW),
+                    this.expression(node.alternate, ARROW),
+                ]);
+                return [`${test} ? ${consequent} : ${alternate}`, CONDITIONAL];
+            }
+            case 'CallExpression':
+                return [this.call(node), POSTFIX];
+            case 'NewExpression':
+                return [this.newExpression(node), POSTFIX];
+            case 'ConversionExpression':
+                return [this.conversion(node), POSTFIX];
+            case 'MakeExpression':
+                return [this.make(node), POSTFIX];
+            case 'MemberExpression': {
+                const object = this.memberObject(node.object, (o) => this.expression(o, POSTFIX));
+                return [`${object}${node.optional ? '?.' : '.'}${node.property.name}`, POSTFIX];
+            }
+            case 'IndexExpression': {
+                const object = this.memberObject(node.object, (o) => this.expression(o, POSTFIX));
+                const index = this.partElements.has(node) ? '$$i' : this.expression(node.index, 0);
+                return [`${object}${node.optional ? '?.[' : '['}${index}]`, POSTFIX];
+            }
+            case 'ElementExpression':
+                return [this.element(node), POSTFIX];
+        }
+    }
+    elements(elements) {
+        return elements
+            .map((element) => element.kind === 'SpreadElement'
+            ? `...${this.expression(element.argument, ARROW)}`
+            : this.expression(element, ARROW))
+            .join(', ');
+    }
+    template(node) {
+        let text = '`';
+        node.quasis.forEach((quasi, i) => {
+            text += quasi.raw;
+            const expression = node.expressions[i];
+            if (expression)
+                text += `\${${this.expression(expression, 0)}}`;
+        });
+        return `${text}\``;
+    }
+    objectLiteral(node) {
+        if (node.properties.length === 0)
+            return '{}';
+        const properties = node.properties.map((property) => {
+            if (property.kind === 'SpreadElement') {
+                return `...${this.expression(property.argument, ARROW)}`;
+            }
+            const key = property.key.kind === 'StringLiteral' ? property.key.raw : property.key.name;
+            const value = this.expression(property.value, ARROW);
+            // A renamed shorthand (`{ delete }` → `delete$`) must keep its key.
+            return property.shorthand && value === key ? key : `${key}: ${value}`;
+        });
+        return `{ ${properties.join(', ')} }`;
+    }
+    arrowFunction(node) {
+        const { body } = node;
+        const async = node.async ? 'async ' : '';
+        if (body.kind === 'BlockStatement') {
+            const [params, block] = this.func(node.params, body);
+            return `${async}(${params}) => ${block}`;
+        }
+        return this.withFunction('none', node.params, () => {
+            const params = this.params(node.params);
+            if (containsElement(body) || this.changesState(body)) {
+                // Elements are created by statements, and so are updates after a change of state: the
+                // body becomes a block.
+                const statement = {
+                    kind: 'ReturnStatement',
+                    values: [body],
+                    start: body.start,
+                    end: body.end,
+                };
+                const block = this.block(() => this.statement(statement));
+                return `${async}(${params}) => ${block}`;
+            }
+            // `() => ({ ... })`: a body starting with `{` would be read as a block.
+            const text = this.expression(body, ARROW, startsWithObjectLiteral(body));
+            return `${async}(${params}) => ${text}`;
+        });
+    }
+    unary(node) {
+        if (node.operator === '<-') {
+            this.helpers.add('chan');
+            const channel = this.expression(node.argument, ARROW);
+            return `await $$receive(${channel}${this.commaOk.has(node) ? ', true' : ''})`;
+        }
+        const argument = this.expression(node.argument, UNARY);
+        if (node.operator === 'typeof' || node.operator === 'await') {
+            return `${node.operator} ${argument}`;
+        }
+        // `- -x` must not turn into `--x`.
+        const space = (node.operator === '-' || node.operator === '+') && argument.startsWith(node.operator);
+        return `${node.operator}${space ? ' ' : ''}${argument}`;
+    }
+    binary(node) {
+        const { operator } = node;
+        const precedence = BINARY[operator];
+        const rightAssociative = operator === '**';
+        const nullishMix = (operand) => operand.kind === 'BinaryExpression' &&
+            (operator === '??'
+                ? operand.operator === '||' || operand.operator === '&&'
+                : (operator === '||' || operator === '&&') && operand.operator === '??');
+        // JS rejects `-a ** b` and mixing `??` with `||` / `&&` unless there are parentheses.
+        const left = this.expression(node.left, rightAssociative ? precedence + 1 : precedence, (operator === '**' && node.left.kind === 'UnaryExpression') || nullishMix(node.left));
+        // The right side of `&&`, `||` and `??` may not be evaluated.
+        const shortCircuits = operator === '&&' || operator === '||' || operator === '??';
+        const right = this.withHoisting(this.hoist && !shortCircuits, () => this.expression(node.right, rightAssociative ? precedence : precedence + 1, nullishMix(node.right)));
+        let jsOperator = operator;
+        if (operator === '==' || operator === '!=') {
+            // `x == null` stays loose so that it also matches `undefined` coming from JS code.
+            const withNull = node.left.kind === 'NullLiteral' || node.right.kind === 'NullLiteral';
+            if (!withNull)
+                jsOperator = `${operator}=`;
+        }
+        return `${left} ${jsOperator} ${right}`;
+    }
+}

package/dist/codegen/functions.d.ts

@@ -0,0 +1,28 @@
+import type * as ast from '../ast.ts';
+import { WebComponentEmitter } from './web-components.ts';
+/** Function bodies and `defer`. */
+export declare abstract class FunctionEmitter extends WebComponentEmitter {
+    /** Parameters and body of a function, method or func literal. */
+    protected func(params: ast.Parameter[], body: ast.BlockStatement): [string, string];
+    /**
+     * `effect { ... }` becomes a function, `$$effect5`, which runs once the markup is created and
+     * again after the updates of what it reads (see EarlyReturnEmitter). What it defers is run before
+     * it runs again, and when `{if}`, `{switch}` or `{for}` removes the component.
+     */
+    protected effectStatement(node: ast.EffectStatement): void;
+    private effectBody;
+    /** A `defer` in 'stack' and 'effect' modes; in 'try' mode statementsWithDefers handles them. */
+    protected deferStatement(node: ast.DeferStatement): void;
+    /** Statements of a body whose `defer`s are all at its top level: one try/finally per `defer`. */
+    private statementsWithDefers;
+    /**
+     * Go evaluates the function and arguments of a deferred call at the `defer` statement. Values
+     * that cannot change in between are used as they are; others are saved to temporaries here.
+     * Returns a function that writes the deferred code.
+     */
+    private prepareDeferred;
+    private deferredCall;
+    /** The expression itself if its value cannot change before the deferred call runs. */
+    private stable;
+    private isStable;
+}