@brandup/ui 1.0.43 → 2.0.1

package/dist/types.d.ts

@@ -1,50 +1,276 @@
-declare class EventEmitter {
+/**
+ * Minimal event emitter with support for one-off listeners and cross-emitter listening.
+ *
+ * The optional `TEvents` type parameter is an event map (`{ eventName: (args) => void }`)
+ * that gives subclasses strongly-typed event names, callback signatures and `trigger` arguments.
+ * When omitted it defaults to a loose map, so untyped usage keeps working.
+ */
+declare class EventEmitter<TEvents = EventMap> {
     private _events?;
     private _listenId?;
     private _listeningTo?;
-    on(eventName: EventName, callback: EventCallbackFunc, context?: EventContextInit): this;
-    once(eventName: EventName, callback: EventCallbackFunc, context?: EventContextInit): this;
-    off(eventName?: EventName | null, callback?: EventCallbackFunc | null, context?: EventContextInit | null): this;
-    protected listenTo(source: EventEmitter, eventName: EventName, callback: EventCallbackFunc): this;
-    protected listenToOnce(source: EventEmitter, eventName: EventName, callback: EventCallbackFunc): this;
-    protected stopListening(source?: EventEmitter, eventName?: EventName, callback?: EventCallbackFunc): this;
+    /**
+     * Subscribe to an event.
+     * @param eventName Event name, or `"all"` to receive every event.
+     * @param callback Handler invoked when the event is triggered.
+     * @param context Optional `this`/context bound to the handler and used for removal matching.
+     */
+    on<K extends keyof TEvents & string>(eventName: K, callback: TEvents[K], context?: EventContextInit): this;
+    on(eventName: "all", callback: EventCallbackFunc, context?: EventContextInit): this;
+    /**
+     * Subscribe to an event for a single invocation; the handler is removed after it fires once.
+     * @param eventName Event name, or `"all"` to receive every event.
+     * @param callback Handler invoked once when the event is triggered.
+     * @param context Optional `this`/context bound to the handler and used for removal matching.
+     */
+    once<K extends keyof TEvents & string>(eventName: K, callback: TEvents[K], context?: EventContextInit): this;
+    once(eventName: "all", callback: EventCallbackFunc, context?: EventContextInit): this;
+    /**
+     * Remove event subscriptions. At least one argument is required.
+     * Listeners matching all provided filters are removed; omitted filters match anything.
+     * @param eventName Event name to remove, or omit to match all events.
+     * @param callback Handler to remove, or omit to match all handlers.
+     * @param context Context to remove, or omit to match all contexts.
+     */
+    off<K extends keyof TEvents & string>(eventName?: K | "all" | null, callback?: TEvents[K] | EventCallbackFunc | null, context?: EventContextInit | null): this;
+    /**
+     * Listen to an event on another emitter, tracking the subscription so it can be released via `stopListening`.
+     * @param source Emitter to subscribe to.
+     * @param eventName Event name to listen for.
+     * @param callback Handler invoked when the event is triggered.
+     */
+    protected listenTo(source: EventEmitter<any>, eventName: string, callback: EventCallbackFunc): this;
+    /**
+     * Listen once to an event on another emitter; the subscription is tracked and auto-removed after it fires.
+     * @param source Emitter to subscribe to.
+     * @param eventName Event name to listen for.
+     * @param callback Handler invoked once when the event is triggered.
+     */
+    protected listenToOnce(source: EventEmitter<any>, eventName: string, callback: EventCallbackFunc): this;
+    /**
+     * Release subscriptions previously established with `listenTo`/`listenToOnce`.
+     * Omitted arguments broaden the match (e.g. no `source` releases all tracked emitters).
+     * @param source Limit to a specific emitter, or omit for all.
+     * @param eventName Limit to a specific event, or omit for all.
+     * @param callback Limit to a specific handler, or omit for all.
+     */
+    protected stopListening(source?: EventEmitter<any>, eventName?: string, callback?: EventCallbackFunc): this;
     private _addListeningTo;
+    /** Remove a single tracked subscription (matched by event + registered callback). @internal */
+    private _removeListeningSubscription;
     private stopAllListeners;
-    protected trigger(eventName: string, ...args: any[]): this;
+    /**
+     * Trigger an event, invoking all matching handlers plus any `"all"` listeners.
+     * @param eventName Event name to trigger (`"all"` is reserved and not allowed).
+     * @param args Arguments forwarded to each handler.
+     */
+    protected trigger<K extends keyof TEvents & string>(eventName: K, ...args: TEvents[K] extends (...a: infer A) => any ? A : never): this;
     private _triggerEvent;
     private _getOrCreateEvents;
     private _getEvents;
+    /** Release every subscription: both events this emitter listens to and listeners registered on it. */
     protected stopEvents(): void;
 }
+/** Map of event name to its handler signature; used as the `TEvents` parameter of {@link EventEmitter}. */
+type EventMap = Record<string, (...args: any[]) => void>;
+/** Event name; the special value `"all"` matches every triggered event. */
 type EventName = "all" | string;
+/** Event handler signature; receives the arguments passed to `trigger`. */
 type EventCallbackFunc = (...args: any[]) => void;
+/** Arbitrary context bound as `this` to a handler and used to match it on removal. */
 type EventContextInit = any;
 
-declare abstract class UIElement extends EventEmitter {
+/** Key used to track iteration/length dependencies (object key enumeration, array growth). */
+declare const ITERATE_KEY: unique symbol;
+/**
+ * A reactive effect: a function whose reactive reads are tracked, so it re-runs
+ * whenever any of those reactive dependencies change.
+ */
+declare class ReactiveEffect<T = any> {
+    private readonly __fn;
+    /** Dependency sets this effect is currently subscribed to. @internal */
+    readonly deps: Set<ReactiveEffect>[];
+    private __active;
+    /** Called instead of `run` when a dependency changes (used by `computed`). */
+    scheduler?: () => void;
+    /** Invoked once when the effect is stopped. */
+    onStop?: () => void;
+    constructor(__fn: () => T, scheduler?: () => void);
+    /** Whether the effect is still active (not stopped). */
+    get active(): boolean;
+    /** Run the effect, (re)collecting its dependencies. */
+    run(): T;
+    /** Stop the effect: remove its subscriptions and run `onStop`. */
+    stop(): void;
+}
+/** Record the active effect (if any) as depending on `target[key]`. @internal */
+declare function track(target: object, key: PropertyKey): void;
+/** Re-run (or schedule) every effect that depends on `target[key]`. @internal */
+declare function trigger(target: object, key: PropertyKey): void;
+/**
+ * Resolves after the currently pending batch of reactive effects has flushed.
+ * Effect re-runs (and the DOM updates they drive) are batched on the microtask queue,
+ * so await `nextTick()` to observe their results.
+ */
+declare function nextTick(fn?: () => void): Promise<void>;
+/**
+ * Execute `fn` without tracking any reactive reads.
+ * Use inside a reactive context when you want to read state without creating a dependency.
+ */
+declare function untrack<T>(fn: () => T): T;
+/** Create and immediately run a reactive effect. Returns the {@link ReactiveEffect}. */
+declare function effect<T>(fn: () => T, scheduler?: () => void): ReactiveEffect<T>;
+/** A disposable container that collects effects (and nested scopes) so they can be stopped together. */
+declare class EffectScope {
+    private readonly __effects;
+    private readonly __scopes;
+    private __active;
+    /** Whether the scope is still active (not stopped). */
+    get active(): boolean;
+    /** @internal */
+    add(effect: ReactiveEffect): void;
+    /** @internal */
+    addScope(scope: EffectScope): void;
+    /** Run `fn` with this scope active; effects created during the call register to it. */
+    run<T>(fn: () => T): T;
+    /** Stop all effects and nested scopes collected by this scope. */
+    stop(): void;
+}
+/** Create a new {@link EffectScope}, nested in the current scope if one is active. */
+declare function effectScope(): EffectScope;
+
+/** Whether a value is a reactive proxy created by {@link reactive}. */
+declare function isReactive(value: unknown): boolean;
+/** Return the underlying raw (non-reactive) object behind a reactive proxy, or the value itself. */
+declare function toRaw<T>(value: T): T;
+/**
+ * Wrap an object or array in a deep reactive proxy. Reads are tracked and writes
+ * notify effects. Returns the same proxy for the same target, and non-objects unchanged.
+ */
+declare function reactive<T extends object>(target: T): T;
+
+/** A lazily-evaluated, cached reactive value derived from other reactive state. */
+declare class ComputedRef<T = any> {
+    private __value;
+    private __dirty;
+    private readonly __effect;
+    constructor(getter: () => T);
+    /** The current value; recomputed on read only when its dependencies have changed. */
+    get value(): T;
+}
+/** Create a {@link ComputedRef} from a getter. */
+declare function computed<T>(getter: () => T): ComputedRef<T>;
+
+/** Built-in events triggered by every {@link UIElement}. */
+interface UIElementEvents {
+    /** Triggered right before a command handler runs. */
+    command: (args: CommandEventArgs) => void;
+    /** Triggered after the element is bound by `setElement` and `_onRenderElement` has run. */
+    rendered: (sender: UIElement<any>) => void;
+    /** Triggered when the element is destroyed. */
+    destroy: (sender: UIElement<any>) => void;
+}
+/** Merge the built-in {@link UIElementEvents} with a subclass event map (built-in keys take precedence). */
+type WithUIEvents<TEvents> = {
+    [K in keyof UIElementEvents | keyof TEvents]: K extends keyof UIElementEvents ? UIElementEvents[K] : K extends keyof TEvents ? TEvents[K] : never;
+};
+/**
+ * Wraps an `HTMLElement` and binds business logic, commands and events to it.
+ *
+ * The optional `TEvents` event map is merged with {@link UIElementEvents}, so subclasses
+ * can declare their own typed events in addition to the built-in `command`/`destroy`.
+ */
+declare abstract class UIElement<TEvents = {}> extends EventEmitter<WithUIEvents<TEvents>> {
     private __element?;
     private __events?;
     private __commands?;
     private __destroyed?;
+    /** Unique type name of this UI element; also written to the element's data attribute. */
     abstract typeName: string;
+    /** The bound DOM element, or `undefined` until `setElement` is called. */
     get element(): HTMLElement | undefined;
+    /**
+     * Bind a DOM element to this instance and run render logic. Can be called only once.
+     * @param elem Element to bind; throws if already bound or owned by another `UIElement`.
+     */
     protected setElement(elem: HTMLElement): void;
+    /**
+     * Whether the given element is already bound to a `UIElement`.
+     * @param elem Element to test.
+     */
     static hasElement(elem: HTMLElement): boolean;
+    /**
+     * Register a handler for a command declared in markup via the `data-command` attribute.
+     * @param name Command name (case-insensitive); throws if already registered.
+     * @param execute Handler run when the command fires; may return a `Promise` for async commands.
+     * @param canExecute Optional predicate gating whether the command may run.
+     * @returns This instance for chaining.
+     */
     registerCommand(name: string, execute: CommandExecuteFunction, canExecute?: CommandCanExecuteFunction): this;
-    hasCommand(name: string): boolean | undefined;
-    /** @internal */
+    /**
+     * Whether a command with the given name is registered.
+     * @param name Command name (case-insensitive).
+     */
+    hasCommand(name: string): boolean;
+    /**
+     * Execute a registered command against a target element.
+     * @internal
+     */
     __execCommand(name: string, target: HTMLElement): CommandResult;
+    /**
+     * Hook invoked when an element is bound via `setElement`. Override to render or wire up the element.
+     * @param _elem The newly bound element.
+     */
+    /** Trigger a built-in event. Typed by {@link UIElementEvents}; bypasses the generic trigger overload internally. */
+    private __raise;
     protected _onRenderElement(_elem: HTMLElement): void;
+    /**
+     * Hook deciding whether a command may execute. Override to add element-wide gating.
+     * @param _name Command name being executed.
+     * @param _elem Target element of the command.
+     * @returns `true` to allow execution (default), `false` to disallow.
+     */
     protected _onCanExecCommand(_name: string, _elem: HTMLElement): boolean;
-    onDestroy(callback: VoidFunction | UIElement | Element): void;
+    /**
+     * Create an {@link EffectScope} whose reactive effects are stopped automatically when
+     * this element is destroyed. Use it to scope `bind`/`effect` to the element's lifetime.
+     */
+    effectScope(): EffectScope;
+    /** Returns the `typeName` of this element. */
     toString(): string;
+    /** Destroy the element: trigger the `destroy` event, release events/commands and detach from the DOM element. */
     destroy(): void;
 }
+/**
+ * A {@link UIElement} whose DOM element is bound in the constructor, so its `element`
+ * is always defined (typed `HTMLElement`, never `undefined`). Subclasses pass their
+ * `typeName` and the element to `super`.
+ *
+ * Use {@link UIElement} directly when the element is bound later (e.g. an application
+ * that binds its element on run).
+ */
+declare abstract class UIElementBound<TEvents = {}> extends UIElement<TEvents> {
+    private __typeName;
+    /** @param typeName Unique type name of this element. @param elem Element to bind. */
+    constructor(typeName: string, elem: HTMLElement);
+    get typeName(): string;
+    /** The bound DOM element; always defined since it is set in the constructor. */
+    get element(): HTMLElement;
+}
+/** Remove the global click handler registered by brandup-ui. Call on app teardown or HMR disposal. */
+declare function destroyUI(): void;
+/** Command handler; returning a `Promise` marks the command as async (adds the `executing` CSS class while pending). */
 type CommandExecuteFunction = (context: CommandContext) => void | Promise<void | any>;
+/** Predicate deciding whether a command may run for the given context. */
 type CommandCanExecuteFunction = (context: CommandContext) => boolean;
+/** Arguments of the `command` event triggered before a command executes. */
 interface CommandEventArgs {
+    /** UIElement that owns the command. */
     element: UIElement;
+    /** Name of the command being executed. */
     name: string;
 }
+/** Context passed to command execute/canExecute handlers. */
 interface CommandContext {
     /** HTMLElement on which the command is executed */
     target: HTMLElement;
@@ -53,27 +279,260 @@ interface CommandContext {
     /** Don't stop the click event chain of target. */
     transparent?: boolean;
 }
+/** Outcome of an attempted command execution. */
 interface CommandResult {
+    /** Execution status. */
     status: CommandExecStatus;
+    /** Context the command ran with. */
     context: CommandContext;
 }
+/** Command execution status: `disallow` (gated out), `already` (re-entrant call ignored) or `success`. */
 type CommandExecStatus = "disallow" | "already" | "success";
 
 declare global {
     interface HTMLElement {
+        /**
+         * Bind a `UIElement` to this element via the given factory and return the element for chaining.
+         * @param factory Callback that creates the `UIElement` for this element.
+         */
         ui(factory: (elem: HTMLElement) => UIElement): HTMLElement;
     }
     interface Node {
+        /** `UIElement` bound to this node, or `undefined` when none is bound. */
         readonly uielement: UIElement | undefined;
     }
 }
 
+/** Value a reactive binding can render: text (`string`/`number`), an `Element` or {@link UIElement}, or `null`/`undefined`/`false` (rendered as nothing). */
+type BindingValue = string | number | boolean | Element | UIElement<any> | null | undefined;
+/**
+ * A reactive binding for use as a {@link tag} child. Its `compute` function is
+ * re-evaluated and re-rendered whenever the reactive state it reads changes.
+ */
+declare class Binding {
+    readonly compute: () => BindingValue;
+    constructor(compute: () => BindingValue);
+}
+/**
+ * Create a reactive {@link Binding} that can be passed as a `tag` child. The
+ * compute function is tracked: it re-runs (updating the DOM in place) whenever
+ * any reactive value it reads changes.
+ *
+ * @example
+ * const state = reactive({ name: "Alice" });
+ * DOM.tag("div", null, "Hi, ", bind(() => state.name));
+ * state.name = "Bob"; // the text updates in place
+ */
+declare function bind(compute: () => BindingValue): Binding;
+
+/** A keyed-list binding produced by {@link bindEach}; handled by `appendChild` in `tag.ts`. */
+declare class BindingEach<T = any> {
+    readonly getItems: () => T[];
+    readonly getKey: (item: T, index: number) => string | number;
+    readonly render: (item: T) => Element;
+    constructor(getItems: () => T[], getKey: (item: T, index: number) => string | number, render: (item: T) => Element);
+}
+/**
+ * Create a reactive keyed-list binding for use as a {@link tag} child.
+ *
+ * The `getItems` function is tracked; the list is reconciled whenever the array
+ * changes (push, splice, reassignment, etc.). Items are matched by `getKey` so
+ * unchanged nodes stay in place — only new, removed, or reordered nodes are touched.
+ *
+ * `render` is called **once per key** and runs **untracked**. Use `bind()` inside
+ * the render function for item properties that should update independently:
+ *
+ * ⚠️ The item object passed to `render` is captured at first render for that key.
+ * Mutate items in place (`item.name = "..."`) so `bind()` reactions fire. Replacing
+ * the array with **new objects that reuse the same keys** keeps the cached node bound
+ * to the *old* object, so per-item `bind()`s won't update — change the key, or mutate
+ * the existing item, when its identity should change.
+ *
+ * @example
+ * DOM.tag("ul", null,
+ *     bindEach(() => state.users, u => u.id, u =>
+ *         DOM.tag("li", null, bind(() => u.name))
+ *     )
+ * );
+ */
+declare function bindEach<T>(getItems: () => T[], getKey: (item: T, index: number) => string | number, render: (item: T) => Element): BindingEach<T>;
+/**
+ * Mount a {@link BindingEach} into `container` and start tracking.
+ * Called by `appendChild` in `tag.ts`; not intended for direct use.
+ * @internal
+ */
+declare function appendBindingEach<T>(container: HTMLElement, binding: BindingEach<T>): void;
+
+/**
+ * Values that are unambiguously a {@link tag} child and never options.
+ * Passing one of these as the second argument to `tag` skips the options parameter.
+ * `null` and `undefined` are excluded — they serve as "no options" in position 2.
+ */
+type TagFirstChild = Element | UIElement<any> | Binding | BindingEach<any> | Promise<TagChildrenPrimitive> | ((elem: HTMLElement) => TagChildrenPrimitive | TagChildrenPrimitive[] | void) | string | number | boolean | Array<TagChildrenLike>;
+/** Options used to configure an element created by {@link tag}. Recognized keys (`id`, `class`, `command`, `dataset`, `events`, `styles`) are handled specially; any other key is applied as a plain attribute. */
+interface ElementOptions {
+    /** Value for the element's `id` attribute. */
+    id?: string;
+    /** CSS class(es) to add to the element. */
+    class?: CssClass;
+    /** Sets the `data-command` attribute (shortcut for `dataset.command`). */
+    command?: string;
+    /** Custom `data-*` attributes to set on the element. */
+    dataset?: ElementData;
+    /** Event listeners to attach, keyed by lower-case event name. */
+    events?: ElementEvents;
+    /** Inline styles to apply to `element.style`. */
+    styles?: ElementStyles;
+    /** Any other key is set as a plain attribute. `null` sets an empty attribute, objects are JSON-stringified, other values are coerced to string. `undefined` is ignored. */
+    [name: string]: string | number | boolean | object | null | undefined;
+}
+/** One or more CSS class names: a space-separated string or an array of class names. */
+type CssClass = string | string[];
+/** Map of custom `data-*` attribute names to their string values. */
+interface ElementData {
+    [name: string]: string | undefined;
+}
+/** Map of DOM event handlers keyed by lower-case event name (e.g. `click`, `mouseover`), strongly typed to the matching `HTMLElementEventMap` event. */
+type ElementEvents = {
+    [Name in keyof HTMLElementEventMap as `${Lowercase<string & Name>}`]?: (e: HTMLElementEventMap[Name]) => void;
+};
+/** Inline style declaration: a partial set of writable `CSSStyleDeclaration` properties. */
+type ElementStyles = Partial<CSSStyleDeclaration>;
+/** A value accepted as a {@link tag} child: a primitive, a reactive {@link Binding}, a keyed-list {@link BindingEach}, a promise of one, a factory function receiving the container element, or a (possibly nested) array of any of these. */
+type TagChildrenLike = TagChildrenPrimitive | Binding | BindingEach | Promise<TagChildrenPrimitive> | ((elem: HTMLElement) => Promise<TagChildrenPrimitive> | Promise<TagChildrenPrimitive[]> | TagChildrenPrimitive | TagChildrenPrimitive[] | void) | Array<TagChildrenLike>;
+/** A single concrete child value: an existing `Element`, a {@link UIElement} (its bound element is appended), a string/number rendered as HTML, or `null`/`undefined` (ignored). */
+type TagChildrenPrimitive = Element | UIElement<any> | string | number | null | undefined;
+
+/**
+ * Finds an element by its `id` within the whole document.
+ * @param id The element id to look up.
+ * @returns The matching element, or `null` if none exists.
+ */
+declare function getById<TElement extends HTMLElement = HTMLElement>(id: string): TElement | null;
+/**
+ * Returns the first descendant of `container` that has the given class.
+ * @param container Element to search within.
+ * @param className Single class name to match.
+ * @returns The first matching element, or `null` if none found.
+ */
+declare function getByClass<TElement extends HTMLElement = HTMLElement>(container: Element, className: string): TElement | null;
+/**
+ * Returns the first element in the document with the given `name` attribute.
+ * @param name The `name` attribute value to look up.
+ * @returns The first matching element, or `null` if none found.
+ */
+declare function getByName<TElement extends HTMLElement = HTMLElement>(name: string): TElement | null;
+/**
+ * Returns the first descendant of `container` with the given tag name.
+ * @param container Element to search within.
+ * @param tagName Tag name to match (e.g. `"input"`).
+ * @returns The first matching element, or `null` if none found.
+ */
+declare function getElementByTagName<TElement extends HTMLElement = HTMLElement>(container: Element, tagName: string): TElement | null;
+/**
+ * Returns all descendants of `container` with the given tag name as a live collection.
+ * @param container Element to search within.
+ * @param tagName Tag name to match (e.g. `"li"`).
+ * @returns A live `HTMLCollection` of matching elements.
+ */
+declare function getElementsByTagName(container: Element, tagName: string): HTMLCollectionOf<Element>;
+/**
+ * Returns the first descendant of `container` matching the CSS selector.
+ * @param container Element to search within.
+ * @param query CSS selector.
+ * @returns The first matching element, or `null` if none found.
+ */
+declare function queryElement<TElement extends HTMLElement = HTMLElement>(container: Element, query: string): TElement | null;
+/**
+ * Returns all descendants of `container` matching the CSS selector.
+ * @param container Element to search within.
+ * @param query CSS selector.
+ * @returns A static `NodeList` of matching elements.
+ */
+declare function queryElements<TElement extends HTMLElement = HTMLElement>(container: Element, query: string): NodeListOf<TElement>;
+/**
+ * Walks forward through the following siblings of `current` and returns the first one that has the given class.
+ * @param current Element to start from.
+ * @param className Class name to match.
+ * @returns The first matching following sibling, or `null` if none found.
+ */
+declare function nextElementByClass<TElement extends HTMLElement = HTMLElement>(current: Element, className: string): TElement | null;
+/**
+ * Walks backward through the preceding siblings of `current` and returns the first one that has the given class.
+ * @param current Element to start from.
+ * @param className Class name to match.
+ * @returns The first matching preceding sibling, or `null` if none found.
+ */
+declare function prevElementByClass<TElement extends HTMLElement = HTMLElement>(current: Element, className: string): TElement | null;
+/**
+ * Returns the nearest preceding sibling element of `current`, skipping non-element nodes (e.g. text nodes).
+ * @param current Element to start from.
+ * @returns The previous sibling element, or `null` if none found.
+ */
+declare function prevElement<TElement extends HTMLElement = HTMLElement>(current: Element): TElement | null;
+/**
+ * Returns the nearest following sibling element of `current`, skipping non-element nodes (e.g. text nodes).
+ * @param current Element to start from.
+ * @returns The next sibling element, or `null` if none found.
+ */
+declare function nextElement<TElement extends HTMLElement = HTMLElement>(current: Element): TElement | null;
+/**
+ * Adds the given CSS class(es) to every descendant of `container` matching the selector. No-op when `container` or `cssClass` is falsy.
+ * @param container Element to search within (ignored when null/undefined).
+ * @param selectors CSS selector for the elements to modify.
+ * @param cssClass Class name(s) to add.
+ */
+declare function addClass(container: Element | null | undefined, selectors: string, cssClass: CssClass): void;
+/**
+ * Removes the given CSS class(es) from every descendant of `container` matching the selector. No-op when `container` or `cssClass` is falsy.
+ * @param container Element to search within (ignored when null/undefined).
+ * @param selectors CSS selector for the elements to modify.
+ * @param cssClass Class name(s) to remove.
+ */
+declare function removeClass(container: Element | null | undefined, selectors: string, cssClass: CssClass): void;
+/**
+ * Removes all child nodes from `container`, leaving it empty. No-op when `container` is null/undefined.
+ * @param container Element to clear.
+ */
+declare function empty(container: Element | null | undefined): void;
+
+declare function tag<T extends keyof HTMLElementTagNameMap>(tagName: T, firstChild: TagFirstChild, ...children: TagChildrenLike[]): HTMLElementTagNameMap[T];
+declare function tag<T extends keyof HTMLElementTagNameMap>(tagName: T, options: ElementOptions | null, ...children: TagChildrenLike[]): HTMLElementTagNameMap[T];
+declare function tag<T extends keyof HTMLElementTagNameMap>(tagName: T): HTMLElementTagNameMap[T];
+
+/** Collection of DOM helper functions: element queries/traversal ({@link getById}, {@link queryElement}, {@link nextElement}, ...), class manipulation ({@link addClass}, {@link removeClass}), {@link empty}, and element creation via {@link tag}. */
+declare const DOM: {
+    tag: typeof tag;
+    applyOptions: (elem: HTMLElement, options?: ElementOptions | CssClass | null) => void;
+    appendChild: (container: HTMLElement, children?: TagChildrenLike) => void;
+    getById: typeof getById;
+    getByClass: typeof getByClass;
+    getByName: typeof getByName;
+    getElementByTagName: typeof getElementByTagName;
+    getElementsByTagName: typeof getElementsByTagName;
+    queryElement: typeof queryElement;
+    queryElements: typeof queryElements;
+    nextElementByClass: typeof nextElementByClass;
+    prevElementByClass: typeof prevElementByClass;
+    prevElement: typeof prevElement;
+    nextElement: typeof nextElement;
+    addClass: typeof addClass;
+    removeClass: typeof removeClass;
+    empty: typeof empty;
+};
+
+/** Names of the DOM attributes, properties and CSS classes used by the library. */
 interface UiConstants {
+    /** `data-*` attribute name storing the `UIElement.typeName` on its element. */
     readonly ElemAttributeName: string;
+    /** Property name on the DOM element referencing its bound `UIElement` instance. */
     readonly ElemPropertyName: string;
+    /** `data-*` attribute name declaring a command name in markup. */
     readonly CommandAttributeName: string;
+    /** CSS class added to the target element while an async command is executing. */
     readonly CommandExecutingCssClassName: string;
 }
+/** Default constant values used across the library. */
 declare const constants: UiConstants;
 
 type constants$1_UiConstants = UiConstants;
@@ -82,5 +541,5 @@ declare namespace constants$1 {
   export type { constants$1_UiConstants as UiConstants };
 }
 
-export { EventEmitter, constants$1 as UICONSTANTS, UIElement };
-export type { CommandCanExecuteFunction, CommandContext, CommandEventArgs, CommandExecStatus, CommandExecuteFunction, CommandResult, EventCallbackFunc, EventContextInit, EventName };
+export { Binding, BindingEach, ComputedRef, DOM, EffectScope, EventEmitter, ITERATE_KEY, ReactiveEffect, constants$1 as UICONSTANTS, UIElement, UIElementBound, appendBindingEach, bind, bindEach, computed, destroyUI, effect, effectScope, isReactive, nextTick, reactive, toRaw, track, trigger, untrack };
+export type { BindingValue, CommandCanExecuteFunction, CommandContext, CommandEventArgs, CommandExecStatus, CommandExecuteFunction, CommandResult, CssClass, ElementData, ElementEvents, ElementOptions, ElementStyles, EventCallbackFunc, EventContextInit, EventMap, EventName, TagChildrenLike, TagChildrenPrimitive, TagFirstChild, UIElementEvents };

package/package.json

@@ -22,7 +22,7 @@
     "email": "it@brandup.online"
   },
   "license": "Apache-2.0",
-  "version": "1.0.43",
+  "version": "2.0.1",
   "main": "dist/cjs/index.js",
   "module": "dist/mjs/index.js",
   "types": "dist/types.d.ts",