rooklang 0.0.0-stage → 0.3.0

package/dist/checker/decorator-members.js

@@ -0,0 +1,140 @@
+import { ARRAY_MUTATORS } from "../methods.js";
+import { DecoratorChecker } from "./decorators.js";
+import { nonNull, UNKNOWN } from "./types.js";
+// The public members of decorators, in the components they are applied to: `@visible.show()` calls
+// a function, `get(@visible.shown)` reads state or a constant, and none of them can be changed
+// outside the decorator.
+export class DecoratorMemberChecker extends DecoratorChecker {
+    /** `@visible.show`: a public function; state and constants are read with `get`. */
+    checkDecoratorMember(node) {
+        const member = this.findDecoratorMember(node);
+        if (member && member.kind !== 'func') {
+            const { decorator, member: name } = node;
+            this.error(`read "${name.name}" of @${decorator.name} with get(@${decorator.name}.${name.name})`, node);
+        }
+        return member?.type ?? UNKNOWN;
+    }
+    /** `get(@visible.shown)`: public state or a constant. */
+    checkDecoratorGet(node) {
+        const member = this.findDecoratorMember(node.target);
+        if (member?.kind === 'func') {
+            const { decorator, member: name } = node.target;
+            this.error(`"${name.name}" of @${decorator.name} is a function: call it, @${decorator.name}.${name.name}()`, node);
+        }
+        return member?.type ?? UNKNOWN;
+    }
+    /**
+     * A public member of a decorator applied to the component being checked, or of one that the
+     * decorator being checked needs.
+     */
+    findDecoratorMember(node) {
+        const name = node.decorator.name;
+        const member = node.member.name;
+        if (this.decorator)
+            return this.neededMember(node, this.decorator.node);
+        const component = this.component;
+        if (!component) {
+            this.error(`@${name}.${member} can only be used in a component that @${name} is applied to`, node);
+            return null;
+        }
+        const info = component.decorators.find((decorator) => decorator.node.name.name === name);
+        if (!info) {
+            this.error(this.decorators.has(name)
+                ? `@${name} is not applied to ${component.node.name.name}: write @${name} before comp`
+                : `unknown decorator @${name}`, node.decorator);
+            return null;
+        }
+        return this.publicMember(node, info);
+    }
+    /** `get(@cart.count)` in `dec cartBadge() needs cart`. */
+    neededMember(node, decorator) {
+        const name = node.decorator.name;
+        const current = decorator.name.name;
+        if (name === current) {
+            this.error(`inside @${name} its members are used by their names: ${node.member.name}`, node);
+            return null;
+        }
+        if (!decorator.needs.some((need) => need.name === name)) {
+            this.error(`@${current} can use @${name} only if it needs it: write "needs ${name}" after its parameters`, node.decorator);
+            return null;
+        }
+        const info = this.decorators.get(name);
+        // An unknown decorator after `needs` is reported there.
+        return info ? this.publicMember(node, info) : null;
+    }
+    publicMember(node, info) {
+        const name = node.decorator.name;
+        const member = node.member.name;
+        const found = info.members.get(member);
+        if (!found) {
+            this.error(info.names.has(member)
+                ? `"${member}" of @${name} is not public: write "public" before its declaration`
+                : `@${name} has no member "${member}"`, node.member);
+        }
+        return found ?? null;
+    }
+    /**
+     * Members of a decorator are read-only outside it: `get(@cart.count) = 0`, `get(@cart.items)[0]
+     * = x`. Returns whether `target` is one of them.
+     */
+    checkDecoratorWrite(target) {
+        const root = decoratorRoot(target);
+        if (!root)
+            return false;
+        if (this.findDecoratorMember(root))
+            this.readOnlyError(root, target);
+        return true;
+    }
+    /** `get(@cart.items).push(x)`: a method that changes the array. */
+    checkDecoratorMutation(node) {
+        const { callee } = node;
+        if (callee.kind !== 'MemberExpression')
+            return;
+        const root = decoratorRoot(callee.object);
+        if (!root || !ARRAY_MUTATORS.has(callee.property.name))
+            return;
+        if (nonNull(this.typeOfChecked(callee.object)).kind !== 'array')
+            return;
+        this.readOnlyError(root, node);
+    }
+    readOnlyError(member, node) {
+        const name = member.decorator.name;
+        const info = this.decorators.get(name);
+        const change = [...(info?.members ?? [])].find(([, found]) => found.kind === 'func')?.[0];
+        const hint = change
+            ? `change it with one of its public functions, e.g. @${name}.${change}()`
+            : `give @${name} a public function that changes it`;
+        this.error(`"${member.member.name}" of @${name} is read-only outside it; ${hint}`, node);
+    }
+    /** `card.count` without `@`: `card` is not a value, but a decorator may have that name. */
+    decoratorWithoutAt(node) {
+        const { object } = node;
+        if (object.kind !== 'Identifier' || this.lookupValue(object.name))
+            return false;
+        const info = this.decorators.get(object.name);
+        if (!info)
+            return false;
+        const name = object.name;
+        const member = node.property.name;
+        this.error(info.members.get(member)?.kind === 'func'
+            ? `"${name}" is not defined; to call a function of @${name} write @${name}.${member}()`
+            : `"${name}" is not defined; to read public state of @${name} write get(@${name}.${member})`, object);
+        return true;
+    }
+}
+/** The member of a decorator that `get(@cart.items)[0].done` starts with, if any. */
+function decoratorRoot(node) {
+    switch (node.kind) {
+        case 'DecoratorMember':
+            return node;
+        case 'DecoratorGet':
+            return node.target;
+        case 'MemberExpression':
+        case 'IndexExpression':
+            return decoratorRoot(node.object);
+        case 'CallExpression':
+            return decoratorRoot(node.callee);
+        default:
+            return null;
+    }
+}

package/dist/checker/decorator-wrappers.d.ts

@@ -0,0 +1,20 @@
+import type { ComponentInfo, DecoratorInfo } from './context.ts';
+import { StyleChecker } from './styles.ts';
+import { type Type } from './types.ts';
+type WrapperInfo = NonNullable<DecoratorInfo['wrapper']>;
+export declare abstract class DecoratorWrapperChecker extends StyleChecker {
+    /** The type of what the wrapper gets, resolved with the other declarations of the module. */
+    protected resolveWrapper(info: DecoratorInfo): void;
+    /** The `return` of a decorator's body, once the body is checked. */
+    protected checkWrapper(info: DecoratorInfo): void;
+    private checkWrapperParam;
+    private takesMarkup;
+    /** A wrapper is inlined where the component returns, so it returns once, at its end. */
+    private checkWrapperBody;
+    protected wrappedType(info: ComponentInfo, own: Type, seen: Set<ComponentInfo>): Type;
+    /** What a wrapper gives, found without checking it again, like the markup of a component. */
+    protected wrapperResult(wrapper: WrapperInfo, seen: Set<ComponentInfo>): Type;
+    /** What the component returns fits its wrappers, from the bottom decorator up. */
+    protected checkWrappedTypes(info: ComponentInfo): void;
+}
+export {};

package/dist/checker/decorator-wrappers.js

@@ -0,0 +1,132 @@
+import { decoratorNames, wrapperBody, wrapperOf } from "../decorators.js";
+import { isUntyped, ownStatements } from "./helpers.js";
+import { StyleChecker } from "./styles.js";
+import { isAssignable, typeToString, UNKNOWN } from "./types.js";
+// The wrappers of decorators, `return (content Element) => <div>{content}</div>`: what they get from
+// the component and what they give instead. `<Page />` has the type of what the outermost gives.
+const EXAMPLE = 'return (content Element) => <div>{content}</div>';
+export class DecoratorWrapperChecker extends StyleChecker {
+    /** The type of what the wrapper gets, resolved with the other declarations of the module. */
+    resolveWrapper(info) {
+        const node = wrapperOf(info.node);
+        const type = node?.param.type;
+        info.wrapper = node && { node, param: type ? this.resolveType(type) : UNKNOWN, result: null };
+    }
+    /** The `return` of a decorator's body, once the body is checked. */
+    checkWrapper(info) {
+        const { body } = info.node;
+        const last = body.body.at(-1);
+        for (const statement of ownStatements(body)) {
+            if (statement.kind === 'ReturnStatement' && statement !== last) {
+                this.error(`a decorator returns its wrapper at the end of its body: ${EXAMPLE}`, statement);
+            }
+        }
+        if (last?.kind !== 'ReturnStatement')
+            return;
+        if (!info.wrapper) {
+            const [value] = last.values;
+            const isFunction = value?.kind === 'ArrowFunction' || value?.kind === 'FuncExpression';
+            this.error(isFunction && last.values.length === 1
+                ? 'the wrapper takes one parameter, what the component returns: (content Element) => ...'
+                : `a decorator returns its wrapper, a function literal: ${EXAMPLE}`, value ?? last);
+            return;
+        }
+        this.checkWrapperParam(info, info.wrapper);
+        this.checkWrapperBody(info.wrapper);
+    }
+    checkWrapperParam(info, wrapper) {
+        const { fn, param } = wrapper.node;
+        const name = param.name.name;
+        // Without a type, the parameter is reported as one of any function literal.
+        if (param.type && !this.takesMarkup(wrapper)) {
+            this.error(`the wrapper gets markup, so "${name}" is a Node, an Element or a type of element, not ${typeToString(wrapper.param)}`, param.type);
+        }
+        // The code of the wrapper goes into the component next to the decorator's.
+        const members = decoratorNames(info.node);
+        const statements = fn.body.kind === 'BlockStatement' ? fn.body.body : [];
+        for (const identifier of [param.name, ...declaredIdentifiers(statements)]) {
+            if (members.has(identifier.name)) {
+                this.error(`"${identifier.name}" of the wrapper hides "${identifier.name}" of @${info.node.name.name}: rename one of them`, identifier);
+            }
+        }
+    }
+    takesMarkup(wrapper) {
+        return isUntyped(wrapper.param) || isAssignable(wrapper.param, this.dom.node);
+    }
+    /** A wrapper is inlined where the component returns, so it returns once, at its end. */
+    checkWrapperBody(wrapper) {
+        const { fn } = wrapper.node;
+        const end = wrapperBody(fn).at(-1);
+        if (fn.body.kind === 'BlockStatement') {
+            for (const statement of ownStatements(fn.body)) {
+                if (statement.kind === 'DeferStatement') {
+                    this.error('defer is not supported in decorators yet', statement);
+                }
+                else if (statement !== end) {
+                    this.error('a wrapper returns once, at the end of its body; other returns are not supported yet', statement);
+                }
+            }
+        }
+        const [value] = end?.kind === 'ReturnStatement' ? end.values : [];
+        if (!value) {
+            this.error('the wrapper ends with "return <markup>", e.g. return content', end ?? fn);
+            return;
+        }
+        const type = this.typeOfChecked(value);
+        if (!isUntyped(type) && !isAssignable(type, this.dom.node)) {
+            this.error(`the wrapper returns markup, not ${typeToString(type)}`, value);
+        }
+    }
+    wrappedType(info, own, seen) {
+        return info.decorators.reduceRight((type, decorator) => (decorator.wrapper ? this.wrapperResult(decorator.wrapper, seen) : type), own);
+    }
+    /** What a wrapper gives, found without checking it again, like the markup of a component. */
+    wrapperResult(wrapper, seen) {
+        // That of an exported decorator was found in its module, where its tags are names.
+        if (wrapper.result)
+            return wrapper.result;
+        const end = wrapperBody(wrapper.node.fn).at(-1);
+        const [value] = end?.kind === 'ReturnStatement' ? end.values : [];
+        if (value?.kind === 'Identifier' && value.name === wrapper.node.param.name.name) {
+            return wrapper.param;
+        }
+        return this.markupType(value, seen);
+    }
+    /** What the component returns fits its wrappers, from the bottom decorator up. */
+    checkWrappedTypes(info) {
+        let type = this.ownResult(info, new Set());
+        let source = null;
+        for (const decorator of [...info.decorators].reverse()) {
+            const { wrapper } = decorator;
+            if (!wrapper)
+                continue;
+            const name = decorator.node.name.name;
+            const expected = typeToString(wrapper.param);
+            // A parameter that takes no markup is reported with the wrapper.
+            const fits = isUntyped(type) || isUntyped(wrapper.param) || isAssignable(type, wrapper.param);
+            if (!fits && this.takesMarkup(wrapper)) {
+                const use = info.node.decorators.find((each) => each.name.name === name);
+                const given = typeToString(type);
+                this.error(source === null
+                    ? `@${name} wraps ${expected}, but ${info.node.name.name} returns ${given}: apply @${name} to a component that returns ${expected}`
+                    : `@${name} wraps ${expected}, but ${source} gives ${given}: change the order of the decorators or the type of the wrapper`, use ?? info.node.name);
+            }
+            type = this.wrapperResult(wrapper, new Set());
+            source = `@${name}`;
+        }
+    }
+}
+/** The names that statements declare in their own block. */
+function declaredIdentifiers(statements) {
+    return statements.flatMap((statement) => {
+        switch (statement.kind) {
+            case 'VariableDeclaration':
+                return statement.names.filter((name) => name.name !== '_');
+            case 'FuncDeclaration':
+            case 'ClassDeclaration':
+                return [statement.name];
+            default:
+                return [];
+        }
+    });
+}

package/dist/checker/decorators.d.ts

@@ -0,0 +1,28 @@
+import type * as ast from '../ast.ts';
+import type { ComponentInfo, DecoratorInfo, Scope } from './context.ts';
+import { DecoratorExportChecker } from './decorator-exports.ts';
+export declare abstract class DecoratorChecker extends DecoratorExportChecker {
+    protected resolveDecoratorParams(info: DecoratorInfo): void;
+    /** `needs cart, auth`: other decorators, each once. */
+    protected checkNeedsDeclaration(info: DecoratorInfo): void;
+    /** Decorators after the ones they need. A cycle of needs is an error: none can be first. */
+    protected orderByNeeds(decorators: readonly DecoratorInfo[]): DecoratorInfo[];
+    /**
+     * The body is checked once, by itself: it does not see the components it is applied to. Its
+     * public members get their types here, before the bodies of components are checked.
+     */
+    protected checkDecoratorBody(info: DecoratorInfo): void;
+    protected collectMembers(info: DecoratorInfo, scope: Scope): void;
+    /**
+     * The decorators before `comp`: they exist, are applied once and below the ones they need, get
+     * valid arguments, and their wrappers get what they can take.
+     */
+    protected checkDecoratorUses(info: ComponentInfo): void;
+    /** Arguments are positional and see the properties of the component, as its body does. */
+    protected checkDecoratorArguments(use: ast.DecoratorUse, decorator: DecoratorInfo, info: ComponentInfo): void;
+    /**
+     * The code of the decorator and its arguments go into the component's body, so the names of the
+     * module they use must not be hidden there by the component's declarations.
+     */
+    protected checkInlinedNames(use: ast.DecoratorUse, decorator: DecoratorInfo, info: ComponentInfo): void;
+}

package/dist/checker/decorators.js

@@ -0,0 +1,265 @@
+import { freeNames } from "../names.js";
+import { forEachChild } from "../walk.js";
+import { DecoratorExportChecker } from "./decorator-exports.js";
+import { lookupIn, ownStatements } from "./helpers.js";
+import { func, UNKNOWN } from "./types.js";
+// Decorators: their parameters, needs and bodies, and the decorators applied to a component with
+// their arguments. Wrappers are in decorator-wrappers.ts, exported decorators in
+// decorator-exports.ts, the public members a component uses in decorator-members.ts.
+export class DecoratorChecker extends DecoratorExportChecker {
+    resolveDecoratorParams(info) {
+        const names = new Set();
+        let optional = null;
+        info.params = info.node.params.map((param) => {
+            const { name } = param.name;
+            if (names.has(name))
+                this.error(`duplicate parameter "${name}"`, param.name);
+            names.add(name);
+            if (param.defaultValue)
+                optional = param;
+            else if (optional) {
+                this.error(`"${name}" needs a default value: the arguments are positional, so parameters with default values go last`, param.name);
+            }
+            return param.type ? this.resolveType(param.type) : UNKNOWN;
+        });
+        this.resolveWrapper(info);
+        this.checkNeedsDeclaration(info);
+    }
+    /** `needs cart, auth`: other decorators, each once. */
+    checkNeedsDeclaration(info) {
+        const needed = new Set();
+        for (const need of info.node.needs) {
+            const { name } = need;
+            const other = this.decorators.get(name);
+            if (name === info.node.name.name)
+                this.error(`@${name} cannot need itself`, need);
+            else if (needed.has(name))
+                this.error(`@${name} is needed twice: name it once`, need);
+            else if (!other)
+                this.error(`unknown decorator @${name}`, need);
+            else
+                info.needed.push(other);
+            needed.add(name);
+        }
+    }
+    /** Decorators after the ones they need. A cycle of needs is an error: none can be first. */
+    orderByNeeds(decorators) {
+        const order = [];
+        const path = [];
+        const visit = (info) => {
+            if (order.includes(info))
+                return;
+            const at = path.indexOf(info);
+            if (at >= 0) {
+                const cycle = path.slice(at).map((each) => `@${each.node.name.name}`);
+                const steps = cycle.map((name, i) => `${name} needs ${cycle[(i + 1) % cycle.length]}`);
+                this.error(`decorators cannot need each other: ${steps.join(', ')}; remove one of the needs`, info.node.name);
+                return;
+            }
+            path.push(info);
+            for (const needed of info.needed)
+                visit(needed);
+            path.pop();
+            order.push(info);
+        };
+        decorators.forEach(visit);
+        return order;
+    }
+    /**
+     * The body is checked once, by itself: it does not see the components it is applied to. Its
+     * public members get their types here, before the bodies of components are checked.
+     */
+    checkDecoratorBody(info) {
+        const { node } = info;
+        node.params.forEach((param, i) => {
+            if (!param.defaultValue)
+                return;
+            const type = info.params[i] ?? UNKNOWN;
+            this.expectAssignable(this.checkValue(param.defaultValue, type), type, param.defaultValue);
+        });
+        for (const statement of ownStatements(node.body)) {
+            if (statement.kind === 'DeferStatement') {
+                this.error('defer is not supported in decorators yet', statement);
+            }
+        }
+        const saved = { component: this.component, decorator: this.decorator };
+        this.component = null;
+        this.decorator = info;
+        try {
+            this.withRefs(node.body, () => this.withClass(null, () => this.checkFunction(node.params, func(info.params, []), null, node.body, {
+                paramKind: 'prop',
+                inspect: (scope) => this.collectMembers(info, scope),
+            })));
+        }
+        finally {
+            this.component = saved.component;
+            this.decorator = saved.decorator;
+        }
+        this.checkWrapper(info);
+        this.checkStyles(node.name.name, node.body, `@${node.name.name}`);
+        if (node.exported)
+            this.checkExportedDecorator(info);
+    }
+    collectMembers(info, scope) {
+        const add = (name, kind) => {
+            const type = scope.values.get(name.name)?.type ?? UNKNOWN;
+            if (name.name !== '_')
+                info.members.set(name.name, { kind, type });
+        };
+        for (const statement of info.node.body.body) {
+            if (statement.kind === 'FuncDeclaration' && statement.isPublic) {
+                add(statement.name, 'func');
+            }
+            else if (statement.kind === 'VariableDeclaration' &&
+                statement.isPublic &&
+                statement.keyword !== 'let' &&
+                statement.keyword !== 'ref') {
+                for (const name of statement.names)
+                    add(name, statement.keyword);
+            }
+        }
+    }
+    /**
+     * The decorators before `comp`: they exist, are applied once and below the ones they need, get
+     * valid arguments, and their wrappers get what they can take.
+     */
+    checkDecoratorUses(info) {
+        const applied = new Set();
+        for (const use of info.node.decorators) {
+            const name = use.name.name;
+            const decorator = this.decorators.get(name);
+            if (!decorator) {
+                this.error(`unknown decorator @${name}`, use.name);
+                continue;
+            }
+            if (applied.has(decorator))
+                this.error(`@${name} is applied twice: apply it once`, use);
+            // The body of a decorator may read the state of those it needs right away.
+            for (const needed of decorator.needed) {
+                if (applied.has(needed))
+                    continue;
+                const other = needed.node.name.name;
+                this.error(`@${name} needs @${other} above it: @${other} @${name} comp ...`, use);
+            }
+            applied.add(decorator);
+            this.checkDecoratorArguments(use, decorator, info);
+            this.checkInlinedNames(use, decorator, info);
+        }
+        this.checkWrappedTypes(info);
+    }
+    /** Arguments are positional and see the properties of the component, as its body does. */
+    checkDecoratorArguments(use, decorator, info) {
+        const name = use.name.name;
+        const { params } = decorator.node;
+        const extra = use.arguments[params.length];
+        if (extra) {
+            const count = params.length === 1 ? '1 argument' : `${params.length} arguments`;
+            this.error(params.length === 0 ? `@${name} takes no arguments` : `@${name} takes ${count}`, extra);
+        }
+        this.withScope(() => {
+            for (const param of info.node.params) {
+                this.declareValue(param.name, 'prop', info.props.get(param.name.name)?.type ?? UNKNOWN);
+            }
+            params.forEach((param, i) => {
+                const type = decorator.params[i] ?? UNKNOWN;
+                const arg = use.arguments[i];
+                if (!arg) {
+                    if (!param.defaultValue) {
+                        this.error(`@${name} needs the argument "${param.name.name}"`, use);
+                    }
+                    return;
+                }
+                const context = ` for "${param.name.name}" of @${name}`;
+                this.expectAssignable(this.checkValue(arg, type), type, arg, context);
+            });
+        });
+    }
+    /**
+     * The code of the decorator and its arguments go into the component's body, so the names of the
+     * module they use must not be hidden there by the component's declarations.
+     */
+    checkInlinedNames(use, decorator, info) {
+        const name = use.name.name;
+        const component = info.node.name.name;
+        const declared = bodyNames(info.node.body);
+        const params = new Set(info.node.params.map((param) => param.name.name));
+        // Those of another module come through hidden exports, under names of their own.
+        const imported = this.importedDecorators.has(decorator);
+        const hidden = imported ? decorator.moduleNames : [];
+        decorator.freeNames ??= freeNames(decorator.node);
+        // The global names that the code of another module uses, its components' too, stay global.
+        const globals = imported
+            ? [...decorator.freeNames].filter((used) => !hidden.includes(used))
+            : [];
+        for (const used of [...globals, ...(decorator.inline?.globals ?? [])]) {
+            const binding = lookupIn(this.moduleScope, used);
+            if (!declared.has(used) && !params.has(used) && (!binding || binding.kind === 'builtin')) {
+                continue;
+            }
+            this.error(`@${name} uses the global "${used}", but here it is another declaration: rename it`, use);
+            return;
+        }
+        for (const used of decorator.freeNames) {
+            if (hidden.includes(used))
+                continue;
+            if (declared.has(used) || params.has(used)) {
+                this.error(`@${name} uses "${used}" of the module, but ${component} declares its own "${used}": rename one of them`, use);
+                return;
+            }
+        }
+        const statements = use.arguments.map((expression) => {
+            return { kind: 'ExpressionStatement', expression, start: use.start, end: use.end };
+        });
+        const body = {
+            kind: 'BlockStatement',
+            body: statements,
+            start: use.start,
+            end: use.end,
+        };
+        for (const used of freeNames({ params: info.node.params, body })) {
+            if (declared.has(used)) {
+                this.error(`the arguments of @${name} use "${used}" of the module, but ${component} declares its own "${used}": rename one of them`, use);
+                return;
+            }
+        }
+    }
+}
+/**
+ * Names declared in a component's body outside nested functions: those that the code of its
+ * decorators, which goes into the body, could see instead of the module's.
+ */
+function bodyNames(body) {
+    const names = new Set();
+    const visit = (node) => {
+        switch (node.kind) {
+            case 'VariableDeclaration':
+                for (const name of node.names)
+                    names.add(name.name);
+                break;
+            case 'FuncDeclaration':
+            case 'ClassDeclaration':
+                names.add(node.name.name);
+                return;
+            case 'FuncExpression':
+            case 'ArrowFunction':
+            case 'EventHandler':
+            case 'MountStatement':
+            case 'EffectStatement':
+                return;
+            case 'ForInStatement':
+                names.add(node.value.name);
+                if (node.key)
+                    names.add(node.key.name);
+                break;
+            case 'CatchClause':
+                if (node.param)
+                    names.add(node.param.name);
+                break;
+            default:
+                break;
+        }
+        forEachChild(node, visit);
+    };
+    forEachChild(body, visit);
+    return names;
+}

package/dist/checker/dom-svg.d.ts

@@ -0,0 +1,7 @@
+import { type ObjectType, type Type } from './types.ts';
+export declare const SVG_ELEMENT: ObjectType;
+export declare const SVG_SVG_ELEMENT: ObjectType;
+/** The type of the SVG element `<tag>` creates. */
+export declare function svgElementType(tag: string): ObjectType;
+/** SVG types that programs can name, e.g. `ref icon SVGSVGElement`. */
+export declare const SVG_TYPES: ReadonlyMap<string, Type>;

package/dist/checker/dom-svg.js

@@ -0,0 +1,19 @@
+import { ELEMENT_MEMBERS } from "./dom.js";
+import { ANY, property } from "./types.js";
+// SVG elements among the built-in DOM types, for the compiler without TypeScript's lib.dom: the
+// members of any element, and `className`, which in SVG is an object, not a string.
+function object(name, members) {
+    return { kind: 'object', name, members: new Map(Object.entries(members)), call: null };
+}
+const SVG_MEMBERS = { ...ELEMENT_MEMBERS, className: property(ANY) };
+export const SVG_ELEMENT = object('SVGElement', SVG_MEMBERS);
+export const SVG_SVG_ELEMENT = object('SVGSVGElement', SVG_MEMBERS);
+/** The type of the SVG element `<tag>` creates. */
+export function svgElementType(tag) {
+    return tag === 'svg' ? SVG_SVG_ELEMENT : SVG_ELEMENT;
+}
+/** SVG types that programs can name, e.g. `ref icon SVGSVGElement`. */
+export const SVG_TYPES = new Map([
+    ['SVGElement', SVG_ELEMENT],
+    ['SVGSVGElement', SVG_SVG_ELEMENT],
+]);

package/dist/checker/dom.d.ts

@@ -0,0 +1,22 @@
+import { type Member, type ObjectType, type Type } from './types.ts';
+export declare const ELEMENT_MEMBERS: Record<string, Member>;
+export declare const NODE: ObjectType;
+export declare const HTML_ELEMENT: ObjectType;
+export declare const DOCUMENT_FRAGMENT: ObjectType;
+/** The type of the element `<tag>` creates. */
+export declare function elementType(tag: string): ObjectType;
+/**
+ * The type of a component's `children`: the markup between its tags. At runtime it is a
+ * DocumentFragment, but only placing it as `{children}` is allowed.
+ */
+export declare const CONTENT: ObjectType;
+/** DOM types that programs can name, e.g. `func render() HTMLLIElement`. */
+export declare const DOM_TYPES: ReadonlyMap<string, Type>;
+/** The DOM property that an attribute sets, e.g. `class` → `className`; `null` for setAttribute. */
+export declare function domProperty(tag: string, attribute: string): {
+    name: string;
+    type: Type;
+} | null;
+export declare const EVENT: ObjectType;
+/** The `event` of a handler on an element: `currentTarget` is that element. */
+export declare function eventType(element: Type): ObjectType;