@simpreact/simpreact 0.0.4 → 0.0.6

package/LICENSE.txt

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Dmitrii Paskhin
+Copyright (c) 2026 Dmitrii Paskhin
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/compat/context.d.ts

@@ -1,8 +1,8 @@
 import * as SimpReactContext from '../context/index.js';
-export declare const createContext: typeof SimpReactContext.createContext;
-export declare const useContext: typeof SimpReactContext.useContext;
+export declare const createContext: SimpReactContext.CreateContext;
+export declare const useContext: SimpReactContext.UseContext;
 declare const _default: {
-    createContext: typeof SimpReactContext.createContext;
-    useContext: typeof SimpReactContext.useContext;
+    createContext: SimpReactContext.CreateContext;
+    useContext: SimpReactContext.UseContext;
 };
 export default _default;

package/compat/context.js

@@ -1,6 +1,7 @@
 import * as SimpReactContext from '../context/index.js';
-export const createContext = SimpReactContext.createContext;
-export const useContext = SimpReactContext.useContext;
+import { renderRuntime } from './renderRuntime.js';
+export const createContext = SimpReactContext.createCreateContext(renderRuntime);
+export const useContext = SimpReactContext.createUseContext(renderRuntime);
 export default {
     createContext,
     useContext,

package/compat/core.d.ts

@@ -12,6 +12,9 @@ export declare function Suspense(props: {
     fallback: SimpReactInternal.SimpNode;
     children: SimpReactInternal.SimpNode;
 }): SimpReactInternal.SimpNode;
+export declare function StrictMode(props: {
+    children: SimpReactInternal.SimpNode;
+}): SimpReactInternal.SimpNode;
 export declare function forwardRef<P, T>(Component: (props: P, ref: SimpReactInternal.Ref<T>) => any): (props: P) => any;
 export declare const Fragment: SimpReactInternal.Fragment;
 export declare const createElement: typeof SimpReactInternal.createElement;
@@ -32,6 +35,7 @@ declare const _default: {
     cloneElement: typeof cloneElement;
     isValidElement: typeof isValidElement;
     Suspense: typeof Suspense;
+    StrictMode: typeof StrictMode;
     forwardRef: typeof forwardRef;
     Fragment: SimpReactInternal.Fragment;
     createElement: typeof SimpReactInternal.createElement;

package/compat/core.js

@@ -1,5 +1,5 @@
 import * as SimpReactInternal from '../core/internal.js';
-import * as SimpReactHooks from '../hooks/index.js';
+import { useCatch, useState } from './hooks.js';
 export const Children = {
     map(children, fn) {
         return Children.toArray(children).map(fn);
@@ -39,27 +39,31 @@ export function cloneElement(element, props, ...children) {
     if (!isValidElement(element)) {
         throw new Error(`cloneElement: expected a SimpElement, got ${element}`);
     }
-    if (element.flag === 'PORTAL') {
+    if ((element.flag & SimpReactInternal.SIMP_ELEMENT_FLAG_PORTAL) !== 0) {
         throw new Error('cloneElement: the argument must be a SimpElement, but you passed a portal instead.');
     }
-    return SimpReactInternal.createElement(element.flag === 'FRAGMENT' ? SimpReactInternal.Fragment : element.type, Object.assign({}, element.props, props), arguments.length > 2 ? children : props.children || element.children);
+    return SimpReactInternal.createElement((element.flag & SimpReactInternal.SIMP_ELEMENT_FLAG_FRAGMENT) !== 0 ? SimpReactInternal.Fragment : element.type, Object.assign({}, element.props, props), arguments.length > 2 ? children : props.children || element.children);
 }
 export function isValidElement(element) {
     return typeof element === 'object' && element !== null && 'flag' in element;
 }
 export function Suspense(props) {
-    const [isSuspended, setIsSuspended] = SimpReactHooks.useState(false);
-    SimpReactHooks.useCatch(error => {
+    const [isSuspended, setIsSuspended] = useState(false);
+    useCatch(error => {
+        if (!(error instanceof Promise)) {
+            throw error;
+        }
         if (isSuspended) {
             return;
         }
-        if (error instanceof Promise) {
-            setIsSuspended(true);
-            error.then(() => setIsSuspended(false));
-        }
+        setIsSuspended(true);
+        error.then(() => setIsSuspended(false));
     });
     return isSuspended ? props.fallback : props.children;
 }
+export function StrictMode(props) {
+    return props.children;
+}
 export function forwardRef(Component) {
     return function Forwarded(props) {
         return Component(props, props?.ref || null);
@@ -80,6 +84,7 @@ export default {
     cloneElement,
     isValidElement,
     Suspense,
+    StrictMode,
     forwardRef,
     Fragment,
     createElement,

package/compat/dom.d.ts

@@ -1,11 +1,10 @@
-import * as SimpReactDOM from '../dom/index.js';
 import * as SimpReactShared from '../shared/index.js';
 export declare const hydrate: typeof SimpReactShared.noop;
-export declare const render: typeof SimpReactDOM.render;
-export declare const createRoot: typeof SimpReactDOM.createRoot;
+export declare const render: (element: SimpReactShared.Nullable<import("../core/createElement.js").SimpElement>, container: SimpReactShared.Nullable<Element | DocumentFragment>) => void;
+export declare const createRoot: (container: Element | DocumentFragment) => import("../dom/render.js").SimpRoot;
 declare const _default: {
     hydrate: typeof SimpReactShared.noop;
-    render: typeof SimpReactDOM.render;
-    createRoot: typeof SimpReactDOM.createRoot;
+    render: (element: SimpReactShared.Nullable<import("../core/createElement.js").SimpElement>, container: SimpReactShared.Nullable<Element | DocumentFragment>) => void;
+    createRoot: (container: Element | DocumentFragment) => import("../dom/render.js").SimpRoot;
 };
 export default _default;

package/compat/dom.js

@@ -1,8 +1,9 @@
 import * as SimpReactDOM from '../dom/index.js';
 import * as SimpReactShared from '../shared/index.js';
+import { renderRuntime } from './renderRuntime.js';
 export const hydrate = SimpReactShared.noop;
-export const render = SimpReactDOM.render;
-export const createRoot = SimpReactDOM.createRoot;
+export const render = SimpReactDOM.createRenderer(renderRuntime);
+export const createRoot = SimpReactDOM.createCreateRoot(renderRuntime);
 export default {
     hydrate,
     render,

package/compat/hooks.d.ts

@@ -1,24 +1,27 @@
-import * as SimpReactHooks from '../hooks/index.js';
+import { type DependencyList } from '../hooks/index.js';
+import * as SimpReactShared from '../shared/index.js';
+export declare const useRerender: () => () => void;
+export declare const useState: import("../hooks/index.js").UseState;
+export declare const useEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+export declare const useLayoutEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+export declare const useInsertionEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+export declare const useRef: import("../hooks/index.js").UseRef;
+export declare const useCatch: (cb: (error: any) => void) => void;
 export declare function useSyncExternalStore<T>(subscribe: (callback: () => void) => () => void, getSnapshot: () => T): T;
 export declare function useReducer<R extends (state: any, action: any) => any, I>(reducer: R, initializerArg: I, initializer?: (arg: I) => ReturnType<R>): [ReturnType<R>, (action: Parameters<R>[1]) => void];
 export declare function useId(prefix?: string): string;
-export declare function useMemo<T>(factory: () => T, deps: SimpReactHooks.DependencyList): T;
-export declare function useCallback<T>(cb: T, deps: SimpReactHooks.DependencyList): T;
-export declare const useState: typeof SimpReactHooks.useState;
-export declare const useEffect: typeof SimpReactHooks.useEffect;
-export declare const useLayoutEffect: typeof SimpReactHooks.useEffect;
-export declare const useInsertionEffect: typeof SimpReactHooks.useEffect;
-export declare const useRef: typeof SimpReactHooks.useRef;
+export declare function useMemo<T>(factory: () => T, deps: DependencyList): T;
+export declare function useCallback<T>(cb: T, deps: DependencyList): T;
 declare const _default: {
     useSyncExternalStore: typeof useSyncExternalStore;
     useReducer: typeof useReducer;
     useId: typeof useId;
     useMemo: typeof useMemo;
     useCallback: typeof useCallback;
-    useState: typeof SimpReactHooks.useState;
-    useEffect: typeof SimpReactHooks.useEffect;
-    useLayoutEffect: typeof SimpReactHooks.useEffect;
-    useInsertionEffect: typeof SimpReactHooks.useEffect;
-    useRef: typeof SimpReactHooks.useRef;
+    useState: import("../hooks/index.js").UseState;
+    useEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+    useLayoutEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+    useInsertionEffect: (effect: SimpReactShared.Effect, deps?: SimpReactShared.DependencyList) => void;
+    useRef: import("../hooks/index.js").UseRef;
 };
 export default _default;

package/compat/hooks.js

@@ -1,8 +1,17 @@
-import * as SimpReactHooks from '../hooks/index.js';
+import { createUseCatch, createUseEffect, createUseRef, createUseRerender, createUseState, } from '../hooks/index.js';
+import * as SimpReactShared from '../shared/index.js';
+import { renderRuntime } from './renderRuntime.js';
+export const useRerender = createUseRerender(renderRuntime);
+export const useState = createUseState(renderRuntime);
+export const useEffect = createUseEffect(renderRuntime);
+export const useLayoutEffect = createUseEffect(renderRuntime);
+export const useInsertionEffect = createUseEffect(renderRuntime);
+export const useRef = createUseRef(renderRuntime);
+export const useCatch = createUseCatch(renderRuntime);
 export function useSyncExternalStore(subscribe, getSnapshot) {
-    const rerender = SimpReactHooks.useRerender();
-    const lastSnapshotRef = SimpReactHooks.useRef(getSnapshot());
-    SimpReactHooks.useEffect(() => {
+    const rerender = useRerender();
+    const lastSnapshotRef = useRef(getSnapshot());
+    useEffect(() => {
         function checkForUpdates() {
             const nextSnapshot = getSnapshot();
             if (!Object.is(lastSnapshotRef.current, nextSnapshot)) {
@@ -17,10 +26,10 @@ export function useSyncExternalStore(subscribe, getSnapshot) {
     return lastSnapshotRef.current;
 }
 export function useReducer(reducer, initializerArg, initializer) {
-    const rerender = SimpReactHooks.useRerender();
-    const reducerRef = SimpReactHooks.useRef(reducer);
+    const rerender = useRerender();
+    const reducerRef = useRef(reducer);
     reducerRef.current = reducer;
-    const stateRef = SimpReactHooks.useRef([
+    const stateRef = useRef([
         initializer ? initializer(initializerArg) : initializerArg,
         function dispatch(action) {
             const newState = reducerRef.current(stateRef.current[0], action);
@@ -35,7 +44,7 @@ export function useReducer(reducer, initializerArg, initializer) {
 }
 let globalId = 0;
 export function useId(prefix = 'id') {
-    const idRef = SimpReactHooks.useRef('');
+    const idRef = useRef('');
     if (idRef.current === '') {
         globalId += 1;
         idRef.current = `${prefix}-${globalId}`;
@@ -43,11 +52,11 @@ export function useId(prefix = 'id') {
     return idRef.current;
 }
 export function useMemo(factory, deps) {
-    const ref = SimpReactHooks.useRef({
+    const ref = useRef({
         deps: undefined,
         value: undefined,
     });
-    if (!SimpReactHooks.areDepsEqual(ref.current.deps, deps)) {
+    if (!SimpReactShared.shallowEqual(ref.current.deps, deps)) {
         ref.current.value = factory();
         ref.current.deps = deps;
     }
@@ -56,11 +65,6 @@ export function useMemo(factory, deps) {
 export function useCallback(cb, deps) {
     return useMemo(() => cb, deps);
 }
-export const useState = SimpReactHooks.useState;
-export const useEffect = SimpReactHooks.useEffect;
-export const useLayoutEffect = SimpReactHooks.useEffect;
-export const useInsertionEffect = SimpReactHooks.useEffect;
-export const useRef = SimpReactHooks.useRef;
 export default {
     useSyncExternalStore,
     useReducer,

package/compat/index.d.ts

@@ -12,14 +12,14 @@ declare const _default: {
     useId: typeof import("./hooks.js").useId;
     useMemo: typeof import("./hooks.js").useMemo;
     useCallback: typeof import("./hooks.js").useCallback;
-    useState: typeof import("../hooks/index.js").useState;
-    useEffect: typeof import("../hooks/index.js").useEffect;
-    useLayoutEffect: typeof import("../hooks/index.js").useEffect;
-    useInsertionEffect: typeof import("../hooks/index.js").useEffect;
-    useRef: typeof import("../hooks/index.js").useRef;
+    useState: import("../hooks/index.js").UseState;
+    useEffect: (effect: import("../shared/public.js").Effect, deps?: import("../shared/public.js").DependencyList) => void;
+    useLayoutEffect: (effect: import("../shared/public.js").Effect, deps?: import("../shared/public.js").DependencyList) => void;
+    useInsertionEffect: (effect: import("../shared/public.js").Effect, deps?: import("../shared/public.js").DependencyList) => void;
+    useRef: import("../hooks/index.js").UseRef;
     hydrate: typeof import("../shared/utils.js").noop;
-    render: typeof import("../dom/render.js").render;
-    createRoot: typeof import("../dom/render.js").createRoot;
+    render: (element: import("../shared/public.js").Nullable<import("../core/createElement.js").SimpElement>, container: import("../shared/public.js").Nullable<Element | DocumentFragment>) => void;
+    createRoot: (container: Element | DocumentFragment) => import("../dom/render.js").SimpRoot;
     Children: {
         map(children: import("../core/createElement.js").SimpNode, fn: (child: import("../core/createElement.js").SimpNode, index: number) => import("../core/createElement.js").SimpNode): import("../core/createElement.js").SimpNode[];
         forEach(children: import("../core/createElement.js").SimpNode, fn: (child: import("../core/createElement.js").SimpNode, index: number) => void): void;
@@ -30,6 +30,7 @@ declare const _default: {
     cloneElement: typeof import("./core.js").cloneElement;
     isValidElement: typeof import("./core.js").isValidElement;
     Suspense: typeof import("./core.js").Suspense;
+    StrictMode: typeof import("./core.js").StrictMode;
     forwardRef: typeof import("./core.js").forwardRef;
     Fragment: import("../core/fragment.js").Fragment;
     createElement: typeof import("../core/createElement.js").createElement;
@@ -37,7 +38,7 @@ declare const _default: {
     memo: typeof import("../core/memo.js").memo;
     flushSync: (value: any) => any;
     Component: typeof import("./core.js").Component;
-    createContext: typeof import("../context/index.js").createContext;
-    useContext: typeof import("../context/index.js").useContext;
+    createContext: import("../context/index.js").CreateContext;
+    useContext: import("../context/index.js").UseContext;
 };
 export default _default;

package/compat/renderRuntime.d.ts

@@ -0,0 +1,2 @@
+import type { SimpRenderRuntime } from '../core/internal.js';
+export declare const renderRuntime: SimpRenderRuntime;

package/compat/renderRuntime.js

@@ -0,0 +1,14 @@
+import { domAdapter } from '../dom/index.js';
+import { emptyObject } from '../shared/index.js';
+export const renderRuntime = {
+    hostAdapter: domAdapter,
+    renderer(component, element) {
+        return component(element.props || emptyObject);
+    },
+    elementToHostMap: new Map(),
+    renderStack: [],
+    currentRenderingFCElement: null,
+    renderPhase: null,
+};
+// TODO
+window.__SIMP_RUNTIME__ = renderRuntime;

package/component/index.d.ts

@@ -0,0 +1,16 @@
+import type { FC, SimpNode } from '../core/index.js';
+
+export type Cleanup = () => void;
+export type Effect = () => void | Cleanup;
+export type DependencyList = readonly unknown[];
+
+export interface ComponentRenderContext<S = {}> {
+  state: S;
+  rerender: () => void;
+  effects: Array<{ effect: Effect; deps?: DependencyList }>;
+  catchers: Array<(error: any) => void>;
+}
+
+declare function component<P = {}, S = {}>(Component: (props: P, ctx: ComponentRenderContext<S>) => SimpNode): FC<P>;
+
+export function componentRenderer(component: FC, element: SimpElement): SimpNode;

package/component/index.js

@@ -0,0 +1,164 @@
+import { lifecycleEventBus, rerender, SIMP_ELEMENT_FLAG_FC, } from '../core/internal.js';
+import { emptyObject, shallowEqual, } from '../shared/index.js';
+const componentSpecificStoreByElementStore = new WeakMap();
+function getComponentSpecificStore(store, renderRuntime) {
+    let hooksSpecificStore = componentSpecificStoreByElementStore.get(store);
+    if (!hooksSpecificStore) {
+        function _rerender() {
+            rerender(store, renderRuntime);
+        }
+        hooksSpecificStore = {
+            context: {
+                state: createState(_rerender),
+                rerender: _rerender,
+                catchers: null,
+                effects: null,
+            },
+            pendingEffectStates: null,
+            effectStates: null,
+        };
+        componentSpecificStoreByElementStore.set(store, hooksSpecificStore);
+    }
+    return hooksSpecificStore;
+}
+lifecycleEventBus.subscribe(event => {
+    if (event.type === 'errored') {
+        if (event.handled) {
+            return;
+        }
+        let element = event.element;
+        let curError = event.error;
+        let catchers;
+        while (element) {
+            if (!isComponentElement(element)) {
+                element = element.parent;
+                continue;
+            }
+            const store = getComponentSpecificStore(element.store, event.renderRuntime);
+            catchers = store.context.catchers;
+            if (!catchers) {
+                element = element.parent;
+                continue;
+            }
+            try {
+                for (let i = 0; i < catchers.length; i++) {
+                    catchers[i](curError);
+                }
+                event.handled = true;
+                break;
+            }
+            catch (error) {
+                element = element.parent;
+                curError = error;
+            }
+        }
+        return;
+    }
+    if (!isComponentElement(event.element)) {
+        return;
+    }
+    const store = getComponentSpecificStore(event.element.store, event.renderRuntime);
+    switch (event.type) {
+        case 'beforeRender': {
+            store.context.effects = [];
+            store.context.catchers = [];
+            store.pendingEffectStates = null;
+            return;
+        }
+        case 'afterRender': {
+            if (!store.context.effects) {
+                return;
+            }
+            for (let i = 0; i < store.context.effects.length; i++) {
+                const renderEffectState = store.context.effects[i];
+                let state = (store.effectStates ||= [])[i];
+                if (!state) {
+                    state = store.effectStates[i] = {
+                        effect: renderEffectState.effect,
+                        deps: null,
+                        cleanup: null,
+                    };
+                }
+                if (!shallowEqual(renderEffectState.deps, state.deps)) {
+                    state.effect = renderEffectState.effect;
+                    state.deps = renderEffectState.deps || null;
+                    (store.pendingEffectStates ||= []).push(state);
+                }
+            }
+            return;
+        }
+        case 'mounted': {
+            if (!store.pendingEffectStates) {
+                return;
+            }
+            const effects = store.pendingEffectStates;
+            store.pendingEffectStates = null;
+            for (const state of effects) {
+                if (typeof state.cleanup === 'function') {
+                    state.cleanup();
+                }
+                state.cleanup = state.effect() || null;
+            }
+            return;
+        }
+        case 'updated': {
+            if (!store.pendingEffectStates) {
+                return;
+            }
+            const effects = store.pendingEffectStates;
+            store.pendingEffectStates = null;
+            for (const state of effects) {
+                if (typeof state.cleanup === 'function') {
+                    state.cleanup();
+                }
+                state.cleanup = state.effect() || null;
+            }
+            return;
+        }
+        case 'unmounted': {
+            if (!store.effectStates) {
+                return;
+            }
+            const effects = store.effectStates;
+            store.effectStates = null;
+            for (const state of effects) {
+                if (state && 'cleanup' in state && typeof state.cleanup === 'function') {
+                    state.cleanup();
+                }
+            }
+        }
+    }
+});
+export function componentRenderer(component, element, renderRuntime) {
+    if (isComponentElement(element)) {
+        const store = getComponentSpecificStore(element.store, renderRuntime);
+        return component(element.props || emptyObject, store.context);
+    }
+    else {
+        return component(element.props || emptyObject);
+    }
+}
+export function component(Component) {
+    const Wrapped = ((props, ctx) => Component(props, ctx));
+    Wrapped._isComponent = 1;
+    return Wrapped;
+}
+export function createState(onChange) {
+    return new Proxy({}, {
+        set(target, prop, value) {
+            const prevValue = target[prop];
+            if (Object.is(prevValue, value)) {
+                return true;
+            }
+            const hadProperty = Object.hasOwn(target, prop);
+            target[prop] = value;
+            if (hadProperty) {
+                onChange();
+            }
+            return true;
+        },
+    });
+}
+export function isComponentElement(element) {
+    return element.flag & SIMP_ELEMENT_FLAG_FC && element.type._isComponent;
+}

package/context/index.d.ts

@@ -1,4 +1,4 @@
-import type { FunctionComponent, SimpNode } from '../core/index.js';
+import type { FunctionalComponent, SimpNode } from '../core/index.js';
 
 export interface ProviderProps<T> {
   value: T;
@@ -16,9 +16,16 @@ export type SimpContext<T> = {
 
 export type ContextType<C extends SimpContext<any>> = C extends SimpContext<infer T> ? T : never;
 
-export type Provider<T> = FunctionComponent<ProviderProps<T>>;
-export type Consumer<T> = FunctionComponent<ConsumerProps<T>>;
+export type Provider<T> = FunctionalComponent<ProviderProps<T>>;
+export type Consumer<T> = FunctionalComponent<ConsumerProps<T>>;
 
-declare function createContext<T>(defaultValue: T): SimpContext<T>;
+export interface CreateContext {
+  <T>(defaultValue: T): SimpContext<T>;
+}
+
+declare function createCreateContext(renderRuntime: SimpRenderRuntime): CreateContext;
 
-declare function useContext<T>(context: SimpContext<T>): T;
+export interface UseContext {
+  <T>(context: SimpContext<T>): T;
+}
+declare function createUseContext(renderRuntime: SimpRenderRuntime): UseContext;

package/context/index.js

@@ -1,64 +1,69 @@
-import { lifecycleEventBus, rerender } from '../core/internal.js';
-// In runtime these variables are nullable.
-let currentElement;
-let phase;
+import { lifecycleEventBus, MOUNTING_PHASE, rerender, } from '../core/internal.js';
 lifecycleEventBus.subscribe(event => {
-    if (event.type === 'beforeRender') {
-        currentElement = event.element;
-        phase = event.phase;
-    }
-    if (event.type === 'afterRender') {
-        currentElement = null;
-        phase = null;
-    }
-    if (event.type === 'unmounted') {
-        event.element.context?.forEach(value => value.subs.delete(event.element.store));
+    if (event.type === 'unmounted' && event.element.context) {
+        const contextMap = event.element.context;
+        for (const entry of contextMap.values()) {
+            entry.subs.delete(event.element.store);
+        }
     }
 });
-export function createContext(defaultValue) {
-    const context = {
-        defaultValue,
-        Provider(props) {
-            if (!currentElement.context) {
-                currentElement.context = new Map();
-            }
-            else if (phase === 'mounting') {
-                currentElement.context = new Map(currentElement.context);
-            }
-            if (phase === 'mounting') {
-                currentElement.context.set(context, { value: props.value, subs: new Set() });
-                return props.children;
-            }
-            let contextEntry = currentElement.context.get(context);
-            if (!contextEntry) {
-                contextEntry = { value: props.value, subs: new Set() };
-                currentElement.context.set(context, contextEntry);
-                return props.children;
-            }
-            if (Object.is(contextEntry.value, props.value)) {
+export function createCreateContext(renderRuntime) {
+    return defaultValue => {
+        const context = {
+            defaultValue,
+            Provider(props) {
+                const currentElement = renderRuntime.currentRenderingFCElement;
+                const renderPhase = renderRuntime.renderPhase;
+                let contextMap = currentElement.context;
+                if (!contextMap) {
+                    currentElement.context = contextMap = new Map();
+                }
+                if (contextMap && renderPhase === MOUNTING_PHASE) {
+                    currentElement.context = contextMap = new Map(currentElement.context);
+                }
+                if (renderPhase === MOUNTING_PHASE) {
+                    contextMap.set(context, { value: props.value, subs: new Set() });
+                    return props.children;
+                }
+                const entry = contextMap.get(context);
+                if (!entry) {
+                    contextMap.set(context, { value: props.value, subs: new Set() });
+                    return props.children;
+                }
+                if (Object.is(entry.value, props.value)) {
+                    return props.children;
+                }
+                entry.value = props.value;
+                for (const sub of entry.subs) {
+                    rerender(sub, renderRuntime);
+                }
                 return props.children;
-            }
-            contextEntry.value = props.value;
-            for (let sub of contextEntry.subs) {
-                sub.forceRender = true;
-                rerender(sub.latestElement);
-            }
-            return props.children;
-        },
-        Consumer(props) {
-            return props.children(currentElement.context?.get(context)?.value ?? defaultValue);
-        },
+            },
+            Consumer(props) {
+                const currentElement = renderRuntime.currentRenderingFCElement;
+                const contextMap = currentElement.context;
+                const store = currentElement.store;
+                const entry = contextMap?.get(context);
+                if (!entry) {
+                    return props.children(defaultValue);
+                }
+                entry.subs.add(store);
+                return props.children(entry.value);
+            },
+        };
+        return context;
     };
-    return context;
 }
-export function useContext(context) {
-    const contextEntry = currentElement.context?.get(context);
-    if (!contextEntry) {
-        // No provider above: just return the default value, don't subscribe
-        return context.defaultValue;
-    }
-    if (!contextEntry.subs.has(currentElement.store)) {
-        contextEntry.subs.add(currentElement.store);
-    }
-    return contextEntry.value;
+export function createUseContext(renderRuntime) {
+    return context => {
+        const currentElement = renderRuntime.currentRenderingFCElement;
+        const contextMap = currentElement.context;
+        const store = currentElement.store;
+        const entry = contextMap?.get(context);
+        if (!entry) {
+            return context.defaultValue;
+        }
+        entry.subs.add(store);
+        return entry.value;
+    };
 }