@simpreact/simpreact 0.0.6 → 0.0.8

package/core/patchingChildren.js

@@ -1,13 +1,15 @@
-import { SIMP_ELEMENT_CHILD_FLAG_ELEMENT, SIMP_ELEMENT_CHILD_FLAG_LIST, SIMP_ELEMENT_CHILD_FLAG_TEXT, SIMP_ELEMENT_FLAG_FRAGMENT, } from './createElement.js';
+import { SIMP_ELEMENT_CHILD_FLAG_ELEMENT, SIMP_ELEMENT_CHILD_FLAG_LIST, SIMP_ELEMENT_CHILD_FLAG_TEXT, } from './createElement.js';
 import { _pushHostOperationPlaceElement } from './hostOperations.js';
-import { _pushMountArrayChildrenFrame, _pushMountEnterFrame } from './mounting.js';
+import { _pushMountEnterFrame } from './mounting.js';
+import { _pushMountChildrenFrame } from './mountingChildren.js';
 import { _pushPatchEnterFrame } from './patching.js';
-import { PATCH_CHILDREN, PATCH_KEYED_CHILDREN } from './processStack.js';
-import { _clearElementHostReference, _pushUnmountArrayChildrenFrame, _pushUnmountEnterFrame, _remove, } from './unmounting.js';
-import { getLongestIncreasingSubsequenceIndexes } from './utils.js';
-export function _pushPatchChildrenFrame(element, meta) {
+import { PATCH_CHILDREN, PATCH_KEYED_CHILDREN, } from './processStack.js';
+import { _pushUnmountEnterFrame } from './unmounting.js';
+import { _pushUnmountChildrenFrame } from './unmountingChildren.js';
+import { _clearElementHostReference, getLongestIncreasingSubsequenceIndexes, isHostLike } from './utils.js';
+export function _pushPatchChildrenFrame(parent, meta) {
     meta.renderRuntime.renderStack.push({
-        node: element,
+        node: parent,
         kind: PATCH_CHILDREN,
         meta,
     });
@@ -20,119 +22,122 @@ export function _pushPatchKeyedChildrenFrame(element, meta) {
     });
 }
 export function _patchChildren(frame) {
-    const nextElement = frame.node;
-    const { renderRuntime, rightSibling, parentReference, context, hostNamespace, placeHolderElement, prevElement } = frame.meta;
-    const nextChildFlag = nextElement.childFlag;
-    const prevChildFlag = prevElement.childFlag;
-    let nextChildren = nextElement.children;
-    let prevChildren = prevElement.children;
-    switch (prevChildFlag) {
+    const parentElement = frame.node;
+    const { renderRuntime, parentReference, context, hostNamespace, nextChildren, prevChildren, prevParentChildFlag, nextParentChildFlag, prevParentElement, } = frame.meta;
+    const subtreeRightBoundary = isHostLike(parentElement.flag) ? null : frame.meta.subtreeRightBoundary;
+    switch (prevParentChildFlag) {
         case SIMP_ELEMENT_CHILD_FLAG_LIST: {
-            switch (nextChildFlag) {
+            switch (nextParentChildFlag) {
                 case SIMP_ELEMENT_CHILD_FLAG_LIST: {
                     for (const child of nextChildren) {
-                        child.parent = nextElement;
+                        child.parent = parentElement;
                     }
-                    _pushPatchKeyedChildrenFrame(frame.node, {
-                        prevElement,
+                    _pushPatchKeyedChildrenFrame(parentElement, {
+                        prevChildren,
+                        nextChildren,
+                        subtreeRightBoundary,
+                        prevParentChildFlag,
+                        nextParentChildFlag,
                         context,
                         parentReference,
-                        rightSibling,
                         hostNamespace,
-                        placeHolderElement,
                         renderRuntime,
+                        prevParentElement,
                     });
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
-                    if (prevElement.flag & SIMP_ELEMENT_FLAG_FRAGMENT) {
-                        _clearElementHostReference(prevElement, parentReference, renderRuntime);
-                    }
-                    else {
-                        renderRuntime.hostAdapter.clearNode(parentReference);
-                    }
-                    _pushMountEnterFrame(nextChildren, {
-                        parentReference,
-                        rightSibling,
+                    nextChildren.parent = parentElement;
+                    _pushPatchKeyedChildrenFrame(parentElement, {
+                        prevChildren,
+                        nextChildren,
+                        subtreeRightBoundary,
+                        prevParentChildFlag,
+                        nextParentChildFlag,
                         context,
+                        parentReference,
                         hostNamespace,
                         renderRuntime,
-                        placeHolderElement: null,
+                        prevParentElement,
                     });
-                    _pushUnmountArrayChildrenFrame(prevElement, renderRuntime);
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_TEXT: {
-                    _pushUnmountArrayChildrenFrame(prevElement, renderRuntime);
-                    renderRuntime.hostAdapter.setTextContent(parentReference, nextElement.props?.children);
+                    _pushUnmountChildrenFrame(prevParentElement, frame.meta);
+                    renderRuntime.hostAdapter.setTextContent(parentReference, parentElement.props?.children);
                     break;
                 }
                 default: {
-                    _pushUnmountArrayChildrenFrame(prevElement, renderRuntime);
+                    _pushUnmountChildrenFrame(prevParentElement, frame.meta);
                     renderRuntime.hostAdapter.clearNode(parentReference);
                 }
             }
             break;
         }
         case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
-            switch (nextChildFlag) {
+            switch (nextParentChildFlag) {
                 case SIMP_ELEMENT_CHILD_FLAG_LIST: {
-                    _pushUnmountEnterFrame(prevChildren, renderRuntime);
-                    _pushMountArrayChildrenFrame(nextElement, {
-                        parentReference,
-                        renderRuntime,
-                        rightSibling,
+                    for (const child of nextChildren) {
+                        child.parent = parentElement;
+                    }
+                    _pushPatchKeyedChildrenFrame(parentElement, {
+                        prevChildren,
+                        nextChildren,
+                        subtreeRightBoundary,
+                        prevParentChildFlag,
+                        nextParentChildFlag,
                         context,
+                        parentReference,
                         hostNamespace,
-                        placeHolderElement: null,
+                        renderRuntime,
+                        prevParentElement,
                     });
-                    _clearElementHostReference(prevChildren, parentReference, renderRuntime);
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
-                    nextChildren.parent = nextElement;
+                    nextChildren.parent = parentElement;
                     _pushPatchEnterFrame(nextChildren, {
                         prevElement: prevChildren,
                         parentReference,
                         renderRuntime,
-                        rightSibling,
+                        subtreeRightBoundary: subtreeRightBoundary,
                         context,
                         hostNamespace,
-                        placeHolderElement: null,
                     });
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_TEXT: {
-                    _pushUnmountArrayChildrenFrame(prevElement, renderRuntime);
-                    renderRuntime.hostAdapter.setTextContent(parentReference, nextElement.props?.children);
+                    _pushUnmountChildrenFrame(prevParentElement, frame.meta);
+                    renderRuntime.hostAdapter.setTextContent(parentReference, parentElement.props?.children);
                     break;
                 }
                 default: {
-                    _remove(prevChildren, parentReference, renderRuntime);
+                    _clearElementHostReference(prevChildren, parentReference, renderRuntime);
+                    _pushUnmountEnterFrame(prevChildren, frame.meta);
                 }
             }
             break;
         }
         case SIMP_ELEMENT_CHILD_FLAG_TEXT: {
-            switch (nextChildFlag) {
+            switch (nextParentChildFlag) {
                 case SIMP_ELEMENT_CHILD_FLAG_LIST: {
                     renderRuntime.hostAdapter.clearNode(parentReference);
-                    _pushMountArrayChildrenFrame(nextElement, {
-                        parentReference,
-                        renderRuntime,
-                        rightSibling,
+                    _pushMountChildrenFrame(parentElement, {
+                        children: parentElement.children,
                         context,
                         hostNamespace,
-                        placeHolderElement: null,
+                        renderRuntime,
+                        subtreeRightBoundary,
+                        parentReference,
                     });
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
                     renderRuntime.hostAdapter.clearNode(parentReference);
-                    nextChildren.parent = nextElement;
+                    nextChildren.parent = parentElement;
                     _pushMountEnterFrame(nextChildren, {
                         parentReference,
-                        rightSibling,
+                        subtreeRightBoundary: subtreeRightBoundary,
                         context,
                         hostNamespace,
                         renderRuntime,
@@ -141,8 +146,8 @@ export function _patchChildren(frame) {
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_TEXT: {
-                    prevChildren = prevElement.props?.children;
-                    nextChildren = nextElement.props?.children;
+                    const prevChildren = prevParentElement.props?.children;
+                    const nextChildren = parentElement.props?.children;
                     if (prevChildren !== nextChildren) {
                         renderRuntime.hostAdapter.setTextContent(parentReference, nextChildren, true);
                     }
@@ -151,44 +156,43 @@ export function _patchChildren(frame) {
             break;
         }
         default: {
-            switch (nextChildFlag) {
+            switch (nextParentChildFlag) {
                 case SIMP_ELEMENT_CHILD_FLAG_LIST: {
-                    _pushMountArrayChildrenFrame(nextElement, {
+                    _pushMountChildrenFrame(parentElement, {
                         parentReference,
-                        rightSibling,
+                        subtreeRightBoundary,
                         context,
                         hostNamespace,
                         renderRuntime,
-                        placeHolderElement: null,
+                        children: parentElement.children,
                     });
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
-                    nextChildren.parent = nextElement;
+                    nextChildren.parent = parentElement;
                     _pushMountEnterFrame(nextChildren, {
                         parentReference,
-                        rightSibling,
                         context,
                         hostNamespace,
                         renderRuntime,
                         placeHolderElement: null,
+                        subtreeRightBoundary: subtreeRightBoundary,
                     });
                     break;
                 }
                 case SIMP_ELEMENT_CHILD_FLAG_TEXT: {
-                    renderRuntime.hostAdapter.setTextContent(parentReference, nextElement.props?.children);
+                    renderRuntime.hostAdapter.setTextContent(parentReference, parentElement.props?.children);
                 }
             }
         }
     }
 }
 export function _patchKeyedChildren(frame) {
-    const { node: nextElement, meta } = frame;
-    const { renderRuntime, parentReference, prevElement, context, hostNamespace } = meta;
-    const nextChildren = nextElement.children;
-    const prevChildren = prevElement.children;
-    const nextLen = nextChildren.length;
-    const prevLen = prevChildren.length;
+    const { parentReference, subtreeRightBoundary, context, hostNamespace, renderRuntime } = frame.meta;
+    const nextChildren = frame.meta.nextChildren;
+    const prevChildren = frame.meta.prevChildren;
+    const nextLen = Array.isArray(nextChildren) ? nextChildren.length : 1;
+    const prevLen = Array.isArray(prevChildren) ? prevChildren.length : 1;
     const base = {
         parentReference,
         renderRuntime,
@@ -197,7 +201,7 @@ export function _patchKeyedChildren(frame) {
         placeHolderElement: null,
     };
     const getRightSibling = (child) => {
-        return nextChildren[child.index + 1] ?? null;
+        return child.index + 1 < nextLen ? getChild(nextChildren, child.index + 1) : subtreeRightBoundary;
     };
     let prevStart = 0;
     let nextStart = 0;
@@ -205,41 +209,45 @@ export function _patchKeyedChildren(frame) {
     let nextEnd = nextLen - 1;
     while (prevStart <= prevEnd &&
         nextStart <= nextEnd &&
-        prevChildren[prevStart].key === nextChildren[nextStart].key) {
+        getChild(prevChildren, prevStart).key === getChild(nextChildren, nextStart).key) {
         prevStart++;
         nextStart++;
     }
-    while (prevStart <= prevEnd && nextStart <= nextEnd && prevChildren[prevEnd].key === nextChildren[nextEnd].key) {
+    while (prevStart <= prevEnd &&
+        nextStart <= nextEnd &&
+        getChild(prevChildren, prevEnd).key === getChild(nextChildren, nextEnd).key) {
         prevEnd--;
         nextEnd--;
     }
     const pushPrefixPatches = () => {
         for (let i = 0; i < nextStart; i++) {
-            const nextChild = nextChildren[i];
-            const prevChild = prevChildren[nextChild.index];
+            const nextChild = getChild(nextChildren, i);
+            const prevChild = getChild(prevChildren, nextChild.index);
             _pushPatchEnterFrame(nextChild, {
                 ...base,
                 prevElement: prevChild,
-                rightSibling: getRightSibling(nextChild),
+                subtreeRightBoundary: getRightSibling(nextChild),
             });
         }
     };
     const pushSuffixPatches = () => {
         const delta = nextLen - prevLen;
         for (let i = nextEnd + 1; i < nextLen; i++) {
-            const nextChild = nextChildren[i];
-            const prevChild = prevChildren[nextChild.index - delta];
+            const nextChild = getChild(nextChildren, i);
+            const prevChild = getChild(prevChildren, nextChild.index - delta);
             _pushPatchEnterFrame(nextChild, {
                 ...base,
                 prevElement: prevChild,
-                rightSibling: getRightSibling(nextChild),
+                subtreeRightBoundary: getRightSibling(nextChild),
             });
         }
     };
     if (nextStart > nextEnd) {
         pushPrefixPatches();
         for (let i = prevStart; i <= prevEnd; i++) {
-            _remove(prevChildren[i], parentReference, renderRuntime);
+            const child = getChild(prevChildren, i);
+            _clearElementHostReference(child, parentReference, renderRuntime);
+            _pushUnmountEnterFrame(child, frame.meta);
         }
         pushSuffixPatches();
         return;
@@ -247,10 +255,10 @@ export function _patchKeyedChildren(frame) {
     if (prevStart > prevEnd) {
         pushPrefixPatches();
         for (let i = nextStart; i <= nextEnd; i++) {
-            const nextChild = nextChildren[i];
+            const nextChild = getChild(nextChildren, i);
             _pushMountEnterFrame(nextChild, {
                 ...base,
-                rightSibling: getRightSibling(nextChild),
+                subtreeRightBoundary: getRightSibling(nextChild),
             });
         }
         pushSuffixPatches();
@@ -258,7 +266,7 @@ export function _patchKeyedChildren(frame) {
     }
     const keyToPrevChild = new Map();
     for (let i = prevStart; i <= prevEnd; i++) {
-        const prevChild = prevChildren[i];
+        const prevChild = getChild(prevChildren, i);
         const key = prevChild.key;
         if (key != null) {
             keyToPrevChild.set(key, prevChild);
@@ -269,7 +277,7 @@ export function _patchKeyedChildren(frame) {
     let moved = false;
     let maxPrevIndexSoFar = -1;
     for (let i = nextStart; i <= nextEnd; i++) {
-        const nextChild = nextChildren[i];
+        const nextChild = getChild(nextChildren, i);
         const prevChild = keyToPrevChild.get(nextChild.key);
         if (prevChild != null) {
             const prevIndex = prevChild.index;
@@ -292,23 +300,25 @@ export function _patchKeyedChildren(frame) {
     }
     for (let i = prevStart; i <= prevEnd; i++) {
         if (!matchedPrev[i - prevStart]) {
-            _remove(prevChildren[i], parentReference, renderRuntime);
+            const child = getChild(prevChildren, i);
+            _clearElementHostReference(child, parentReference, renderRuntime);
+            _pushUnmountEnterFrame(child, frame.meta);
         }
     }
     const stableNewIndexes = moved ? getLongestIncreasingSubsequenceIndexes(newIndexToOldIndex) : new Int32Array(0);
     let stableCursor = 0;
     for (let i = nextStart; i <= nextEnd; i++) {
-        const nextChild = nextChildren[i];
+        const nextChild = getChild(nextChildren, i);
         const newIndex = nextChild.index - nextStart;
         const oldIndex = newIndexToOldIndex[newIndex];
         if (oldIndex === 0) {
             _pushMountEnterFrame(nextChild, {
                 ...base,
-                rightSibling: getRightSibling(nextChild),
+                subtreeRightBoundary: getRightSibling(nextChild),
             });
             continue;
         }
-        const prevChild = prevChildren[oldIndex - 1];
+        const prevChild = getChild(prevChildren, oldIndex - 1);
         const isStable = moved && stableNewIndexes[stableCursor] === newIndex;
         if (isStable) {
             stableCursor++;
@@ -317,14 +327,17 @@ export function _patchKeyedChildren(frame) {
             _pushHostOperationPlaceElement(nextChild, {
                 parentReference,
                 renderRuntime,
-                rightSibling: getRightSibling(nextChild),
+                subtreeRightBoundary: getRightSibling(nextChild),
             });
         }
         _pushPatchEnterFrame(nextChild, {
             ...base,
             prevElement: prevChild,
-            rightSibling: null,
+            subtreeRightBoundary: null,
         });
     }
     pushSuffixPatches();
 }
+function getChild(children, index) {
+    return Array.isArray(children) ? children[index] : children;
+}

package/core/processStack.d.ts

@@ -1,33 +1,60 @@
-import type { Maybe, Nullable } from '../shared/index.js';
+import type { Many, Maybe, Nullable } from '../shared/index.js';
 import type { SimpElement } from './createElement.js';
 import type { SimpRenderRuntime } from './runtime.js';
-export declare const MOUNT_ENTER = 1;
-export declare const MOUNT_EXIT = 2;
-export declare const PATCH_ENTER = 3;
-export declare const PATCH_EXIT = 4;
-export declare const PATCH_CHILDREN = 5;
-export declare const PATCH_KEYED_CHILDREN = 6;
-export declare const UNMOUNT_ENTER = 7;
-export declare const UNMOUNT_EXIT = 8;
-export declare const HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR = 9;
-export declare const HOST_OPS_REPLACE_CHILD = 10;
+export declare const MOUNT_ENTER = 10;
+export declare const MOUNT_EXIT = 11;
+export declare const MOUNT_CHILDREN_ENTER = 12;
+export declare const PATCH_ENTER = 20;
+export declare const PATCH_EXIT = 21;
+export declare const PATCH_CHILDREN = 22;
+export declare const PATCH_KEYED_CHILDREN = 24;
+export declare const UNMOUNT_ENTER = 30;
+export declare const UNMOUNT_EXIT = 31;
+export declare const UNMOUNT_CHILDREN_ENTER = 32;
+export declare const HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR = 40;
+export declare const HOST_OPS_REPLACE_CHILD = 42;
 export interface MountFrameMeta {
     parentReference: unknown;
-    rightSibling: Nullable<SimpElement>;
+    subtreeRightBoundary: Nullable<SimpElement>;
     context: unknown;
     hostNamespace: Maybe<string>;
     renderRuntime: SimpRenderRuntime;
     placeHolderElement: Nullable<SimpElement>;
 }
-export interface PatchFrameMeta extends MountFrameMeta {
+export interface MountChildrenFrameMeta {
+    children: Nullable<Many<SimpElement>>;
+    parentReference: unknown;
+    subtreeRightBoundary: Nullable<SimpElement>;
+    context: unknown;
+    hostNamespace: Maybe<string>;
+    renderRuntime: SimpRenderRuntime;
+}
+export interface PatchFrameMeta {
+    parentReference: unknown;
+    subtreeRightBoundary: Nullable<SimpElement>;
+    context: unknown;
+    hostNamespace: Maybe<string>;
+    renderRuntime: SimpRenderRuntime;
     prevElement: SimpElement;
 }
+export interface PatchChildrenFrameMeta {
+    parentReference: unknown;
+    subtreeRightBoundary: Nullable<SimpElement>;
+    context: unknown;
+    hostNamespace: Maybe<string>;
+    renderRuntime: SimpRenderRuntime;
+    nextChildren: Nullable<Many<SimpElement>>;
+    prevChildren: Nullable<Many<SimpElement>>;
+    prevParentChildFlag: number;
+    nextParentChildFlag: number;
+    prevParentElement: SimpElement;
+}
 export interface UnmountFrameMeta {
     renderRuntime: SimpRenderRuntime;
 }
 export interface PlaceElementFrameMeta {
     parentReference: unknown;
-    rightSibling: Nullable<SimpElement>;
+    subtreeRightBoundary: Nullable<SimpElement>;
     renderRuntime: SimpRenderRuntime;
 }
 export interface ReplaceElementFrameMeta {
@@ -39,6 +66,11 @@ export interface MountFrame {
     kind: typeof MOUNT_ENTER | typeof MOUNT_EXIT;
     meta: MountFrameMeta;
 }
+export interface MountChildrenFrame {
+    node: SimpElement;
+    kind: typeof MOUNT_CHILDREN_ENTER;
+    meta: MountChildrenFrameMeta;
+}
 export interface PatchFrame {
     node: SimpElement;
     kind: typeof PATCH_ENTER | typeof PATCH_EXIT;
@@ -47,13 +79,18 @@ export interface PatchFrame {
 export interface PatchChildrenFrame {
     node: SimpElement;
     kind: typeof PATCH_CHILDREN | typeof PATCH_KEYED_CHILDREN;
-    meta: PatchFrameMeta;
+    meta: PatchChildrenFrameMeta;
 }
 export interface UnmountFrame {
     node: SimpElement;
     kind: typeof UNMOUNT_ENTER | typeof UNMOUNT_EXIT;
     meta: UnmountFrameMeta;
 }
+export interface UnmountChildrenFrame {
+    node: SimpElement;
+    kind: typeof UNMOUNT_CHILDREN_ENTER;
+    meta: UnmountFrameMeta;
+}
 export interface PlaceElementFrame {
     node: SimpElement;
     kind: typeof HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR;
@@ -64,6 +101,6 @@ export interface ReplaceElementFrame {
     kind: typeof HOST_OPS_REPLACE_CHILD;
     meta: ReplaceElementFrameMeta;
 }
-export type SimpRenderFrame = MountFrame | PatchFrame | PatchChildrenFrame | UnmountFrame | PlaceElementFrame | ReplaceElementFrame;
+export type SimpRenderFrame = MountFrame | MountChildrenFrame | PatchFrame | PatchChildrenFrame | UnmountFrame | UnmountChildrenFrame | PlaceElementFrame | ReplaceElementFrame;
 export type SimpRenderStack = SimpRenderFrame[];
 export declare function processStack(renderRuntime: SimpRenderRuntime): void;

package/core/processStack.js

@@ -1,18 +1,22 @@
 import { _mount } from './mounting.js';
+import { _mountChildren } from './mountingChildren.js';
 import { _patch } from './patching.js';
 import { _patchChildren, _patchKeyedChildren } from './patchingChildren.js';
 import { _unmount } from './unmounting.js';
+import { _unmountChildren } from './unmountingChildren.js';
 import { placeElementBeforeAnchor, resolveAnchorReference } from './utils.js';
-export const MOUNT_ENTER = 1;
-export const MOUNT_EXIT = 2;
-export const PATCH_ENTER = 3;
-export const PATCH_EXIT = 4;
-export const PATCH_CHILDREN = 5;
-export const PATCH_KEYED_CHILDREN = 6;
-export const UNMOUNT_ENTER = 7;
-export const UNMOUNT_EXIT = 8;
-export const HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR = 9;
-export const HOST_OPS_REPLACE_CHILD = 10;
+export const MOUNT_ENTER = 10;
+export const MOUNT_EXIT = 11;
+export const MOUNT_CHILDREN_ENTER = 12;
+export const PATCH_ENTER = 20;
+export const PATCH_EXIT = 21;
+export const PATCH_CHILDREN = 22;
+export const PATCH_KEYED_CHILDREN = 24;
+export const UNMOUNT_ENTER = 30;
+export const UNMOUNT_EXIT = 31;
+export const UNMOUNT_CHILDREN_ENTER = 32;
+export const HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR = 40;
+export const HOST_OPS_REPLACE_CHILD = 42;
 export function processStack(renderRuntime) {
     const stack = renderRuntime.renderStack;
     while (stack.length > 0) {
@@ -22,6 +26,10 @@ export function processStack(renderRuntime) {
                 _mount(frame);
                 break;
             }
+            case MOUNT_CHILDREN_ENTER: {
+                _mountChildren(frame);
+                break;
+            }
             case MOUNT_EXIT: {
                 _mount(frame);
                 break;
@@ -50,8 +58,12 @@ export function processStack(renderRuntime) {
                 _unmount(frame);
                 break;
             }
+            case UNMOUNT_CHILDREN_ENTER: {
+                _unmountChildren(frame);
+                break;
+            }
             case HOST_OPS_PLACE_ELEMENT_BEFORE_ANCHOR: {
-                const anchor = resolveAnchorReference(frame.meta.rightSibling);
+                const anchor = resolveAnchorReference(frame.meta.subtreeRightBoundary);
                 placeElementBeforeAnchor(frame.node, anchor, frame.meta.parentReference, renderRuntime);
                 break;
             }

package/core/unmounting.d.ts

@@ -1,11 +1,7 @@
-import type { Maybe } from '../shared/index.js';
-import { type SimpElement } from './createElement.js';
-import { type UnmountFrame } from './processStack.js';
+import type { SimpElement } from './createElement.js';
+import { type UnmountFrame, type UnmountFrameMeta } from './processStack.js';
 import type { SimpRenderRuntime } from './runtime.js';
 export declare function unmount(element: SimpElement, renderRuntime: SimpRenderRuntime): void;
 export declare function _unmount(frame: UnmountFrame): void;
-export declare function _pushUnmountEnterFrame(element: SimpElement, renderRuntime: SimpRenderRuntime): void;
-export declare function _pushUnmountExitFrame(element: SimpElement, renderRuntime: SimpRenderRuntime): void;
-export declare function _pushUnmountArrayChildrenFrame(element: SimpElement, renderRuntime: SimpRenderRuntime): void;
-export declare function _clearElementHostReference(element: Maybe<SimpElement>, parentHostReference: unknown, renderRuntime: SimpRenderRuntime): void;
-export declare function _remove(element: SimpElement, parentReference: unknown, renderRuntime: SimpRenderRuntime): void;
+export declare function _pushUnmountEnterFrame(element: SimpElement, meta: UnmountFrameMeta): void;
+export declare function _pushUnmountExitFrame(element: SimpElement, meta: UnmountFrameMeta): void;