npm - @adaas/are-html - Versions diffs - 0.0.22 → 0.0.23 - Mend

@adaas/are-html 0.0.22 → 0.0.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (129) hide show

package/examples/signal-routing/dist/index.html CHANGED Viewed

@@ -13,6 +13,6 @@
 <body>
   <are-root id="app"><app-shell></app-shell></are-root>
-  <script type="module" src="./mqh9ryc9-dkcbkx.js"></script>
+  <script type="module" src="./mqiwo23h-bhcolu.js"></script>
 </body>
 </html>

package/examples/signal-routing/dist/{mqh9ryc9-dkcbkx.js → mqiwo23h-bhcolu.js} RENAMED Viewed

@@ -2845,8 +2845,8 @@ var __decorateClass2 = /* @__PURE__ */ __name((decorators, target, key, kind) =>
 }, "__decorateClass");
 var __decorateParam2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam");
-// node_modules/@adaas/a-frame/dist/browser/chunk-UWXOV5XO.mjs
-var t = "0.1.15";
+// node_modules/@adaas/a-frame/dist/browser/chunk-VBGV4GJ5.mjs
+var t = "0.1.16";
 // node_modules/@adaas/a-frame/dist/browser/chunk-IKIN4MJV.mjs
 var h2 = Object.defineProperty;
@@ -2858,7 +2858,7 @@ var k2 = /* @__PURE__ */ __name((c3, a4, e, d4) => {
 }, "k");
 var l = /* @__PURE__ */ __name((c3, a4) => (e, d4) => a4(e, d4, c3), "l");
-// node_modules/@adaas/a-frame/dist/browser/chunk-PTHJM2MP.mjs
+// node_modules/@adaas/a-frame/dist/browser/chunk-6K7VISNV.mjs
 var _a39;
 var _2 = (_a39 = class extends H {
   get A_FRAME_TOKEN() {
@@ -3468,7 +3468,7 @@ var n3 = (_a48 = class extends D {
 j2(n3, "A_FrameDefinition");
 var h3 = n3;
-// node_modules/@adaas/a-frame/dist/browser/chunk-FYZWOISU.mjs
+// node_modules/@adaas/a-frame/dist/browser/chunk-3ROGJ3YE.mjs
 var _a49;
 var z2 = (_a49 = class extends H {
   constructor() {
@@ -4439,7 +4439,7 @@ var a3 = (_a64 = class extends D {
 j2(a3, "A_FrameSchema");
 var s2 = a3;
-// node_modules/@adaas/a-frame/dist/browser/chunk-PIH5MHMV.mjs
+// node_modules/@adaas/a-frame/dist/browser/chunk-4KUCX5R6.mjs
 var d3 = { Request: "_A_FRAME_REQUEST", Socket: "_A_FRAME_SOCKET", Stream: "_A_FRAME_STREAM", Send: "_A_FRAME_SEND" };
 var _a65;
 var J2 = (_a65 = class extends H {
@@ -5008,7 +5008,7 @@ var l3 = (_a76 = class extends O {
 j2(l3, "A_FrameChannel"), k2([N.Extend({ name: r4.Embed, scope: [h3] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "embedDefinition", 1), k2([N.Extend({ name: m3.Embed, scope: [w2] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "embedNamespace", 1), k2([N.Extend({ name: r5.Embed, scope: [_4] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "embedSegment", 1), k2([N.Extend({ name: D3.Generate, scope: [O3] }), l(0, Yt(te)), l(1, Yt(v4))], l3.prototype, "generateDynamicStructure", 1), k2([N.Extend({ name: D3.Patch, scope: [O3] }), l(0, Yt(te)), l(1, Yt(v4))], l3.prototype, "patchDynamicStructure", 1), k2([N.Extend({ name: C4.Generate, scope: [P3] }), l(0, Yt(te)), l(1, Yt(w5))], l3.prototype, "generateDynamicFeature", 1), k2([N.Extend({ name: C4.Patch, scope: [P3] }), l(0, Yt(te)), l(1, Yt(w5))], l3.prototype, "patchDynamicFeature", 1), k2([N.Extend({ name: F3.Generate, scope: [w4] }), l(0, Yt(te)), l(1, Yt(f2))], l3.prototype, "generateDynamicContent", 1), k2([N.Extend({ name: F3.Patch, scope: [w4] }), l(0, Yt(te)), l(1, Yt(f2))], l3.prototype, "patchDynamicContent", 1), k2([N.Extend({ name: n4.Generate, scope: [m4] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "generateCompletion", 1), k2([N.Extend({ name: r6.Extract, scope: [s2] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "extractSchema", 1), k2([N.Extend({ name: r6.ExtractMultiple, scope: [s2] }), l(0, Yt(te)), l(1, Yt(f3))], l3.prototype, "extractSchemaMultiple", 1);
 var Fe2 = l3;
-// node_modules/@adaas/a-frame/dist/browser/chunk-2O3HAEYW.mjs
+// node_modules/@adaas/a-frame/dist/browser/chunk-P6WICUUU.mjs
 var _a77;
 var r7 = (_a77 = class extends Fe2 {
   async request(e, a4) {
@@ -12286,6 +12286,7 @@ var AreHTMLInstructions = {
   AddListener: "_AreHTML_AddListener",
   AddInterpolation: "_AreHTML_AddInterpolation",
   AddComment: "_AreHTML_AddComment",
+  AddStaticHTML: "_AreHTML_AddStaticHTML",
   HideElement: "_AreHTML_HideElement"
 };
@@ -12895,6 +12896,24 @@ AddListenerInstruction = __decorateClass([
   })
 ], AddListenerInstruction);
+// src/instructions/AddStaticHTML.instruction.ts
+var AddStaticHTMLInstruction = class extends AreMutation {
+  constructor(parent, props) {
+    if ("aseid" in props) {
+      super(props);
+    } else {
+      super(AreHTMLInstructions.AddStaticHTML, parent, props);
+    }
+  }
+};
+__name(AddStaticHTMLInstruction, "AddStaticHTMLInstruction");
+AddStaticHTMLInstruction = __decorateClass([
+  R4.Define({
+    namespace: "a-are-html",
+    description: 'Materialises a fully static subtree (a "static island") onto its parent element in a single pass via browser-parsed innerHTML / a cached <template> clone. Apply injects the markup; revert clears it. Decodes HTML entities (e.g. &nbsp;) for free.'
+  })
+], AddStaticHTMLInstruction);
 // src/instructions/AddStyle.instruction.ts
 var AddStyleInstruction = class extends AreMutation {
   constructor(parent, props) {
@@ -12957,6 +12976,27 @@ var AreHTMLNode = class extends AreNode {
   get tag() {
     return this.aseid.entity;
   }
+  /**
+   * The verbatim inner markup captured when this node was identified as a
+   * static island, or `undefined` for ordinary (per-node) nodes.
+   */
+  get staticInnerHTML() {
+    return this._staticInnerHTML;
+  }
+  /**
+   * Whether this node is a static-island root (see `_staticInnerHTML`).
+   */
+  get isStaticIsland() {
+    return this._staticInnerHTML !== void 0;
+  }
+  /**
+   * Marks this node as a static-island root, capturing the verbatim inner
+   * markup to be materialised in one shot by the interpreter. Called by the
+   * tokenizer when the node's inner content is detected to be fully static.
+   */
+  markStatic(innerHTML) {
+    this._staticInnerHTML = innerHTML;
+  }
   /**
     * The static attributes defined for the node, which are typically used to represent static properties or characteristics of the node that do not change based on the context or state. These attributes are usually defined in the template and are not reactive.
     *
@@ -13280,6 +13320,171 @@ function toDOMString(value) {
   }
 }
 __name(toDOMString, "toDOMString");
+var STANDARD_HTML_TAGS = /* @__PURE__ */ new Set([
+  // root / sections
+  "html",
+  "body",
+  "header",
+  "footer",
+  "main",
+  "nav",
+  "section",
+  "article",
+  "aside",
+  "address",
+  "hgroup",
+  // headings
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  // grouping
+  "div",
+  "p",
+  "span",
+  "pre",
+  "blockquote",
+  "figure",
+  "figcaption",
+  "hr",
+  "br",
+  "wbr",
+  // lists
+  "ul",
+  "ol",
+  "li",
+  "dl",
+  "dt",
+  "dd",
+  "menu",
+  // text-level / phrasing
+  "a",
+  "b",
+  "i",
+  "u",
+  "s",
+  "em",
+  "strong",
+  "small",
+  "mark",
+  "abbr",
+  "cite",
+  "q",
+  "code",
+  "kbd",
+  "samp",
+  "var",
+  "sub",
+  "sup",
+  "time",
+  "data",
+  "dfn",
+  "bdi",
+  "bdo",
+  "ruby",
+  "rt",
+  "rp",
+  "del",
+  "ins",
+  // media / embedded (no special namespace handling needed)
+  "img",
+  "picture",
+  "source",
+  "figure",
+  "audio",
+  "video",
+  "track",
+  // tables
+  "table",
+  "caption",
+  "colgroup",
+  "col",
+  "thead",
+  "tbody",
+  "tfoot",
+  "tr",
+  "th",
+  "td",
+  // forms (display only — these still render fine from innerHTML)
+  "label",
+  "fieldset",
+  "legend",
+  "datalist",
+  "option",
+  "optgroup",
+  "output",
+  "progress",
+  "meter",
+  // interactive
+  "details",
+  "summary",
+  "dialog"
+]);
+function isStaticMarkup(inner) {
+  if (!inner) return false;
+  if (inner.indexOf("{{") !== -1) return false;
+  const n6 = inner.length;
+  let i6 = 0;
+  while (i6 < n6) {
+    const lt = inner.indexOf("<", i6);
+    if (lt === -1) break;
+    if (inner.startsWith("<!--", lt)) {
+      const end = inner.indexOf("-->", lt + 4);
+      if (end === -1) return false;
+      i6 = end + 3;
+      continue;
+    }
+    if (inner[lt + 1] === "/" || inner[lt + 1] === "!" || inner[lt + 1] === "?") {
+      const gt2 = inner.indexOf(">", lt);
+      if (gt2 === -1) return false;
+      i6 = gt2 + 1;
+      continue;
+    }
+    const nameMatch = /^<([a-zA-Z][a-zA-Z0-9-]*)/.exec(inner.slice(lt));
+    if (!nameMatch) {
+      i6 = lt + 1;
+      continue;
+    }
+    const tag = nameMatch[1].toLowerCase();
+    if (tag.indexOf("-") !== -1 || !STANDARD_HTML_TAGS.has(tag)) return false;
+    let j5 = lt + nameMatch[0].length;
+    let inSingle = false;
+    let inDouble = false;
+    let atNameBoundary = true;
+    let tagEnd = -1;
+    while (j5 < n6) {
+      const ch = inner[j5];
+      if (inDouble) {
+        if (ch === '"') inDouble = false;
+      } else if (inSingle) {
+        if (ch === "'") inSingle = false;
+      } else if (ch === '"') {
+        inDouble = true;
+        atNameBoundary = false;
+      } else if (ch === "'") {
+        inSingle = true;
+        atNameBoundary = false;
+      } else if (ch === ">") {
+        tagEnd = j5;
+        break;
+      } else if (ch === " " || ch === "	" || ch === "\n" || ch === "\r" || ch === "/") {
+        atNameBoundary = true;
+      } else {
+        if (atNameBoundary && (ch === "$" || ch === ":" || ch === "@")) {
+          return false;
+        }
+        atNameBoundary = false;
+      }
+      j5++;
+    }
+    if (tagEnd === -1) return false;
+    i6 = tagEnd + 1;
+  }
+  return true;
+}
+__name(isStaticMarkup, "isStaticMarkup");
 // src/engine/AreHTML.context.ts
 var AreHTMLEngineContext = class extends AreContext {
@@ -13323,11 +13528,109 @@ var AreHTMLEngineContext = class extends AreContext {
        */
       elementListeners: /* @__PURE__ */ new WeakMap()
     };
+    /**
+     * Parsed-fragment cache for static islands (see AddStaticHTMLInstruction).
+     *
+     * Keyed by `hostTag\u0000markup`, each entry holds a `DocumentFragment` whose
+     * children were parsed by the browser exactly once — in the *correct element
+     * context* (the host tag), so table fragments (`<tr>`, `<td>`, …) and other
+     * context-sensitive content parse correctly. Repeated static islands with
+     * identical markup (e.g. list rows, reused components) clone the pre-parsed
+     * fragment instead of re-parsing the HTML string on every mount — turning an
+     * O(parse) operation into an O(clone) one.
+     */
+    this._staticFragmentCache = /* @__PURE__ */ new Map();
+    /**
+     * Live-DOM attachments deferred while a mount pass is batching.
+     *
+     * A freshly-mounted subtree is built inside a *detached* root element, so
+     * every descendant `appendChild`/`insertBefore` happens off-document and
+     * triggers zero layout/paint invalidation. The single mutation that actually
+     * connects the built subtree to the live document is deferred and collected
+     * here, then flushed once when the batch closes — collapsing O(nodes) reflows
+     * into O(1) per mount root.
+     */
+    this._pendingAttachments = [];
+    /**
+     * Depth of the currently open batching scopes. Re-entrant so that nested
+     * `beginBatch`/`endBatch` pairs flush exactly once, when the outermost scope
+     * closes.
+     */
+    this._batchDepth = 0;
     this._container = props.container;
   }
   get container() {
     return this._container;
   }
+  /**
+   * `true` while a synchronous mount pass is batching live-DOM attachments.
+   * Interpreter handlers consult this to decide whether to attach an element
+   * immediately or hand the attachment to {@link deferAttach}.
+   */
+  get isBatching() {
+    return this._batchDepth > 0;
+  }
+  /**
+   * Opens a batching scope. Re-entrant: only the outermost matching
+   * {@link endBatch} flushes the deferred attachments, so a single mount pass
+   * connects its built subtree to the live DOM exactly once.
+   */
+  beginBatch() {
+    this._batchDepth++;
+  }
+  /**
+   * Registers a live-DOM attachment to run when the current batch flushes. If
+   * no batch is active the attachment runs immediately, preserving the original
+   * synchronous behaviour for updates that mount outside a batch.
+   *
+   * @param attach the DOM mutation that connects a built subtree to the document
+   */
+  deferAttach(attach) {
+    if (this._batchDepth > 0) {
+      this._pendingAttachments.push(attach);
+    } else {
+      attach();
+    }
+  }
+  /**
+   * Closes a batching scope. When the outermost scope closes, every deferred
+   * attachment runs in registration (document) order, connecting the built
+   * subtrees to the live DOM in a single pass.
+   */
+  endBatch() {
+    if (this._batchDepth === 0) return;
+    this._batchDepth--;
+    if (this._batchDepth > 0) return;
+    const pending = this._pendingAttachments;
+    this._pendingAttachments = [];
+    for (let i6 = 0; i6 < pending.length; i6++) {
+      pending[i6]();
+    }
+  }
+  /**
+   * Returns a `DocumentFragment` containing the parsed form of `html`, parsed
+   * once in the context of `hostTag` (so context-sensitive content such as
+   * table rows/cells parses correctly) and cached thereafter. Callers should
+   * `cloneNode(true)` the returned fragment rather than mutating it, so the
+   * cache stays reusable.
+   *
+   * @param hostTag the tag name of the element the markup will be injected into
+   * @param html    verbatim static-island inner markup
+   */
+  getStaticFragment(hostTag, html) {
+    const key = `${hostTag}\0${html}`;
+    let fragment = this._staticFragmentCache.get(key);
+    if (!fragment) {
+      const container = this._container.createElement(hostTag);
+      container.innerHTML = html;
+      fragment = this._container.createDocumentFragment();
+      while (container.firstChild) {
+        fragment.appendChild(container.firstChild);
+      }
+      this._staticFragmentCache.set(key, fragment);
+    }
+    return fragment;
+  }
   getNodeElement(node) {
     if (typeof node === "string") {
       return this.index.nodeToHostElements.get(node);
@@ -13463,6 +13766,9 @@ AreHTMLEngineContext = __decorateClass([
 var AreHTMLCompiler = class extends AreCompiler {
   compileHTMLNode(node, scene, logger, ...args) {
     super.compile(node, scene, logger, ...args);
+    if (node.isStaticIsland && scene.host) {
+      scene.plan(new AddStaticHTMLInstruction(scene.host, { html: node.staticInnerHTML }));
+    }
     if (node.styles?.styles) {
       const host = scene.host;
       if (host) {
@@ -13660,12 +13966,15 @@ var AreHTMLInterpreter = class extends AreInterpreter {
           });
         }
         const element = isSVG ? context.container.createElementNS(SVG_NAMESPACE, tag) : context.container.createElement(tag);
-        if (mountPoint.nodeType === Node.ELEMENT_NODE) {
-          mountPoint.appendChild(element);
-        } else {
+        context.setInstructionElement(declaration, element);
+        const attach = mountPoint.nodeType === Node.ELEMENT_NODE ? () => mountPoint.appendChild(element) : () => {
           mountPoint.parentNode?.insertBefore(element, mountPoint);
+        };
+        if (context.isBatching && mountPoint.isConnected) {
+          context.deferAttach(attach);
+        } else {
+          attach();
         }
-        context.setInstructionElement(declaration, element);
       } else {
         const mountPoint = context.container.getElementById(node.id);
         if (!mountPoint) {
@@ -13675,8 +13984,15 @@ var AreHTMLInterpreter = class extends AreInterpreter {
           });
         }
         const element = isSVG ? context.container.createElementNS(SVG_NAMESPACE, tag) : context.container.createElement(tag);
-        mountPoint.parentNode?.replaceChild(element, mountPoint);
         context.setInstructionElement(declaration, element);
+        const attach = /* @__PURE__ */ __name(() => {
+          mountPoint.parentNode?.replaceChild(element, mountPoint);
+        }, "attach");
+        if (context.isBatching && mountPoint.isConnected) {
+          context.deferAttach(attach);
+        } else {
+          attach();
+        }
       }
       logger?.debug("green", `Element ${node.aseid.toString()} added to Context:`);
     } catch (error) {
@@ -13686,7 +14002,7 @@ var AreHTMLInterpreter = class extends AreInterpreter {
   }
   removeElement(declaration, context) {
     const element = context.getElementByInstruction(declaration);
-    if (element && element.parentNode) {
+    if (element && element.parentNode && element.isConnected) {
       element.parentNode.removeChild(element);
     }
     context.removeInstructionElement(declaration);
@@ -13789,7 +14105,7 @@ var AreHTMLInterpreter = class extends AreInterpreter {
       const element = context.getElementByInstruction(mutation.parent);
       if (!element) return;
       const { name } = mutation.payload;
-      if (name && element.nodeType === Node.ELEMENT_NODE) {
+      if (name && element.nodeType === Node.ELEMENT_NODE && element.isConnected) {
         const colonIdx = name.indexOf(":");
         if (colonIdx > 0) {
           const ns = SVG_ATTRIBUTE_NS[name.slice(0, colonIdx)];
@@ -13816,6 +14132,7 @@ var AreHTMLInterpreter = class extends AreInterpreter {
   showElement(mutation, context) {
     const element = context.getElementByInstruction(mutation.parent);
     if (!element || element.nodeType !== Node.ELEMENT_NODE) return;
+    if (!element.isConnected) return;
     const el = element;
     el.style.display = mutation.payload?.display ?? mutation.cache ?? "";
   }
@@ -13910,7 +14227,9 @@ var AreHTMLInterpreter = class extends AreInterpreter {
     const { event: eventName } = parseEventName(name);
     const listener = mutation.payload._callback;
     if (listener) {
-      element.removeEventListener(eventName, listener);
+      if (element.isConnected) {
+        element.removeEventListener(eventName, listener);
+      }
       context.removeListener(element, name, listener);
       mutation.payload._callback = void 0;
     }
@@ -13948,9 +14267,32 @@ var AreHTMLInterpreter = class extends AreInterpreter {
   removeText(declaration, context) {
     const element = context.getElementByInstruction(declaration);
     if (!element) return;
-    element.parentNode?.removeChild(element);
+    if (element.isConnected) {
+      element.parentNode?.removeChild(element);
+    }
     context.removeInstructionElement(declaration);
   }
+  addStaticHTML(mutation, context, logger) {
+    const element = context.getElementByInstruction(mutation.parent);
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      throw new AreInterpreterError({
+        title: "Element Not Found",
+        description: `Could not find a DOM element associated with the instruction ASEID "${mutation.parent}". Ensure the host element is rendered before materialising its static island.`
+      });
+    }
+    const el = element;
+    const { html } = mutation.payload;
+    el.textContent = "";
+    const fragment = context.getStaticFragment(el.tagName.toLowerCase(), html);
+    el.appendChild(fragment.cloneNode(true));
+    logger?.debug("green", `Static island materialised onto <${(mutation.owner.parent ?? mutation.owner)?.aseid?.toString?.()}>`);
+  }
+  removeStaticHTML(mutation, context) {
+    const element = context.getElementByInstruction(mutation.parent);
+    if (element && element.nodeType === Node.ELEMENT_NODE && element.isConnected) {
+      element.textContent = "";
+    }
+  }
   addComment(declaration, context, store, syntax, directiveContext, logger) {
     const node = declaration.owner.parent;
     const { content, evaluate } = declaration.payload;
@@ -13984,7 +14326,9 @@ var AreHTMLInterpreter = class extends AreInterpreter {
   removeComment(declaration, context) {
     const element = context.getElementByInstruction(declaration);
     if (!element) return;
-    element.parentNode?.removeChild(element);
+    if (element.isConnected) {
+      element.parentNode?.removeChild(element);
+    }
     context.removeInstructionElement(declaration);
   }
   addStyle(mutation, context, logger) {
@@ -14129,6 +14473,24 @@ __decorateClass([
   __decorateParam(0, Yt(te)),
   __decorateParam(1, Yt(AreHTMLEngineContext))
 ], AreHTMLInterpreter.prototype, "removeText", 1);
+__decorateClass([
+  R4.Define({
+    description: "Inject a static island's inner markup onto its host element in one pass via a cached, browser-parsed <template> clone. Decodes HTML entities natively."
+  }),
+  AreInterpreter.Apply(AreHTMLInstructions.AddStaticHTML),
+  AreInterpreter.Update(AreHTMLInstructions.AddStaticHTML),
+  __decorateParam(0, Yt(te)),
+  __decorateParam(1, Yt(AreHTMLEngineContext)),
+  __decorateParam(2, Yt(A_Logger))
+], AreHTMLInterpreter.prototype, "addStaticHTML", 1);
+__decorateClass([
+  R4.Define({
+    description: "Clear a static island's injected markup from its host element on revert."
+  }),
+  AreInterpreter.Revert(AreHTMLInstructions.AddStaticHTML),
+  __decorateParam(0, Yt(te)),
+  __decorateParam(1, Yt(AreHTMLEngineContext))
+], AreHTMLInterpreter.prototype, "removeStaticHTML", 1);
 __decorateClass([
   R4.Define({
     description: "Add a comment node to the DOM based on the provided declaration instruction."
@@ -14182,7 +14544,12 @@ var AreHTMLTokenizer = class extends AreTokenizer {
     this.ATTR_PATTERN = /([$:@]?[\w.-]+(?::[\w.-]+)?)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s>/"'=]+)))?/g;
   }
   tokenize(node, context, logger) {
-    super.tokenize(node, context, logger);
+    const isStaticIsland = node instanceof AreComponentNode && !!node.content && isStaticMarkup(node.content);
+    if (isStaticIsland) {
+      node.markStatic(node.content);
+    } else {
+      super.tokenize(node, context, logger);
+    }
     context.startPerformance("attributeExtraction");
     const attributes = this.extractAttributes(node.markup);
     for (const attr of attributes) {
@@ -14262,46 +14629,39 @@ var AreHTMLLifecycle = class extends AreLifecycle {
   mount(node, scene, logger, ...args) {
     logger?.debug(`[Mount] Component Trigger for <${node.aseid.entity}>  with aseid :{${node.aseid.toString()}}`);
     if (scene.isInactive) return;
-    node.interpret();
-    const stack = [];
-    for (let i6 = node.children.length - 1; i6 >= 0; i6--) {
-      stack.push({ node: node.children[i6], entered: false });
-    }
-    const step = /* @__PURE__ */ __name(() => {
-      const frame = stack[stack.length - 1];
-      const current = frame.node;
-      if (frame.entered) {
-        stack.pop();
-        current.call(AreNodeFeatures.onAfterMount, current.scope);
-        return;
-      }
-      frame.entered = true;
-      current.call(AreNodeFeatures.onBeforeMount, current.scope);
-      if (!current.scene.isInactive) {
-        current.interpret();
-        for (let i6 = current.children.length - 1; i6 >= 0; i6--) {
-          stack.push({ node: current.children[i6], entered: false });
-        }
+    const context = node.scope.resolve(AreHTMLEngineContext);
+    context?.beginBatch();
+    const afterMountQueue = [];
+    try {
+      node.interpret();
+      const stack = [];
+      for (let i6 = node.children.length - 1; i6 >= 0; i6--) {
+        stack.push({ node: node.children[i6], entered: false });
       }
-    }, "step");
-    const drive = /* @__PURE__ */ __name(() => {
-      const start = AreSchedulerHelper.now();
       while (stack.length > 0) {
-        step();
-        if (stack.length > 0 && AreSchedulerHelper.now() - start >= AreHTMLLifecycle.MOUNT_BUDGET_MS) {
-          return new Promise((resolve, reject) => {
-            AreSchedulerHelper.scheduleMacrotask(() => {
-              try {
-                resolve(drive());
-              } catch (error) {
-                reject(error);
-              }
-            });
-          });
+        const frame = stack[stack.length - 1];
+        const current = frame.node;
+        if (frame.entered) {
+          stack.pop();
+          afterMountQueue.push(current);
+          continue;
+        }
+        frame.entered = true;
+        current.call(AreNodeFeatures.onBeforeMount, current.scope);
+        if (!current.scene.isInactive) {
+          current.interpret();
+          for (let i6 = current.children.length - 1; i6 >= 0; i6--) {
+            stack.push({ node: current.children[i6], entered: false });
+          }
         }
       }
-    }, "drive");
-    return drive();
+    } finally {
+      context?.endBatch();
+    }
+    for (let i6 = 0; i6 < afterMountQueue.length; i6++) {
+      const mounted = afterMountQueue[i6];
+      mounted.call(AreNodeFeatures.onAfterMount, mounted.scope);
+    }
   }
   updateDirectiveAttribute(directive, scope, feature, logger, ...args) {
     if (directive.component) {
@@ -14312,13 +14672,6 @@ var AreHTMLLifecycle = class extends AreLifecycle {
   }
 };
 __name(AreHTMLLifecycle, "AreHTMLLifecycle");
-/**
- * Per-chunk time budget (ms) for the time-sliced initial mount walk. While
- * mounting a large subtree we keep applying nodes until this much wall-clock
- * time has elapsed, then yield to the browser so it can paint and process
- * input before the next chunk. ~16ms targets a single animation frame.
- */
-AreHTMLLifecycle.MOUNT_BUDGET_MS = 16;
 __decorateClass([
   AreLifecycle.Init(AreComponentNode),
   __decorateParam(0, Yt(te)),

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@adaas/are-html",
-  "version": "0.0.22",
+  "version": "0.0.23",
   "description": "A-Concept Rendering Engine (ARE) is a powerful rendering engine designed to work seamlessly with the A-Concept framework. This library provides an HTML engine implementation of ARE, enabling developers to create dynamic and interactive user interfaces for web applications using standard HTML syntax.",
   "keywords": [
     "a-concept",
@@ -84,15 +84,15 @@
   },
   "peerDependencies": {
     "@adaas/a-concept": "^0.3.29",
-    "@adaas/a-frame": "^0.1.17",
+    "@adaas/a-frame": "^0.1.18",
     "@adaas/a-utils": "^0.3.34",
-    "@adaas/are": "^0.0.23"
+    "@adaas/are": "^0.0.24"
   },
   "devDependencies": {
     "@adaas/a-concept": "^0.3.29",
-    "@adaas/a-frame": "^0.1.17",
+    "@adaas/a-frame": "^0.1.18",
     "@adaas/a-utils": "^0.3.34",
-    "@adaas/are": "^0.0.23",
+    "@adaas/are": "^0.0.24",
     "@types/chai": "^4.3.14",
     "@types/jest": "^29.5.12",
     "@types/mocha": "^10.0.6",