@simpreact/simpreact 0.0.5 → 0.0.7

package/core/internal.d.ts

@@ -4,8 +4,13 @@ export * from './hostAdapter.js';
 export * from './lifecycleEventBus.js';
 export * from './memo.js';
 export * from './mounting.js';
+export * from './mountingChildren.js';
 export * from './patching.js';
+export * from './patchingChildren.js';
 export * from './portal.js';
+export * from './processStack.js';
 export * from './ref.js';
 export * from './rerender.js';
+export * from './runtime.js';
 export * from './unmounting.js';
+export * from './unmountingChildren.js';

package/core/internal.js

@@ -4,8 +4,13 @@ export * from './hostAdapter.js';
 export * from './lifecycleEventBus.js';
 export * from './memo.js';
 export * from './mounting.js';
+export * from './mountingChildren.js';
 export * from './patching.js';
+export * from './patchingChildren.js';
 export * from './portal.js';
+export * from './processStack.js';
 export * from './ref.js';
 export * from './rerender.js';
+export * from './runtime.js';
 export * from './unmounting.js';
+export * from './unmountingChildren.js';

package/core/lifecycleEventBus.d.ts

@@ -1,30 +1,39 @@
-import { EventBus } from '../shared/index.js';
 import type { SimpElement } from './createElement.js';
+import type { SimpRenderRuntime } from './runtime.js';
 export type LifecycleEvent = {
     type: 'beforeRender';
     element: SimpElement;
-    phase: 'mounting' | 'updating';
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'afterRender';
     element: SimpElement;
-    phase: 'mounting' | 'updating';
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'triedToRerender';
     element: SimpElement;
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'mounted';
     element: SimpElement;
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'updated';
     element: SimpElement;
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'unmounted';
     element: SimpElement;
+    renderRuntime: SimpRenderRuntime;
 } | {
     type: 'errored';
     element: SimpElement;
     error: any;
-    phase: 'mounting' | 'updating';
+    handled: boolean;
+    renderRuntime: SimpRenderRuntime;
 };
-export type LifecycleEventBus = EventBus<LifecycleEvent>;
-export declare const lifecycleEventBus: EventBus<LifecycleEvent>;
+type Subscriber = (event: LifecycleEvent) => boolean | void;
+export declare const lifecycleEventBus: {
+    publish(event: LifecycleEvent): void;
+    subscribe(subscriber: Subscriber): () => void;
+};
+export {};

package/core/lifecycleEventBus.js

@@ -1,2 +1,16 @@
-import { EventBus } from '../shared/index.js';
-export const lifecycleEventBus = new EventBus();
+const subscribers = [];
+export const lifecycleEventBus = {
+    publish(event) {
+        for (const subscriber of subscribers) {
+            subscriber(event);
+        }
+    },
+    subscribe(subscriber) {
+        if (subscribers.indexOf(subscriber) === -1) {
+            subscribers.push(subscriber);
+        }
+        return () => {
+            subscribers.splice(subscribers.indexOf(subscriber), 1);
+        };
+    },
+};

package/core/memo.d.ts

@@ -2,8 +2,6 @@ import { shallowEqual } from '../shared/index.js';
 import type { FC, SimpNode } from './createElement.js';
 export interface MemoizedComponent {
     (props: any): SimpNode;
-    _isMemo: true;
-    _render: FC;
     _compare: (prevProps: any, nextProps: any) => boolean;
 }
 export declare function memo(Component: FC, compare?: typeof shallowEqual): MemoizedComponent;

package/core/memo.js

@@ -1,11 +1,9 @@
 import { shallowEqual } from '../shared/index.js';
 export function memo(Component, compare = shallowEqual) {
     const Memoized = (props => Component(props));
-    Memoized._isMemo = true;
-    Memoized._render = Component;
     Memoized._compare = compare;
     return Memoized;
 }
 export function isMemo(type) {
-    return type._isMemo;
+    return !!type._compare;
 }

package/core/mounting.d.ts

@@ -1,10 +1,7 @@
 import type { Maybe, Nullable } from '../shared/index.js';
-import type { HostReference } from './hostAdapter.js';
-import type { SimpElement } from './createElement.js';
-export declare function mount(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function mountTextElement(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>): void;
-export declare function mountHostElement(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function mountFunctionalElement(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function mountFragment(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function mountArrayChildren(children: SimpElement[], reference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown, parentElement: SimpElement, hostNamespace: Maybe<string>): void;
-export declare function mountPortal(element: SimpElement, parentReference: Nullable<HostReference>, nextReference: Nullable<HostReference>, context: unknown): void;
+import { type SimpElement } from './createElement.js';
+import { type MountFrame, type MountFrameMeta } from './processStack.js';
+import { type SimpRenderRuntime } from './runtime.js';
+export declare function mount(element: SimpElement, parentReference: unknown, subtreeRightBoundary: Nullable<SimpElement>, context: unknown, hostNamespace: Maybe<string>, renderRuntime: SimpRenderRuntime): void;
+export declare function _mount(frame: MountFrame): void;
+export declare function _pushMountEnterFrame(element: SimpElement, meta: MountFrameMeta): void;

package/core/mounting.js

@@ -1,75 +1,110 @@
-import { emptyObject } from '../shared/index.js';
-import { hostAdapter } from './hostAdapter.js';
-import { createTextElement, normalizeRoot } from './createElement.js';
-import { applyRef } from './ref.js';
+import { createTextElement, normalizeRoot, SIMP_ELEMENT_CHILD_FLAG_TEXT, } from './createElement.js';
+import { _pushHostOperationPlaceElement } from './hostOperations.js';
 import { lifecycleEventBus } from './lifecycleEventBus.js';
-export function mount(element, parentReference, nextReference, context, hostNamespace) {
-    if (element.flag === 'TEXT') {
-        mountTextElement(element, parentReference, nextReference);
-    }
-    else if (element.flag === 'HOST') {
-        mountHostElement(element, parentReference, nextReference, context, hostNamespace);
-    }
-    else if (element.flag === 'FC') {
-        mountFunctionalElement(element, parentReference, nextReference, context, hostNamespace);
-    }
-    else if (element.flag === 'FRAGMENT') {
-        mountFragment(element, parentReference, nextReference, context, hostNamespace);
-    }
-    else {
-        mountPortal(element, parentReference, nextReference, context);
-    }
+import { _pushMountChildrenFrame } from './mountingChildren.js';
+import { MOUNT_ENTER, MOUNT_EXIT, processStack } from './processStack.js';
+import { applyRef } from './ref.js';
+import { MOUNTING_PHASE } from './runtime.js';
+import { bitScanForwardIndex } from './utils.js';
+const mountHandlers = [_mountHostElement, _mountFunctionalElement, _mountTextElement, _mountPortal, _mountFragment];
+export function mount(element, parentReference, subtreeRightBoundary, context, hostNamespace, renderRuntime) {
+    if (renderRuntime.renderStack.length !== 0) {
+        throw new Error('Cannot mount while rendering.');
+    }
+    _pushMountEnterFrame(element, {
+        parentReference,
+        subtreeRightBoundary,
+        context,
+        hostNamespace,
+        renderRuntime,
+        placeHolderElement: null,
+    });
+    processStack(renderRuntime);
 }
-export function mountTextElement(element, parentReference, nextReference) {
-    const reference = (element.reference = hostAdapter.createTextReference(element.children));
-    if (parentReference) {
-        hostAdapter.insertOrAppend(parentReference, reference, nextReference);
-    }
+export function _mount(frame) {
+    mountHandlers[bitScanForwardIndex(frame.node.flag)](frame);
 }
-export function mountHostElement(element, parentReference, nextReference, context, hostNamespace) {
-    const hostNamespaces = hostAdapter.getHostNamespaces(element, hostNamespace);
-    hostNamespace = hostNamespaces?.self;
-    const hostReference = (element.reference = hostAdapter.createReference(element.type, hostNamespace));
-    hostAdapter.attachElementToReference(element, hostReference);
-    // HOST element always has Maybe<Many<SimpElement>> children due to normalization process.
-    const children = element.children;
-    if (Array.isArray(children)) {
-        mountArrayChildren(children, hostReference, null, context, element, hostNamespaces?.children);
-    }
-    else if (children) {
-        children.parent = element;
-        mount(children, hostReference, null, context, hostNamespaces?.children);
-    }
-    if (element.props) {
-        hostAdapter.mountProps(hostReference, element, hostNamespace);
-        // HOST elements can have either children elements or string children in the props due to normalization.
-        if (typeof element.props.children === 'string') {
-            hostAdapter.setTextContent(hostReference, element.props.children);
+export function _pushMountEnterFrame(element, meta) {
+    meta.renderRuntime.renderStack.push({
+        node: element,
+        kind: MOUNT_ENTER,
+        meta,
+    });
+}
+function _pushMountExitFrame(element, meta) {
+    meta.renderRuntime.renderStack.push({
+        node: element,
+        kind: MOUNT_EXIT,
+        meta,
+    });
+}
+function _mountHostElement(frame) {
+    const element = frame.node;
+    const { parentReference, subtreeRightBoundary, context, hostNamespace, renderRuntime } = frame.meta;
+    if (frame.kind === MOUNT_EXIT) {
+        if (element.childFlag === SIMP_ELEMENT_CHILD_FLAG_TEXT) {
+            renderRuntime.hostAdapter.setTextContent(element.reference, element.props.children);
         }
+        if (element.props) {
+            renderRuntime.hostAdapter.mountProps(element.reference, element, renderRuntime, hostNamespace);
+        }
+        if (element.className) {
+            renderRuntime.hostAdapter.setClassname(element.reference, element.className, hostNamespace);
+        }
+        if (parentReference) {
+            _pushHostOperationPlaceElement(element, {
+                renderRuntime,
+                subtreeRightBoundary,
+                parentReference,
+            });
+        }
+        applyRef(element);
+        return;
     }
-    if (element.className) {
-        hostAdapter.setClassname(hostReference, element.className, hostNamespace);
-    }
-    if (parentReference) {
-        hostAdapter.insertOrAppend(parentReference, hostReference, nextReference);
-    }
-    applyRef(element);
+    const hostNamespaces = renderRuntime.hostAdapter.getHostNamespaces(element, hostNamespace);
+    const hostReference = (element.reference = renderRuntime.hostAdapter.createReference(element.type, hostNamespaces?.self));
+    renderRuntime.hostAdapter.attachElementToReference(element, hostReference, renderRuntime);
+    _pushMountExitFrame(element, {
+        renderRuntime,
+        hostNamespace: hostNamespaces?.self,
+        subtreeRightBoundary,
+        context,
+        parentReference,
+        placeHolderElement: null,
+    });
+    _pushMountChildrenFrame(element, {
+        renderRuntime,
+        hostNamespace: hostNamespaces?.children,
+        subtreeRightBoundary,
+        context,
+        parentReference: hostReference,
+        children: element.children,
+    });
 }
-export function mountFunctionalElement(element, parentReference, nextReference, context, hostNamespace) {
+function _mountFunctionalElement(frame) {
+    const element = frame.node;
+    const { parentReference, subtreeRightBoundary, context, hostNamespace, renderRuntime } = frame.meta;
+    if (frame.kind === MOUNT_EXIT) {
+        lifecycleEventBus.publish({ type: 'mounted', element, renderRuntime });
+        return;
+    }
     if (context) {
         element.context = context;
     }
     if (element.unmounted) {
         element.unmounted = false;
     }
-    element.store = { latestElement: element };
+    element.store = { latestElement: null, hostNamespace: null, forceRerender: false };
+    element.store.latestElement = element;
     if (hostNamespace) {
         element.store.hostNamespace = hostNamespace;
     }
-    // FC element always has Maybe<SimpElement> children due to normalization process.
+    // FC element always has Maybe<SimpElement> children due to a normalization process.
     let children;
     let triedToRerenderUnsubscribe;
     try {
+        renderRuntime.renderPhase = MOUNTING_PHASE;
+        renderRuntime.currentRenderingFCElement = element;
         let triedToRerender = false;
         let rerenderCounter = 0;
         triedToRerenderUnsubscribe = lifecycleEventBus.subscribe(event => {
@@ -82,47 +117,103 @@ export function mountFunctionalElement(element, parentReference, nextReference,
             if (++rerenderCounter >= 25) {
                 throw new Error('Too many re-renders.');
             }
-            lifecycleEventBus.publish({ type: 'beforeRender', element, phase: 'mounting' });
-            children = element.type(element.props || emptyObject);
-            lifecycleEventBus.publish({ type: 'afterRender', element, phase: 'mounting' });
+            lifecycleEventBus.publish({
+                type: 'beforeRender',
+                element,
+                renderRuntime,
+            });
+            children = renderRuntime.renderer(element.type, element, renderRuntime);
+            lifecycleEventBus.publish({
+                type: 'afterRender',
+                element,
+                renderRuntime,
+            });
         } while (triedToRerender);
-        children = normalizeRoot(children, false);
+        normalizeRoot(element, children, false);
+        children = element.children;
     }
     catch (error) {
-        lifecycleEventBus.publish({ type: 'errored', element, error, phase: 'mounting' });
+        const event = {
+            type: 'errored',
+            element,
+            error,
+            handled: false,
+            renderRuntime,
+        };
+        lifecycleEventBus.publish(event);
+        if (!event.handled) {
+            throw new Error('Error occurred during rendering a component', { cause: event.error });
+        }
         return;
     }
     finally {
         triedToRerenderUnsubscribe();
-    }
-    if (children) {
-        children.parent = element;
-        mount((element.children = children), parentReference, nextReference, element.context, hostNamespace);
-    }
-    lifecycleEventBus.publish({ type: 'mounted', element });
+        renderRuntime.renderPhase = null;
+        renderRuntime.currentRenderingFCElement = null;
+    }
+    _pushMountExitFrame(element, {
+        renderRuntime,
+        hostNamespace,
+        subtreeRightBoundary,
+        context,
+        parentReference,
+        placeHolderElement: null,
+    });
+    _pushMountChildrenFrame(element, {
+        renderRuntime,
+        hostNamespace,
+        children: children,
+        context: element.context,
+        parentReference,
+        subtreeRightBoundary,
+    });
 }
-export function mountFragment(element, parentReference, nextReference, context, hostNamespace) {
-    // FRAGMENT element always has Maybe<Many<SimpElement>> children due to normalization process.
-    if (Array.isArray(element.children)) {
-        mountArrayChildren(element.children, parentReference, nextReference, context, element, hostNamespace);
-    }
-    else if (element.children) {
-        element.children.parent = element;
-        mount(element.children, parentReference, nextReference, context, hostNamespace);
-    }
+function _mountTextElement(frame) {
+    frame.node.reference = frame.meta.renderRuntime.hostAdapter.createTextReference(frame.node.children);
+    _pushHostOperationPlaceElement(frame.node, frame.meta);
 }
-export function mountArrayChildren(children, reference, nextReference, context, parentElement, hostNamespace) {
-    for (const child of children) {
-        child.parent = parentElement;
-        mount(child, reference, nextReference, context, hostNamespace);
-    }
-}
-export function mountPortal(element, parentReference, nextReference, context) {
-    if (element.children) {
-        element.children.parent = element;
-        mount(element.children, element.ref, null, context, hostAdapter.getHostNamespaces(element.children, undefined)?.self);
+function _mountPortal(frame) {
+    const element = frame.node;
+    const { parentReference, subtreeRightBoundary, context, renderRuntime } = frame.meta;
+    if (frame.kind === MOUNT_EXIT) {
+        element.reference = frame.meta.placeHolderElement.reference;
+        return;
     }
     const placeHolderElement = createTextElement('');
-    mountTextElement(placeHolderElement, parentReference, nextReference);
-    element.reference = placeHolderElement.reference;
+    _pushMountExitFrame(element, {
+        renderRuntime,
+        subtreeRightBoundary,
+        context: null,
+        parentReference: null,
+        hostNamespace: null,
+        placeHolderElement,
+    });
+    _pushMountChildrenFrame(element, {
+        renderRuntime,
+        hostNamespace: renderRuntime.hostAdapter.getHostNamespaces(element.children, undefined)?.self,
+        subtreeRightBoundary,
+        context,
+        parentReference: element.ref,
+        children: element.children,
+    });
+    _pushMountEnterFrame(placeHolderElement, {
+        renderRuntime,
+        subtreeRightBoundary,
+        context: null,
+        parentReference,
+        hostNamespace: null,
+        placeHolderElement: null,
+    });
+}
+function _mountFragment(frame) {
+    const element = frame.node;
+    const { parentReference, hostNamespace, context, renderRuntime, subtreeRightBoundary } = frame.meta;
+    _pushMountChildrenFrame(element, {
+        renderRuntime,
+        hostNamespace,
+        children: element.children,
+        parentReference,
+        context,
+        subtreeRightBoundary: subtreeRightBoundary,
+    });
 }

package/core/mountingChildren.d.ts

@@ -0,0 +1,4 @@
+import { type SimpElement } from './createElement.js';
+import { type MountChildrenFrame, type MountChildrenFrameMeta } from './processStack.js';
+export declare function _pushMountChildrenFrame(parent: SimpElement, meta: MountChildrenFrameMeta): void;
+export declare function _mountChildren(frame: MountChildrenFrame): void;

package/core/mountingChildren.js

@@ -0,0 +1,47 @@
+import { SIMP_ELEMENT_CHILD_FLAG_ELEMENT, SIMP_ELEMENT_CHILD_FLAG_LIST } from './createElement.js';
+import { _pushMountEnterFrame } from './mounting.js';
+import { MOUNT_CHILDREN_ENTER } from './processStack.js';
+import { isHostLike } from './utils.js';
+export function _pushMountChildrenFrame(parent, meta) {
+    meta.renderRuntime.renderStack.push({
+        node: parent,
+        kind: MOUNT_CHILDREN_ENTER,
+        meta,
+    });
+}
+export function _mountChildren(frame) {
+    const parentElement = frame.node;
+    const { parentReference, hostNamespace, renderRuntime, context } = frame.meta;
+    const subtreeRightBoundary = isHostLike(parentElement.flag) ? null : frame.meta.subtreeRightBoundary;
+    switch (parentElement.childFlag) {
+        case SIMP_ELEMENT_CHILD_FLAG_ELEMENT: {
+            const children = frame.meta.children;
+            children.parent = parentElement;
+            _pushMountEnterFrame(children, {
+                renderRuntime,
+                hostNamespace,
+                subtreeRightBoundary,
+                context,
+                parentReference,
+                placeHolderElement: null,
+            });
+            break;
+        }
+        case SIMP_ELEMENT_CHILD_FLAG_LIST: {
+            const children = frame.meta.children;
+            for (let i = children.length - 1; i >= 0; i--) {
+                const child = children[i];
+                child.parent = parentElement;
+                const rightSibling = children[child.index + 1] || subtreeRightBoundary;
+                _pushMountEnterFrame(child, {
+                    renderRuntime,
+                    parentReference,
+                    context,
+                    hostNamespace,
+                    subtreeRightBoundary: rightSibling,
+                    placeHolderElement: null,
+                });
+            }
+        }
+    }
+}

package/core/patching.d.ts

@@ -1,9 +1,8 @@
 import type { Maybe, Nullable } from '../shared/index.js';
-import type { SimpElement } from './createElement.js';
-import type { HostReference } from './hostAdapter.js';
-export declare function patch(prevElement: SimpElement, nextElement: SimpElement, parentReference: HostReference, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function patchPortal(prevElement: SimpElement, nextElement: SimpElement, context: unknown): void;
-export declare function updateFunctionalComponent(element: SimpElement, parentReference: HostReference, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function patchKeyedChildren(prevChildren: SimpElement[], nextChildren: SimpElement[], parentReference: HostReference, nextReference: Nullable<HostReference>, context: unknown, hostNamespace: Maybe<string>): void;
-export declare function findParentReferenceFromElement(element: SimpElement): Nullable<HostReference>;
-export declare function findHostReferenceFromElement(element: SimpElement): Nullable<HostReference>;
+import { type SimpElement } from './createElement.js';
+import { type PatchFrame, type PatchFrameMeta } from './processStack.js';
+import { type SimpRenderRuntime } from './runtime.js';
+export declare function patch(prevElement: SimpElement, nextElement: SimpElement, parentReference: unknown, subtreeRightBoundary: Nullable<SimpElement>, context: unknown, hostNamespace: Maybe<string>, renderRuntime: SimpRenderRuntime): void;
+export declare function _pushPatchEnterFrame(element: SimpElement, meta: PatchFrameMeta): void;
+export declare function _pushPatchExitFrame(element: SimpElement, meta: PatchFrameMeta): void;
+export declare function _patch(frame: PatchFrame): void;