neux - v0.19.0
    Preparing search index...

    Function render

    • Creates DOM nodes from an array of configurations.

      Type Parameters

      • T extends Node[] = Node[]

      Parameters

      • this: void | object

        Reactive context for signal tracking; defaults to the global context when omitted.

      • config: NodeConfigList

        An array of node configurations; nested arrays are flattened in order.

      • Optionaltarget: string | Element | DocumentFragment

        A parent element, DocumentFragment, or CSS selector string to append the results into. Without a target, or when the selector matches nothing, nothing is appended and the roots do not receive mounted; their children do.

      Returns T

      The created DOM nodes, in order.

    • Renders nothing for a boolean, null, or undefined configuration.

      Parameters

      • this: void | object

        Reactive context for signal tracking; defaults to the global context when omitted.

      • config: boolean | null | undefined

        A boolean, null, or undefined value.

      • Optionaltarget: string | Element | DocumentFragment

        Ignored.

      Returns null

      Always null.

    • Creates a DOM node from a configuration value.

      Handles the following config types:

      • Node — returned as is.
      • string or number — becomes a text node.
      • Array — becomes an array of rendered nodes (see the array overload).
      • boolean, null, undefined — render nothing and return null.
      • object — a plain object (or one with a null prototype) is parsed as an ElementConfig with reactive bindings via effects.
      • anything else, such as a class instance, Date, function, or symbol — render nothing and return null; a children list skips it.

      Lifecycle events are dispatched by the render layer (see ElementLifecycle):

      • mounted — fires top-down (this element before its children), the same order as removed, when the element is appended to a parent, on both the initial mount and a re-mount.
      • removed — fires top-down when a children update removes the element from a parent. Always paired with mounted; nodes never inserted (e.g., replaced by an equal node during re-render) are destroyed silently.
      • updated — fires when a specific property is updated to a different value; not for its first applied value, nor for a change from a cleared (null or undefined) binding. For className, the old and new values are arrays of the applied class names; for children, arrays of the child nodes in the DOM.

      Type Parameters

      • T extends Node = Node

      Parameters

      • this: void | object

        Reactive context for signal tracking; defaults to the global context when omitted.

      • config: NodeConfig

        A node configuration — string, number, Node, or object.

      • Optionaltarget: string | Element | DocumentFragment

        A parent element, DocumentFragment, or CSS selector string to append the result into. Without a target, or when the selector matches nothing, nothing is appended and the root does not receive mounted; its children do.

      Returns T

      The created DOM Node, appended to the target when one is given. At runtime a boolean, null, undefined, or unsupported config yields null; the type is null only when that is known statically (see the previous overload).

      const state = signal({ count: 0 });
      const el = render({
      tagName: "button",
      className: () => state.count > 0 ? "active" : "",
      textContent: () => `Counter: ${state.count}`,
      on: { click: () => state.count++ },
      }, document.body);
      // el is `<button>Counter: 0</button>`